VcnStudio 轻舟开发文档

VcnStudio 轻舟是继承自 VcnStudio 平台中的一个新的、简单实用、易学易懂的基于 Basic 语法的快速开发平台;轻舟采用了全新的设计框架;你可以用使用它开发安卓、Linux、Windows桌面端、H5、小程序、网站服务器后端应用、并且只需要阅读一套语法、就可以实现全平台应用开发!

通用基础语法说明

由于各个平台间的语言差距较大、在完成对语法的统一编排后、为了优化及精简与源语言相同的格式、因此保留了部分源语言自带的格式。例如:由于 PHP 与微信小程序、WEB、JS开发时、逻辑语言为解释型脚本语言、因此在声明变量以及部分数据结构时、与编译型语言 JAVA 则不完全相同、其具体差异请阅读特定应用相关的文档。

产品方向说明

轻舟版本主打中文编码、快速开发、注重产品安全性与开发效率、运行效率;定位于给个人或企业针对中小型、实用型软件开发提供解决方案、同时也主要为个人工作室或原型产品提供快速开发的工具。

轻舟适用于

  • 对不懂英文、没有时间学习专业编程知识的、但对编程有兴趣的普通人

  • 长期定制软件、支出成本较高且成品不理想、想自己做软件的个人创业团队或中小型企业、商家

  • 需要可以自己控制的软件开发;不想让创意或想法被别人抄袭

  • 老师、学生、党政机关、社区工作者制作方便自己生活使用的等各种场景APP

视频教程

公开课程:https://space.bilibili.com/330302804
实战课程:http://bbs.vcnstudio.com/?c=course&a=index

VcnStudio 简介

VcnStudio 轻舟开发平台是由成都市鹿听科技于2023年4月发布的一款基于原生语言扩展的、轻量级中文编程开发平台、搭载自研编程语言轻舟(LightChar)、本土化中文编码、语法简单易懂、其目标是帮助编程初学者或爱好者、未学过专业编程的普通人、可以快速的通过中文代码学习软件应用开发、设计并制作自己的APP、应用软件或网站。

目前 VcnStudio 共支持下面四个平台的应用开发:

平台说明
安卓基于 Java 支持开发谷歌发布的 Android 系统 App 应用
视窗基于 JavaFX 支持开发Windows、Linux、MacOS等系统桌面或服务器应用。
小程序基于微信官方小程序开发框架;可开发微信小程序应用。
网站基于自研 WEB 框架;可开发H5手机网站、电脑网站、服务器后端 API 接口。

主要特性

  • 中文代码
    • 轻舟采用中文汉字作为第一开发语言;无需了解并学习大量的英文编程文档;自带中文组件、认识汉字即可开始编程制作软件;非常适用于不会英文但有编程需求的普通人。
  • 简单易懂
    • 轻舟抛弃了大部分编程初学者或非专业开发人员、不会经常使用、且难以理解的各种面向对象语言的编程特性和设计;采用了传统的、易学易懂的面向过程开发;同时保留了面向对象的基础特性;更适合普通人使用。
  • 扩展性强
    • 轻舟采用一套语法输出多端、最终将每个平台的程序都转译为主流的开发语言完成对应用的开发、因此每种应用都有其原生特性在里面、但是考虑到用户所开发的应用功能、以及担心成品局限性;以及在中文编程平台没有原生平台强大等问题、因此轻舟应用在编译时、都会预先输出原生工程源代码;无需担心对最终产品造成任何扩展瓶颈或功能限制。
  • 多线程支持友好
    • 针对支持多线程的应用、例如安卓、桌面端应用、轻舟加入了子程序引用、异步执行等相关的多线程语法糖、在使用多线程的时候、方式变得非常简单、同时在回调方面统一采用了接口回调方式、极大降低了使用反射带来的性能问题。
  • 丰富的库组件
    • 轻舟针对不同的平台应用、都封装了大量的基础支持库组件、同时也支持自定义组件以及使用第三方组件、在开发时只需要根据不同的功能选择合适的组件即可快速实现产品原型功能;可以极大的降低开发成本、缩短开发周期。

IDE所需环境

VcnStudio 采用 .Net 开发、因此在使用 VcnStudio 开发工具之前、必须先在电脑中安装 Microsoft .NET Framework 4.5 及以上版本的运行环境、也可到VcnStudio官方网站产品下载页下载;也可到官方QQ群下载。开发环境的硬件配置建议如下:

  • 操作系统采用Windows7及以上版本
  • 4G内存、64位操作系统
  • 注:不支持Windows XP操作系统

官方信息

  • 官网:www.vcnstudio.com
  • 开发者中心:http://dev.vcnstudio.com
  • 官方Q群:651580527
  • 邮箱:80852516@qq.com
  • 备案号:蜀ICP备17024229号

开发环境配置安装

  • IDE安装

  • 模拟器安装

  • 浏览器安装

  • WEB服务器安装

IDE安装

VcnStudio安装包为纯绿色集成开发环境、安装卸载不会在电脑上留下任何痕迹、当下载安装包之后、直接解压到指定文件夹即可使用、卸载时也只需删除安装目录即可、不会在用户电脑上留下任何一个缓存垃圾文件(部分插件SDK无法控制)。但这里需要特别注意:安装包解压到的目标文件夹路径不能含有任何空格或DOS命令符(尤其注意:Program Files)、我们建议在非C盘目录新建一个文件夹:并命名为“VcnStudio”然后将下载版本的安装包解压到该文件夹; 解压之后即可正常使用。

模拟器安装

由于 SDK 与IDE 只能负责开发时的工作、因此当我们成功编译出一个成品应用、例如:一个已编译好的 APK 文件、此时我们则需要一个设备安装这个APK、运行APP查看运行效果、一般如果我们有手机(真机)、则可以直接将APK安装包发送到手机上安装、然后查看最终效果;但是如果没有手机、且要对APP进行调试的时候、我们则需要使用 模拟器 而在我们实际项目开发中、有两个平台需要用到模拟器、一个是安卓平台、另一个是微信小程序。

  • 安卓模拟器
    • 安卓模拟器主要负责安卓APP的运行调试、如果你需要开发安卓APP应用、则需要安装安卓模拟器、如果你的设备(电脑)中已经安装有模拟器且使用正常、则无需再安装、以下为官方推荐的常用模拟器(注:官方推荐的不一定是最好的、也不一定能在你的电脑上正常运行、尤其是在win7、win10、受到CPU、虚拟化、显卡等影响时、有的模拟器无法使用、无法打开、无法启动都是正常情况、详细问题请参考模拟器官方解决方案或更换其他模拟器):
  • 微信小程序模拟器
    • 微信小程序没有单独的模拟器或预览工具、目前只能使用官方提供的开发工具、当我们在 VcnStudio IDE 中编译输出微信小程序项目后、使用小程序加载项目的编译输出目录后即可看的效果。详细教程请参考微信小程序文档。

浏览器安装

当我们开发一个网站或者网页时、要想运行并查看渲染效果、则需要安装浏览器;由于目前基本上所有电脑都已自带浏览器、因此如果当我们开发的网页可以在已安装的浏览器上正常运行时、则无需再安装其它浏览器。但如果要对网页进行断点调试或渲染不正常、或无法启用已安装浏览器的开发模式。此时我们则需要安装用于相对专业开发的浏览器、这里官方推荐使用谷歌浏览器。

  • 谷歌浏览器
    • 谷歌浏览器是由谷歌公司提供的一款网页浏览器、其稳定性、安全性、速度相对都比较出色、是一般开发者的首选工具。

WEB服务器安装

当我们要开发一个动态网站时、如果使用到 Mysql 或者数据储存等功能、则需要使用到云服务器或者数据库、因为动态网站的后端功能代码(例如登录、注册)一般都运行在云服务器中、而此时后端的代码在一般情况下、我们都不能直接在云服务器里面去写、因此如果要想在本地电脑写后端代码、我们就需要在本地创建或安装一个模拟云服务器的操作环境、从而实现对代码的自由调试、运行;当整个网站在本地测试没有任何问题时、再上传到云服务器中进行部署。

  • PHPStudy
    • 由于轻舟框架采用的后端开发语言为PHP、因此要想在本地开发PHP后端、则需要先在我们本地电脑中安装一个模拟PHP的环境、这里官方推荐使用 PHPStudy 工具、详细介绍可参考官方网站。
      • 官方下载 请下载Windows版本、根据你的电脑位数选择指定位数安装包。

项目工程结构

VcnStudio项目所有的工程都以源文件格式存在;即“文件夹-文件”结构;这样的工程目录是目前主流编程及专业开发者在工作中经过长时间的历史验证而得到的最优解;项目中的每一个文件、只在编译的时候、进行合并处理、开发过程中都是独立存在的、因此可以最大程度的保证工程项目的完整性、安全性、不会因为其中一个文件发生损坏或产生问题后、导致整个项目错误或作废。

目录格式

为了便于开发工具的管理和使用、工程目录的格式必须严格按照下方设置或创建:

  • 文件夹[项目名]/项目索引文件[项目名]

即:一个完整的工程项目、项目文件夹名称必须与项目索引文件的名称一致;例如:

  • 我的项目1/我的项目1.vsln

项目索引文件格式

项目索引文件、用于对项目命名、储存项目配置、记录项目信息、版本等;开发工具在打开项目时、需要通过并验证该文件的合法性然后在开发工具中加载并打开该项目。

VcnStudio 的所有项目索引文件格式均为:".vsln" 且一个项目中只能包含一个工程索引文件。

分享工程

将工程目录文件夹压缩后分享给待接收的用户即可、注:不可直接压缩工程目录中的文件、必须压缩含有工程名称的文件夹、如果工程文件较大、可删除 _build 编译输出文件夹。

使用GIT

VcnStudio 暂不支持使用Git或SVN进行源代码管理、但目前这项功能已纳入后期升级更新计划中。

协同开发

VcnStudio 暂不支持多人协同或远程实时操作开发、但目前这项功能已纳入后期升级更新计划中。

基础通用开发语法

由于各端平台所使用的基础开发语言存在较大差异性、在对基础语法进行统一编排后;虽然大致开发语法是一样的、但针对不同平台的实现仍然保留了部分源语言特性、以方便后期升级更新;因此针对不同的应用请阅读对应的开发文档、本文只对通用的开发语法做出说明。

开发规范

当我们编写应用程序时,应注意以下几点:

  • 大小写敏感 在编写代码时、大小写字母是不一样的标记;例如:变量A与a是两个不同的标识符。

  • 语句结束标记 在轻舟中使用换行符结束一句代码;即一行代码即为一句代码、不支持特殊换行处理。

  • 数据值比较 比较数据值是否相等;在小程序与网站开发时、可以通过“==”双等于符号进行比较;但在安卓与桌面软件开发中、比较基础数据类型或对象引用;可采用双等号。但比较文本字符串类型是否相等时、必须使用静态函数“取相等”比较、不能使用 "==" 双等于符号比较。

  • 窗口代码与界面对应 窗口代码文件名称必须与设计界面一一对应。

注释

轻舟与 VisualBasic 的注释一样、采用单引号开始、换行符结束、支持单行与多行注释格式、注释不参与编译、仅对程序代码做出解释说明;单行注释代码示例:

' 这是一行普通的注释内容
变量 a 为 文本型

多行注释格式:

''
' 这是一个多行注释内容、多行注释内容以两个单引号开始、两个单引号结束
' 由两个单引号包裹的内容、即为注释内容;在编写代码时会提示该内容
''
函数 获取数据()
    返回 "value"
结束 函数

注释内容在编写代码时会自动提示。

标识符

在代码中所有的变量名称、方法、事件名都被称为标识符。在对变量函数、方法命名时;需要注意以下几点:

  • 所有的标识符都只能以中文汉字、拼音字母或下划线(_)开始作为第一个字符

  • 首字符之后可以由中文汉字、拼音、下划线(_)或数字组成、不能包含任何特殊符号

  • 标识符不能含有操作符号、运算符号、或标点符号

  • 所有的关键字与内置函数不能用作标识符

  • 标识符是大小写敏感的

  • 合法的标识符例如:a、a1、网页地址、网页地址2、按钮_确定

  • 非法的标识符例如:123、123abc、#*aaa、55%、

变量

变量是指在代码中用于临时储存数据、并且该数据可以被修改的标记;在轻舟中支持以下三种变量:

  • 窗口变量 也称为页面成员变量、可在整个窗口或当前页面代码中使用。

  • 局部变量 只能在函数或事件内部定义、使用。

  • 全局变量(模块) 使用公用模块声明、并使用使用静态修饰符修饰、可以在整个应用中使用。

修饰符

像其他语言一样、轻舟可以使用修饰符来设置代码中变量与方法的作用域、也称为可访问域;例如给模块中的函数添加“静态”修饰符、那么在代码中就可以直接通过模块名称调用被该关键字修饰的函数;目前轻舟支持的修饰符如下:

  • 安卓与视窗

    • 私有

    • 静态

  • 微信小程序

    • 静态

注:后端API应用不支持修饰符

@

代码中特殊标记符;目前有两个功能:

  • @{ }

    • 原生代码嵌入语句、使用该操作符号可在代码中直接嵌入原生代码;例如在安卓与视窗程序代码中;可以通过 @{ } 包裹原生代码后直接在程序中使用;例如:

    • 事件 按钮2.被单击(来源对象 为 视图)
          ' 使用原生代码对指定数组进行排序
          变量 array = { 12,25,34,66,54 }
          @{
              for(int i = 0; i < array.length - 1; i++)
              {
                  for(int j = 0; j < array.length - 1 - i; j++)
                  {
                      if(array[j] > array[j + 1])
                      {
                          int temp = array[j];
                          array[j] = array[j + 1];
                          array[j + 1] = temp;
                      }
                  }
              }
          }
          标签1.标题 = 到文本(array)
      结束 事件
      
  • @[标记]

    • 指定文件父类或源类型;例如在安卓与视窗中;可以通过该符号+特点关键字指定窗口的父类;例如:

    • @父类 = 基础窗口其他
      

模板字符串

模板字符串又称为字符串内插标记、在轻舟中以“$”符号开头的字符串文本、将被识别为内插字符串、内插字符串允许在字符串类插入指定变量或不包含运算符的表达式、该功能常常在格式化输出文本内容时会被用到、例如:

事件 按钮1.被单击(源对象 为 视图)
    变量 a = 100
    标签1.标题 = $"50乘以2等于:{a}"
    标签2.标题 = $"今天是{取年()}年{取月()}月{取日()}日"
结束 事件

在上方代码中、修改标签1的标题时、目标字符串文本我们使用了“$”标识符、然后在字符串内部;通过花括号包裹变量a、当程序运行后、其 a 的值将等于变量值100 。其实简单的来说就是针对连接字符串变得更方便、因为上方的代码也等同于:

事件 按钮1.被单击(源对象 为 视图)
    变量 a = 100
    标签1.标题 = "50乘以2等于:" + a
    标签2.标题 = "今天是" + 取年() + "年" + 取月() + "月" + 取日() + "日"
结束 事件

注:模板字符串不支持插入数组、也不支持运算符号、不支持处理字符串中本身含有花括号的字符串。

文本字符串比较相等

在安卓与桌面软件开发中、比较两个文本字符串变量是否相等、不能使用“==”、也不能使用“=”符号、只能使用“取相等”函数。

其它

其他非通用开发语法请阅读对应开发文档。

基本数据类型

在软件开发中、编写代码时、常常会遇到各种不同格式的数据、例如:字符串、整数、小数等等。此时系统为了更好的对所储存的数据进行分类、就会产生数据类型的概念、不同的数据使用不同的标识符来标记。例如“10”是一个整数数据、“1.2”是一个小数数据。那么数据类型就自然的产生了。

在轻舟中、对于安卓与桌面端应用、以 Java 作为基础语言、因此存在7种基础数据类型和两种基础引用数据类型、而在网站开发、微信小程序 等应用中、没有数据类型。

安卓与桌面应用数据类型分为:

  • 基础数据类型
  • 引用数据类型

基础数据类型

七种基本数据类型、两种引用类型。

整数型(int)

  • 32位有符号整数类型
  • 最小值:-2,147,483,648(-2^31)
  • 最大值:2,147,483,647(2^31 - 1)
  • 默认:0
  • 例如:变量 a 为 整数型 = 10

短整数(short)

  • 16位有符号整数类型
  • 最小值:-32768(-2^15)
  • 最大值:32767(2^15 - 1)
  • 默认:0
  • 例如:变量 a 为 短整数 = 10

字节型(byte)

  • 8位有符号整数类型
  • 最小值:-128(-2^7)
  • 最大值:127(2^7-1)
  • 默认:0
  • 例如:变量 a 为 字节型 = 10

长整数(long)

  • 64位有符号整数类型
  • 最小值:-9,223,372,036,854,775,808(-2^63)
  • 最大值:9,223,372,036,854,775,807(2^63 -1)
  • 默认:0L
  • 例如:变量 a 为 长整数 = 10L
  • 说明:这种类型主要用在需要较大整数的系统上。

单精度小数(float)

  • 32位符合IEEE754标准的小数
  • 默认:0.0f
  • 例如:变量 a 为 单精度小数 = 1.2f

双精度小数(double)

  • 64 位、符合 IEEE 754 标准的浮点数
  • 默认:0.0
  • 例如:变量 a 为 双精度小数 = 1.2
  • 说明:默认代码中的小数为双精度小数类型

逻辑型(boolean)

  • 表示一位的信息、真或假
  • 默认:假
  • 例如:变量 a 为 逻辑型

引用类型

引用类型、即对象、自定义类型;例如:按钮、模块、或者自定义组件都为引用类型;所有的引用类型都可以强制转成对象、因为所有的引用类型都是对象类型、在 Simple 中支持两种基础的对象类型:

文本型(String)

  • 由双引号包裹的字符串文本数据
  • 默认:空 null
  • 例子:变量 url 为 文本型 = "http://www.vcnstudio.com"

对象

  • 所有引用类型及自定义类型的父类或者基类
  • 默认:空
  • 例如:变量 模块1 为 对象

强制类型转换

该类型转换仅在安卓与视窗桌面应用中支持、用于在传递对象时、或者获取对象时、通过强制转换获取对象的原本数据类型。例如:我们定义了一个函数、这个函数接收一个参数、这个参数可以为编辑框、也可以为按钮、那么就可以设置参数为 对象 类型、因为编辑框、按钮也属于对象。这样就可以在一个函数中处理两个组件。

代码演示:

事件 按钮1.被单击()
    修改数据(按钮1)
    修改数据(标签1)
结束 事件

函数 修改数据(待修改组件 为 对象)
    如果(待修改组件 类属 按钮)
        按钮 临时按钮 = (按钮)待修改组件
        临时按钮.标题 = "按钮被修改"
    否则
        标签 临时标签 = (标签)待修改组件
        临时标签.标题 = "标签被修改"
    结束 如果
结束 函数

上述代码在实际开发中、可能一般不会用到、但通过代码可以看出、只要定义函数的参数为对象类型、则按钮和标签都可以传给函数、如果当程序中需要在一个函数中处理多个不同类型的逻辑时、则可以采用这种方式。

注:基础数据类型不能转换成对象、也不能与对象类型的数据互相转换

运算符

计算机的最基本用途之一就是执行数学运算,作为一门计算机编程语言,轻舟也提供了一套针对非专业编程用户、但较实用的运算符来操纵变量、这有助于帮助大家快速入门、上手学习开发、目前轻舟支持以下几种运算符:

  • 算术运算符

  • 关系运算符

  • 赋值运算符

  • 其它运算符

算术运算符

算术运算符用在数学表达式中,它们的作用和在数学中的作用一样、可以在代码中对变量进行赋值运算操作、下表列出了所有的算术运算符:

运算符 描述
+ 加法 - 相加运算符两侧的值
- 减法 - 左操作数减去右操作数
* 乘法 - 相乘操作符两侧的值
/ 除法 - 左操作数除以右操作数
取余 - 左操作数除以右操作数的余数

代码演示(部分):

变量 a = 1 + 2
调试输出("a = " + a) ' 输出3
变量 b = 3 - 2
调试输出("b = " + b) ' 输出1

关系运算符

关系运算符、一般也称为条件运算符、主要用于比较值的关系、下面列出了轻舟中所有的关系运算符:

运算符 描述
== 检查如果两个操作数的值是否相等,如果相等则条件为真。
!= 检查如果两个操作数的值是否相等,如果值不相等则条件为真。
> 检查左操作数的值是否大于右操作数的值,如果是那么条件为真。
< 检查左操作数的值是否小于右操作数的值,如果是那么条件为真。
>= 检查左操作数的值是否大于或等于右操作数的值,如果是那么条件为真。
<= 检查左操作数的值是否小于或等于右操作数的值,如果是那么条件为真。

代码演示(部分)

变量 a = 1
如果(a == 1)
    调试输出("a等于1、成功")
结束 如果
如果(a > 2)
    调试输出("a不大于2、失败")
结束 如果

赋值运算符

赋值运算符、相对简单、其主要作用为:将右侧的值赋值给左侧、在轻舟中为了减少用户学习成本、降低用户上手难度、仅支持一个运算操作符。

运算符 描述
= 赋值运算符,将右操作数的值赋给左侧操作数

代码演示:

变量 a = 0 ' 将 0 赋值给a
标签1.标题 = "我是标题内容" ' 将字符串内容赋值给标签标题

循环结构语句

顺序结构的程序语句只能被执行一次;如果你想使同样的操作执行多次,就需要使用循环结构语句。在轻舟中有3种主要的循环结构语句、每个循环结构语句都有与之对应的唯一结束标志:"结束循环"、用以当不符合条件时结束循环。

  • 判断循环

  • 变量循环

  • 计次循环

判断循环

判断循环是最基本的循环结构语句、只要逻辑值、或逻辑表达式为真、则会进入循环体内一直执行下去;它的语句结构为:

判断循环(逻辑值 | 逻辑表达式)
    ' 循环内容
结束循环

实例代码:

变量 计次 为 整数型
判断循环(计次 < 10)
    ' 循环代码
    计次 = 计次 + 1
结束循环

上述代码解释:

  • 当变量 计次 的值小于10时、则进入循环体内、执行代码块内的循环代码。每次执行完循环代码、让变量计次的值加1;当计次大于10时、不符合条件则不会进入循环体内、而是跳到结束循环标志、退出循环。

使用该循环结构体时应当特别注意:

确保逻辑值有条件返回假、否则将会导致程序陷入死循环无法退出。

变量循环

变量循环;顾名思义是以变量为开始点、进行循环的结构语句体;因为该语句指定了初始值及目标值、因此在实际开发过程中使用的比较多。它的语句结构为:

变量循环(初始变量 = 初始值, 目标值, 递增值)
    ' 循环代码

结束循环

语句解释:

  • 参数一:初始值、指定从什么值开始循环
  • 参数二:目标值、指定循环到那个值就退出循环
  • 参数三:递增值、每次执行循环代码后初始变量增加的值

实例代码:

变量循环(初始值 = 0, 10, 2)

结束循环

上述代码解释:

  • 初始变量为0、目标值为10、每次循环后初始变量加2、当初始变量大于10时、将会退出循环。

计次循环

计次循环、是以次数限制循环为主要的循环结构体、多用于在处理循环时指定次数的场景。它的循环结构语句为:

计次循环(循环次数, 计次变量)
    ' 循环语句
结束循环

语句解释:

  • 参数一:循环次数、指定要循环的次数
  • 参数二:计次变量、循环递增计次的变量、每次递增加1、初始值必须为0

实例代码:

变量 计次 为 整数型
计次循环(10,计次)
    '代码执行语句

结束循环

上述代码解释:

  • 循环10次、计次变量从0开始、每次计次变量加1、当循环10次后退出循环。

退出循环

如果在执行循环语句过程中、我们不想等待全部循环结束再退出循环;那么可以使用关键字 "退出" break ;结束循环。例如在下方语句中;当计次等于5的时候、则退出循环:

变量 计次 为 整数型
判断循环(计次 < 10)
    如果(计次 == 5)
        退出
    否则
        ' 执行语句
    结束 如果
    计次 = 计次 + 1
结束循环

跳过循环

如果在执行循环语句过程中、我们想跳过某一次循环;那么可以使用关键字 "跳过" continue;跳过循环。例如在下方代码语句中;当计次等于5的时候、则跳过该次循环、但仍然会继续执行后续循环:

变量 计次 为 整数型
判断循环(计次 < 10)
    如果(计次 == 5)
        跳过
    否则
        ' 执行语句
    结束 如果
    计次 = 计次 + 1
结束循环

条件结构语句

条件语句主要根据判断逻辑条件的结果执行、使用关键字"结束" 后跟条件首关键字结束语句。 例如"如果"语句、假设条件为真、则执行代码块中的代码、目前轻舟支持以下几种条件语句:

  • 如果语句

  • 如果否则语句

  • 判断语句

如果语句

如果语句、根据条件判断是否执行语句中的代码块、使用 "结束 如果" 结束代码。如果条件为真、则执行、否则不执行、或者继续判断其它分支条件、一个如果语句中包含一个逻辑判断表达式、及一条或多条语句;语句结构为:

如果(逻辑值 | 逻辑表达式)
    ' 如果逻辑值或逻辑表达式为真则执行当前代码块中语句

结束 如果

实例代码:

变量 a 为 整数型
如果(a > 10)
    ' 待执行的代码

结束 如果

上述代码解释:

  • 如果变量a的值大于10、则执行如果语句代码块中的代码。

如果否则语句

如果否则语句、根据条件判断、如果条件成立执行如果代码块中的代码、如果不成立执行否则代码块中的代码。语句结构为:

' 如果 否则语句
如果(逻辑值 | 逻辑表达式)
    ' 执行条件成立的代码
否则
    ' 执行条件不成立的代码
结束 如果

' 如果 否则如果 语句
如果(逻辑值 | 逻辑表达式)
    ' 执行条件成立的代码
否则 如果(逻辑值 | 逻辑表达式)
    ' 执行条件另外成立的代码
否则 
    ' 执行条件都不成立的代码
结束 如果

实例代码:

变量 a 为 整数型
如果(a == 1)

否则

结束 如果

如果(a == 1)

否则 如果(a == 2)

否则

结束 如果

判断语句

判断语句、用于判断一个变量与一系列值中的某个值是否相等;一个判断语句块中可以包含多个分支条件、它的语句结构为:

判断(比较值 | 表达式)
    分支 待比较值
        ' 执行比较成功的代码
    分支 待比较值2
        ' 执行比较成功的代码
    分支 待比较值3
        ' 执行比较成功的代码
结束 判断

语句解释说明及使用规则:

  • 一个判断语句可以包含多个条件分支

  • 判断语句不支持默认的分支

  • 每条分支语句的 待比较值 后面必须为换行(语句结束符)、不得在后面执行代码

  • 比较值及表达式的值只能为基础数据类型和文本型、不能使用对象类型作为比较值

实例代码:

变量 a 为 整数型
判断(a)
    分支 1
        ' 执行比较成功的代码
        弹出提示("a等于1")
    分支 2
        ' 执行比较成功的代码
        编辑框1.内容 = "a等于2"
    分支 10
        ' 执行比较成功的代码
        弹出提示("a==10")
结束 判断

编程规范

由于轻舟是一门新的语言、有自己特定的语法结构、为了养成良好的编程习惯、以及培养编程思维、同时也有助于快速解决相关问题、针对使用轻舟进行软件开发时、我们制定了一些可以让编程工作变得更好、更方便的编程规范;请大家在进行开发时遵循以下规范:

注:本文仅用作轻舟(LightChar)语言在使用中文编码情况下使用、由于轻舟本身也支持英文编码、如果你习惯于使用英文或字母表编码、可忽略本文部分规范。

  • 命名

  • 代码格式

  • 多线程操作

  • 注释规约

  • 安全规约

  • 数据库规范

命名

  • 变量

    • 变量名称不能使用纯数字或数字开头、只能使用中文或字母开头
    • 组件名称按照类型名称加下划线加功能命名、例如:按钮_登录 也可不加下划线、直接使用类型加功能、例如:按钮登录、或 登录按钮
    • 窗口成员变量按照注释即功能做简约命名、例如:变量 用户名 为 文本型 ;严禁随意命名 a、b、c 或 与业务功能逻辑无关的名称。
    • 局部变量按照 局加下划线 命名、例如:变量 局_结果 为 文本型、也可直接使用符合上下文语义的名称、例如:变量 登录结果 为 文本型 ;研究使用 a b c 或与业务逻辑无关的名称。
    • 全局变量按照 全局加下划线命名、或使用符合上下文语义的名称。
  • 函数

    • 函数名称不能使用纯数字或数字开头、只能使用中文或字母开头
    • 遵循注释即名称的规范、根据上下文语义命名、例如:获取账号信息
    • 函数名称建议限制在32个字符内、不能超过125个字符
    • 一个窗口文件或模块中不能包含两个相同名称的函数
  • 窗口

    • 窗口名称不能使用纯数字或数字开头、只能使用中文或字母开头
    • 窗口名称按照窗口功能命名、不加任何前缀、但应该对不同功能类的窗口进行分组、例如:与用户有关的窗口、登录窗口、注册窗口、个人中心等应该放在用户分组中。

代码格式

  1. 轻舟采用换行符结尾一条语句、开发时必须严格按照一行代码即一条语句的格式
  2. 含有结束标志的语句、例如:如果、判断、函数、事件、循环类代码体等等 结束行与开始行必须独占一行、且开始结束标记必须匹配。
  3. 针对较复杂或上下文语义不清晰的函数或变量、必须添加注释内容。
  4. 函数名称与左括号不能含有空格。
  5. 含有缩进的代码必须严格按照4个空格的长度进行向内缩进、且同个层次的缩进长度必须保持一致、严禁上一行代码缩进3个空格、本行代码缩进5个空格、下一行代码又缩进1个空格的混乱情况。
  6. 一个函数内部的行数一般不得超过80行、超过80行应该将其代码功能进行拆分、或对功能实现重新设计。
  7. 一个窗口或类模块文件的代码行数不得超过800行、超过800应该对其代码做功能性拆分、将功能放到模块中。
  8. 使用 “判断” 或 “如果” 语句的时候、分支不应该超过30个、如果超过30个分支或条件、应该考虑更换其功能实现的思路。
  9. 使用“判断”或“如果”语句时、内部嵌套“否则 如果”不得超过3层、超过3层应该考虑使用返回语句、策略模式、状态模式等来实现。
  10. 从代码可维护性方面来说,良好的语义化代码有利于后期的迭代,函数或代码太长很难读懂,逻辑比较乱、会对后期维护更新造成很大影响。

多线程操作

  1. 严禁在子线程内更新窗口组件内容
  2. 严禁随意滥用线程、应该根据自身业务逻辑做出功能型评判后再使用。
  3. 耗时操作、或让程序产生卡顿、无响应操作的代码必须放在子线程中

注释规约

  1. 含有特定功能或处理重要业务逻辑的函数或代码必须添加注释
  2. 注释中必须能够准确反应实现思想和代码逻辑
  3. 注释中必须描述业务含义、在后期维护或更新时、能够快速让自己或其他程序员了解到代码背后的信息
  4. 注释中应该力求精简准确、表达到位、避免出现注释的一个极端:过多过滥的注释,代码的逻辑一旦修改,修改注释是相当大的负担。

安全规约

  1. 在不确定文本变量或对象是否为空的情况下、必须先检测对象是否为空、避免引发空指针异常。
  2. 如果组件存在"销毁对象"或"释放资源"的函数、在退出程序前、必须调用该方法
  3. 及时清理不再使用的变量或函数、避免程序过度臃肿,代码冗余
  4. 对于暂时注释掉的代码、应该在上方打上暂时注释原因
  5. 在使用 判断循环 代码语句体时、必须保证判断条件有假、即可以退出的情况;否则会造成程序死循环直接崩溃。
  6. 在使用一般循环体代码时、针对循环取数组成员变量、或取集合数据时、必须判断其索引是否小于成员数、例如:假设一个数组中只有5个元素、当使用下标5或超过5的索引去取数据时、程序将因为超出数组索引发生崩溃。
  7. 严禁在循环遍历中对数组或集合做删除操作。
  8. 当需要处理多个相同类型的变量时、应该首先使用数组

数据库规范

数据库一般不属于前端开发的工作;这里只针对一般开发时操作数据库相关的注意事项和规范;其规范如下:

  1. 数据库的编码格式必须设置UTF-8、如果设置为GBK、虽然也能支持中文、但不支持其他特殊符合、对后期的升级和维护可能会造成不可逆的影响。
  2. 表名非必要情况下、可以使用妥玛式拼音、如果会英文则使用英文、不建议使用中文作为表名。
  3. 字段与表名一样、非必要情况下、不建议使用中文。
  4. 如果使用云端数据库、例如:MYSQL 如果支持PDO引擎、必须以PDO方式操作数据库。
  5. 非必要情况下、严禁使用直链方式操作数据库、严禁将数据库远程地址、端口、直接以明文写在APP中。
  6. 除了主键以外、如果表中含有作为查询条件的字段、应该为其添加索引

初识IDE

为了帮助大家能更快的上手使用 VcnStudio 开发工具、本文将为大家简单的讲解 IDE 相关功能、由于 VcnStudio 目前支持多个平台的开发、每个平台的功能和界面并不完全一样、为了突出主题这里我们采用功能相对较多的安卓项目为大家讲解!

注:本文截图版本为 VcnStudio4.0 版本;后续更新版本可能会有所变动。

新建项目

当成功新建或打开加载一个安卓项目后

  • 左侧默认会显示三个窗口、分别为:
    • 支持库
      • 该窗口将会加载当前工程项目用到的所有SDK信息、即工程依赖文件、组件、类文件等等;在实际开发工作中可以在该窗口中查询指定组件或函数的使用方式。
    • 属性
      • 该窗口为可视化设计时的属性编辑窗口、例如:当我们打开一个页面设计窗口时、我们在页面中添加了按钮、标签等输入框组件、此时要修改按钮、输入框的属性、则在该窗口中修改。
    • 工程
      • 该窗口显示当前项目的所有工程文件和资源列表。

可视化设计

可视化设计对于非专业开发者、以及产品原型设计显得非常重要、而 VcnStudio 从诞生之初、就非常重视可视化设计开发、因为使用所见即所得的开发效果、可以极大的缩短产品原型开发时间、以及降低开发成本、这对一个快速开发工具来说、非常重要。

安卓窗口界面可视化设计

设计窗口与逻辑代码分离

方便写代码时参考界面设计。

自定义窗口布局

除了可视化设计以外、VcnStudio 还支持对工作区自定义布局、即可以自定义的调整窗口的显示位置、隐藏窗口等等;调整窗口位置时、只需要鼠标选中指定窗口、按下鼠标左键不要松开、然后拖动窗口、将其放在指定位置、例如下方:将底部窗口拖动到左侧下方显示。

注:虽然 VcnStudio 一直注重可视化设计的开发、但对于专业开发人员来说、可视化设计有利有弊、在对复杂场景、以及各种动态交互场景时、单纯的使用可视化设计并不友好、因此大家在实际开发过程中、应该根据自身产品特性和功能选择更符合自己需求的方式。

设计器

设计器使用相对简单、这里仅对在开发过程中可能遇到的部分问题做出解答:

  • 如何添加组件到设计窗口?

    • 在右侧组件箱使用鼠标左键单击选中目标组件后松开鼠标;然后在设计器中按下鼠标左键并移动鼠标绘制矩形或长方形;绘制完毕松开鼠标左键;组件即会被添加到设计器中;

    • 注意:线性布局无法绘制;在设计器指定位置单击鼠标左键再松开即可。

  • 如何多选组件、移动、复制组件?

    • 在设计器中按下鼠标左键(不松开)然后框选要选中的组件;松开鼠标后即可选中要选择的组件。
  • 设计器无法使用键盘光标键移动位置?

    • 正常情况、暂不支持。

代码编辑器

  • 代码块快捷添加

  • 快速添加组件事件

代码块快捷添加

在编写代码时;VcnStudio IDE 提供了一些常见关键字语句的代码块生成;以下关键字在输入后、按下电脑键盘上的 Tab 键;会自动完成代码块:

  • 如果

  • 判断

  • 函数

  • 循环

  • 计次循环

  • 判断循环

  • 异步执行首

  • 异常捕获首

快速添加组件事件

当在代码中创建并使用组件时;如果要接收组件的回调事件、例如:时钟 组件;那么只需要将组件对象声明为窗口成员;然后鼠标选中组件名称;右键添加事件即可为组件添加事件;注意:如果组件被声明在局部函数或事件中、那么将无法添加窗口事件。

' 声明一个时钟组件变量
变量 时钟1 为 时钟

事件 窗口创建完毕()
 时钟1 = 创建 时钟()
结束 事件

事件 时钟1.周期事件(源对象 为 时钟)

结束 事件

鼠标选中"时钟1"然后右键添加事件。

添加窗口事件

在代码编辑器的任意空白位置;右键菜单:添加事件 弹出的对话框则是窗口事件;双击指定事件即可添加。

轻安卓工程项目结构

本章将为你介绍安卓工程项目源代码结构;在了解详细的工程源码结构后;以便于你能更好的进行开发或对项目的管理工作、以下为一个完整项目的目录结构及必要文件:

  • assets 仓库;存放不进行编译但会被打包到APK的静态文件

  • layout 存放APP界面设计文件

  • libs 存放第三方jar包

  • res 存放APP中可能用到的图片、XML资源文件

  • src 工程源代码文件目录

  • App.spl 应用入口文件

  • *.vsln 项目索引文件

  • _build 编译输出文件夹

  • src.package 源包;存放 Java 源代码的文件夹

assets

该文件夹对应安卓原生工程中的 assets 文件夹、在IDE中对应项目列表中的“仓库”节点、该文件夹主要存放图片、或者其他项目用到的静态文件、这些文件在编译时不会做任何额外处理、会直接全部复制到编译目录中的 assets 文件夹中。

layout

该文件夹主要存放应用的界面可视化设计文件、文件格式为".xml"、每一个窗口代码文件对应一个设计文件、该文件只允许通过窗口右键代码的设计器菜单项调用。

libs

该文件夹主要存放第三方Jar包、如果要在项目中直接使用某个或某些Jar包文件、则可以将jar文件放在该文件夹内、在代码中通过“引用”指定的类或包使用。

res

该文件夹对应原生安卓工程中的 res 文件夹、在IDE中对应项目列表中的“资源文件”节点、该文件夹中只能存放图片以及 xml 文件、且文件名只能为 小写字母开头 + 数字 或 下划线 组成下的文件名。

src

该文件夹中主要存放窗口代码、模块代码、服务代码等文件。

App.spl

该文件为整个APP应用的启动入口文件、也是轻安卓框架中 APP 的启动主类、继承自 MainActivity 类、当应用每次重新打开、或启动的时候、都会先执行该文件、开发者可以在该文件中添加应用初始化相关代码。

*.vsln

工程索引文件、每次IDE加载项目时将从该文件中加载、该文件必须与工程目录同名、且每个项目中只能存在一个项目索引文件。

src.package

源包文件夹;默认项目没有文件夹;如有需要可以自行在项目文件夹中创建名称为”src.package“的文件夹、然后复制 java 代码及相关包到该文件夹中;即可在代码中引用相关类使用其功能。

安卓开发语法

基础语言结构

在安卓中每一个独立的源代码(窗口、模块、自定义组件)文件都是由以下几个部分组成:

  • 引用

    • 用于在代码中添加原生类的引用、与英文关键字 import 用法一样。
  • 变量/数组

    • 用于在程序中声明可能用到的储存临时数据的标记、其中又分为全局变量、页面成员变量、及局部变量
  • 事件

    • 用于在程序中接收用户针对程序发出的操作;例如:在窗口中接收并监听按钮被用户单击事件
  • 函数

    • 用于对程序中业务逻辑的封装、代码调度。
  • 定义

    • 用于在程序中定义结构体、回调事件的实现类。

引用

与 Java 的 import 功能一样、通过引用关键字可以在程序中的源文件代码中;例如:窗口、模块、或自定义组件(.sc)文件中使用原生的、扩展的数据类型;例如:

引用 android.widget.Button
引用 java.io.*

注:若使用Jar包文件、只需要将 jar 文件放在项目的 libs 文件夹内即可像 Java 使用 jar 一样使用。

变量

在安卓中、声明变量的格式与 VB 语言基本一致;但除了基本的声明格式外、还支持自动类型推断;其格式为:

变量 标识符 为 数据类型
变量 标识符 为 数据类型 = 初始化数据
变量 标识符1,标识符2,标识符3,... 为 数据类型
变量 标识符 = "数据值"
变量 标识符 = 创建 类型()
...

示例代码:

变量 A 为 文本型
变量 a 为 文本型
变量 网址URL 为 文本型
变量 x,y 为 整数型
变量 m 为 文本型 = "vcnstudio"
变量 pi 为 双精度小数 = 3.14159
变量 url = "http://www.vcnstudio.com"
变量 an1 = 创建 按钮() 
变量 x1,y1 = 0

变量类型自动推断

类型自动推断、即在声明变量的时候无需显示的指定变量属于什么数据类型;编译器在编译时通过初始值确定变量类型;因此使用自动推断变量类型必须为变量设置其初始值、格式为:

变量 变量名称 = 初始值
变量 变量名称 = 创建 对象类型()

默认支持的自动类型推断支持以下类型;代码示例:

变量 a = "文本类型变量"
变量 b = 100 ' 整数型
变量 c = 真  ' 逻辑型
变量 d = 1000L ' 长整数
变量 e = 1.5   ' 双精度小数
变量 f = 1.2f  ' 单精度小数
变量 g = 创建 按钮() ' 按钮对象
变量 h = 取随机数(10,20) ' h为函数返回值、整数型

需注意:自动推断需要依靠变量的初始值确定变量类型;因此声明变量时必须设置初始值、且初始值必须为常量、或创建对象、或为对应框架的内置函数。

数组

数组在程序开发中是一种非常常见的数据体、可以将多个相同类型的数据组成一个整体使用、在处理或要传递多个数据时、使用数组是一种非常常见的方式、数组的声明格式为:

变量 变量名称 为 数据类型[] = { 初始化值 }
变量 变量名称 为 数据类型[]
变量 变量名称 为 数据类型[10]

代码示例:

变量 a 为 文本型[] = { }  '定义一个空数组
变量 b 为 文本型[] = { "vcn","studio" } '定义一个文本数组、并设置初始值
变量 c 为 整数型[] = { 1,2,3 }  '定义一个整数型数组、并设置初始值
变量 d 为 文本型[]  '定义一个文本型数组、不设置初始、默认为空对象
变量 e = { "vcn", "studio" }  '定义一个文本数组
变量 f = { 1,2,3 }  '定义一个整数数组

注意:数组仅支持基本数据类型推断;不支持对象、变量或函数作为初始值。

事件

用于在程序中与用户交互的重要操作。

  • 定义事件

    • 轻舟支持在模块或自定义组件中;定义向外分发的事件;定义事件格式:

      公开 事件 数据被调用(参数 为 文本型)
      
  • 接收事件

    • 接收用户操作的回调;例如:监听用户点击了窗口中的按钮;我们要在代码中接收这个点击事件、并向用户弹出一个提示:

      事件 按钮1.被单击(来源对象 为 视图)
          '当用户点击窗口中的按钮组件、将会触发该事件
          弹出提示("用户点击了按钮1、我弹出了一个提示回应用户!")
      结束 事件
      

      注意:事件是组件特有的属性、一般由组件开发者封装好指定事件、普通开发者无需关心事件的具体实现方式、只需要使用事件即可。

函数

函数可以理解为是由一条或多条语句的集合、比如一个函数中有多条语句、而多条语句共同处理一个计算或逻辑、在一起执行某个功能。

  • 函数的分类:

    • 无返回值函数
    • 有返回值函数
  • 函数修饰符

    • 私有

    • 静态

函数声明格式:

'无返回值函数
函数 [修饰符] 函数名称(参数1 为 数据类型,参数2 为 数据类型)

结束 函数

'有返回值函数
函数 [修饰符] 函数名称(参数1 为 数据类型,参数2 为 数据类型) 为 数据类型
    返回 ...指定类型值
结束 函数

示例代码:

' 无返回值函数
函数 设置按钮标题(内容 为 文本型,按钮对象 为 按钮)
    按钮对象.标题 = 内容
结束 函数

'有返回值函数
函数 计算面积(长 为 整数型,宽 为 整数型) 为 整数型
    返回 长 * 宽
结束 函数

注:未添加修饰符的函数默认为公开修饰

定义

在轻舟中定义关键字用于自定义结构体数据类型、回调接口实现类。

  • 定义自定义结构体

    定义 坐标 为 结构
        变量 X 为 整数型
        变量 Y 为 整数型
    结束 定义
    
  • 定义回调事件实现

    按钮1.置被单击回调(监听按钮被单击回调)
    按钮2.置被单击回调(监听按钮被单击回调)
    '....
    定义 监听按钮被单击回调 为 视图.被单击回调
        事件 被单击(被单击组件 为 视图)
            变量 被单击按钮 = (视图)被单击组件
            弹出提示("按钮 " + 被单机按钮.标题 + " 被单击")
        结束 事件
    结束 定义
    

    上述代码释义:

    监听按钮被单击回调:自定义的接口回调名称、用于在组件设置回调时使用。

    视图.被单击回调:组件中的接口类、用户无需关心具体实现方式

    被单击:接口中的回调事件

    执行说明:当给按钮1、按钮2注册这个回调接口后、当用户点击按钮1、按钮2就会触发这个接口里面的“被单击”事件、此时事件中返回的 被单击组件 就是被单击的按钮对象。我们再判断按钮对象为那个按钮即可知道用户单击的按钮是那一个;从而执行相关的代码。

自定义数据结构

自定义数据类型;例如:坐标结构、包含X、Y值;矩形结构、包含长宽值。在实际开发工作中、往往会遇到需要处理多条数据或一个类型的数据任务时、将多个数据封装成一个结构体、将会是一个非常友好的操作;例如开发一个阅读APP、阅读APP中会涉及到对书本的处理、如果我们将书本结构封装成一个结构体、那么在开发过程中、对数据的管理或传递、都相对非常方便。

定义语法

一个合法的自定义结构类型使用“定义”关键字定义、其结构体中只能包含内部成员变量、成员变量个数无限制、但不能包含构造函数、自定义函数、事件或回调对象;同时内部成员变量不能使用任何修饰符;语法如下:

定义 结构体名称 为 结构
    变量 成员变量1 为 数据类型
    变量 成员变量2 为 数据类型
    ...
结束 定义

注:结构体中不支持一个变量语句定义多个成员变量、即每行只能定义一个变量成员。

创建结构体

在IDE中新建模块、选择结构体模板、点击确定即可;一个项目中可以创建多个结构体模块、每个结构体模块文件中可以定义多个结构;结构体模块文件后缀为:.st

注:在窗口中也可以定义结构体数据、但为了便于管理、建议将结构体数据定义在专门的文件中。

代码示例:

定义 书本 为 结构
    变量 书名 为 文本型
    变量 价格 为 整数型
    变量 描述 为 文本型
结束 定义

定义 坐标 为 结构
    变量 X 为 整数型
    变量 Y 为 整数型
结束 定义

事件 按钮1.被单击(来源对象 为 视图)
    变量 书本1 = 创建 书本()
    书本1.书名 = "汤头歌诀"
    书本1.价格 = 9
    书本1.描述 = "是清代汪昂撰古代医方著作、共一卷、刊于1694年、书中选录中医常用方剂300余方。"
    ' 方便传递数据、可以直接将 书本1 这个对象赋值给标签的标记
    标签1.标记 = 书本1

    变量 坐标1 = 创建 坐标()
    坐标1.X = 0
    坐标1.Y = 1
    标签2.标记 = 坐标1

    ' 结构体数据默认支持全成员构造函数
    变量 坐标2 = 创建 坐标(10,20)
    标签3.标记 = 坐标2
结束 事件

事件 按钮2.被单击(来源对象 为 视图)
    变量 书本对象 为 书本 = 标签1.标记
    调试输出("从标签1中取出储存的书本:" + 书本对象.书名 + ";" + 书本对象.价格)
结束 事件

注意:每个结构体数据都为全局数据类型、在整个项目中的模块、窗口中都可以使用、因此整个项目中不能包含相同名称的结构体。

事件与回调

事件在轻舟中表示外部(用户)对程序内某个组件或对象产生动作的描述;例如:用户点击了按钮、用户打开窗口、窗口加载完毕等等;因此事件也是一种编程机制,它允许我们(开发者)监听用户的操作和行为并同时对组件产生的变化做出响应;在安卓中支持以下方式对不同类型事件进行监听并执行相关操作:

  • 普通组件事件

  • 子程序引用

  • 监听多个事件回调

  • 跨窗口传递事件

  • 自定义事件

普通组件事件

针对窗口中的可视与不可视组件、轻舟支持像 VB、C# 那样通过面向过程的方式、采用事件驱动向开发者回调事件、这种事件回调方式简单易懂、也是初学者相对使用最多、最容易让人理解的一种、但这种事件一般只适合处理单一事件的回调。

代码示例:

'仅当窗口中的按钮1被用户点击后、触发该事件、参数被单击对象为按钮1
事件 按钮1.被单击(被单击对象 为 视图)

结束 事件

'自定义组件的对象、当我们在窗口代码里面自定义一个按钮组件时、添加其单击事件
变量 按钮A 为 按钮
事件 窗口创建完毕()
    按钮A = 创建 按钮()
    '将组件添加到窗口中
    添加组件(按钮A)
结束 事件

'选中 按钮A 变量名称然后右键菜单、添加组件事件、即可自动生成该事件代码
事件 按钮A.被单击(被单击对象 为 视图)
    '当按钮A被单击时触发该事件
结束 事件

子程序引用

熟悉 C 或 C++ 的朋友应该都知道指针、通过指针我们可以直接取出、或者传递一个函数的地址、简单的来说、即可以把函数当作参数传递给其他函数调用、这在实际编程开发工作中往往会非常方便、轻舟也借鉴了这一思想、在开发中、尤其是对非组件事件的回调、支持直接用 "&加上函数名" 即可把待操作的函数当作参数传递给方法、这种方式对待调用的函数自由度相对较高、无需特定函数名、但需要保证参数名与所需函数一致、且函数不可有返回值的场景、常用于为不可视组件对非组件对象添加事件回调、例如启动线程、或设置自定义回调。

代码示例:

'启动线程调用一个子程序、让子程序在线程中执行
事件 按钮1.被单击()
    启动线程(&获取网页源码)
结束 事件

' 该函数将会在子线程中执行
函数 获取网页源码()
    变量 结果 为 文本型
    结果 = 取网页源码("http://www.baidu.com","UTF-8",5000)
    '注意这里取回的结果仍然是在子线程中、不能直接修改界面内容
    调试输出(结果)
结束 函数

'除了调用子程序外、还可以给组件设置回调事件、这里动态创建10个按钮并设置其当按钮被单击时的回调事件
函数 按钮1.被单击()
    变量 i 为 整数型
    计次循环(10,i)
        变量 btn 为 按钮
        btn = 创建 按钮()
        btn.标题 = "按钮" + i
        btn.置被单击回调(&按钮被单击回调)
        垂直滚动框1.添加组件(btn)
    结束 循环
结束 函数

函数 按钮被单击回调(来源对象 为 视图)
    '这里返回的参数视图则为被单击的按钮、如果需要使用按钮需要强制转成按钮类型
    变量 被点击按钮 为 按钮 = (按钮)来源对象
    弹出提示(被点击按钮.标题)
结束 函数

使用“&”符号引用的子程序函数的参数类型和格式、可以在IDE支持库中查询指定组件接口中的事件、例如:上方我们给动态创建的按钮设置的 被单击回调 子程序函数、这个函数是我们自定义的、但是这个函数中具体的参数、则可以在IDE支持库窗口中找到按钮组件、再找到按钮节点下的“被单击回调”接口、这个接口中的参数即是我们需要设置的参数。

监听多个事件回调

使用普通事件及子程序引用的方式、都只能实现对单个组件添加处理回调事件、如果遇到需要同时监听多个回调事件的情况时、则需要使用事件回调接口来处理、例如:当我们向服务器发送一个网络请求时、请求结果有可能是失败的、也有可能发生错误、此时如果使用单一事件回调、则无法同时处理请求成功、请求失败、或者请求错误的情况、如果使用回调接口、则可以很方便同时处理。

代码示例:

事件 按钮1.被单击()
    变量 异步请求1 = 创建 异步网络操作()
    'task1 为请求的标记
    异步请求1.发送POST请求链("task1","http://www.vcnstudio.com/post","id=1&name=vcn","UTF-8",5000)
    异步网络1.置请求回调(异步请求回调1)
结束 事件

定义 异步操作回调 为 异步网络操作.请求完毕回调
    事件 请求发送成功(标记 为 文本型,响应头 为 哈希表,返回数据 为 字节型[])
        变量 结果 = 字节集到文本(返回数据,"UTF-8")
        标签1.标题 = $"请求标记:{标记} 请求发送成功;返回数据为:\n{结果}"
    结束 事件

    事件 请求发送失败(标记 为 文本型,响应头 为 哈希表,返回数据 为 字节型[],错误信息 为 文本型)
        标签1.标题 = $"请求标记:{标记} 请求发送失败;错误信息:{错误信息}"
    结束 事件
结束 定义

跨窗口传递事件

在实际开发时、除了组件自己的回调事件外;在程序中也可能遇到自身事件回调的场景、例如:跨窗口传递数据、在窗口中接收模块返回的数据等;在遇到这种需求时、则可以通过事件消息来完成;以下为代码演示在窗口中接收模块返回的数据;代码应用场景:在模块中完成一系列耗时操作、获得数据后、将结果发送给窗口;然后显示结果。

窗口代码:

事件 窗口创建完毕()
    ' 使用系统函数注册接收消息的子函数
    接收事件消息(&接收模块消息)
结束 事件

函数 接收模块消息(消息ID 为 整数型,消息值 为 对象)
    如果(消息ID == 1)
        标签1.标题 = "我是模块1发过来的消息;消息值为:" + 到文本(消息值)
    否则 如果(消息ID == 2)
        标签1.标题 = "我是模块2发过来的消息;消息值为:" + 到文本(消息值)
    结束 如果
结束 函数

事件 按钮2.被单击(来源对象 为 视图)
    模块2.获取网页源码("http://www.vcnstudio.com")
结束 事件

模块代码:

' 模拟耗时操作获取网页源码后;发送结果到主窗口
函数 静态 获取网页源码(地址 为 文本型)
    异步执行
        变量 源码 = 取网页源码(地址,"UTF-8",5000)
        ' 事件消息的发送与接收都必须在主线程中操作
        到主线程
        发送事件消息(2,源码)
    结束 异步执行
结束 函数

自定义事件

自定义事件一般多用于在封装自定义组件时使用;例如:在项目中直接封装自定义组件;且需要向外传递组件的回调事件时;则需要自定义回调事件;在轻舟中为自定义组件定义回调事件非常简单;只需要一行代码即可完成:

公开 事件 事件名称(参数 为 文本型)

例如:我们在一个自定义搜索框组件中定义了一个”搜索被触发“事件

公开 事件 搜索被触发(关键字 为 文本型)

在窗口中使用:

搜索框1.置搜索被触发回调((关键字)->{
    弹出提示(关键字)
})

多线程操作

多线程是指从软件或者硬件上实现多个线程并发执行的技术、可以同时通过异步方式处理多条数据或任务、例如当遇到需要在同一时间获取大量后端数据进行初始化的业务场景时、或者要执行某些耗时操作的计算、使用多线程将不会引起程序卡顿;在轻舟中针对不同的业务场景支持多种多线程操作:

  • 异步执行语句

  • 线程组件

  • 内置线程函数

  • 异步函数

  • 线程使用案例

异步执行语句

该方式是使用多线程较为灵活的一种方式、适合在代码的任何位置使用;使用方法为:通过“异步执行首”、”异步执行尾“关键字包裹指定代码、被包裹的代码将会以子线程方式运行;例如:

事件 按钮1.被单击(源对象 为 视图)
    异步执行首
        变量 a = 取网页源码("","UTF-8",5000)
    异步执行尾
    ' 上方获取网页源码的代码将会在子线程中执行、而APP界面将不会产生卡顿、
    ' 但需要注意、在上方由“异步执行”包裹的代码块中不能直接将获取的值显示
    ' 到窗口组件中;因为在子线程中不能直接更新UI
    ' 但可以通过“到主线程”关键字、将线程切换到主线程、就可以更新窗口组件内容了
    ' 例如下方代码
    异步执行首
        变量 a = 取网页源码("","UTF-8",5000)
        变量 b = 取网页源码("","UTF-8",5000)
        到主线程
        编辑框1.内容 = a
        编辑框2.内容 = b
    异步执行尾
结束 事件

线程组件

该方式不同于第一种方式;而是使用线程组件来实现多线程的操作;适用于模块化开发、嵌套式、连续式、递归式数据处理、高并发同时需可控的业务场景中;以下为代码示例:

变量 线程1 为 线程
事件 按钮1.被单击(来源对象 为 视图)
    线程1 = 创建 线程()
    线程1.启动线程(&子线程获取数据,&线程1收到消息)
结束 事件

函数 子线程获取数据()
    变量 a 为 文本型
    a = 取网页源码("http://www.baidu.com","UTF-8",5000)
    '获取到后端数据后、发送给主线程
    线程1.发送消息(1,a)
    '此时如果要想获取其他数据、可以继续获取后继续发送
    变量 b 为 文本型
    b = 取网页源码("http://www.sohu.com","UTF-8",5000)
    线程1.发送消息(2,b)
结束 函数

'当在子线程中发送消息时、这个主线程的函数将会立即收到消息
函数 线程1收到消息(消息ID 为 整数型,消息值 为 对象)
   如果(消息ID == 1)
       编辑框1.追加文本行("源码1的内容:" + 到文本(对象))
   否则 如果(消息ID == 2)
       编辑框1.追加文本行("源码2的内容:" + 到文本(对象))
   结束 如果
结束 函数

内置线程函数

该方式采用内置函数“启动线程”实现多线程、使用简单、但功能较为单一;适用于一般较为简单的单线程、单任务的场景中;以下为代码演示:

事件 按钮1.被单击(来源对象 为 视图)
    启动线程(&子程序1)
结束 事件

函数 子程序1()
    调试输出("我是在子线程中执行的代码;可执行耗时操作")
结束 函数

异步函数

将函数在多线程中执行;与异步执行语句类似。

函数 获取网页数据并显示(URL地址 为 文本型) 为 异步
   变量 结果值 为 文本型
   结果值 = 取网页源码(URL地址,"UTF-8",5000)
   到主线程
   编辑框1.内容 = 结果值
结束 函数

线程使用案例

由于线程是在后台运行、并且不会卡程序、也不会使界面卡顿;因此非常适合作为后台常驻线程、执行后台循环任务、例如这里我们每隔2秒获取一次热点信息:

变量 线程1 为 线程
变量 执行任务 为 逻辑型
事件 按钮1.被单击(来源对象 为 视图)
    线程1 = 创建 线程()
    执行任务 = 真
    线程1.启动线程(&子线程获取数据,&线程1收到消息)
结束 事件

事件 按钮1.被单击(来源对象 为 视图)
    执行任务 = 假
结束 事件

函数 子线程获取数据()
    变量 a 为 文本型
    判断循环(执行任务)
        a = 取网页源码("http://www.hotmsg.com","UTF-8",5000)
        线程1.发送消息(1,a)
        延时(2000)
    结束循环
结束 函数

函数 线程1收到消息(消息ID 为 整数型,消息值 为 对象)
   如果(消息ID == 1)
       编辑框1.追加文本行("新的数据:" + 到文本(对象))
   结束 如果
结束 函数

自定义列表框

本章将为大家讲解如何在安卓开发中自定义两种常见的列表框、分别为条形列表框、和宫格列表框。

  • 普通列表框

  • 宫格列表框

普通列表框

按照行显示内容的列表框、我们需要使用 列表框 组件、该列表框可以显示多行内容、且继承自安卓原生类的:ListView 组件、以下为在 Simple 中演示如何自定义一个简单的文本列表框的代码演示:

变量 项目数据 为 集合
变量 列表框1 为 列表框
事件 按钮1.被单击(来源对象 为 视图)
    项目数据 = 创建 集合()
    项目数据.添加项目("项目1")
    项目数据.添加项目("项目2")
    项目数据.添加项目("项目3")
    列表框1 = 创建 列表框()
    列表框1.左边 = 0
    列表框1.顶边 = 0
    列表框1.高度 = 300
    列表框1.宽度 = 取屏幕宽度()
    添加组件(列表框1)
    列表框1.初始化适配器(项目数据)
    列表框1.置请求加载项目(&请求加载项目)
    列表框1.置项目被单击回调(&项目被单击)
结束 事件

函数 请求加载项目(项目索引 为 整数型,项目根布局 为 视图)
    '定义一个标签作为每个项目的内容组件、最终项目的内容将会显示到这个标签上面
    变量 tv 为 标签
    '布局缓存、详细说明请参阅例程
    如果(项目根布局.标记 == 空)
        tv = 创建 标签()
        tv.字体颜色 = "#ff0088"
        tv.置缩进(10,20,10,20)
        tv.可停留焦点 = 假
        项目根布局.标记 = tv
        项目根布局.置视图(tv)
    否则
        tv = 项目根布局.标记
    结束 如果
    tv.标题 = 项目数据.取项目(项目索引)
结束 函数

函数 项目被单击(被单击列表框 为 视图,项目索引 为 整数型)
    弹出提示("被点击的项目索引为:" + 项目索引)
结束 函数

宫格框

宫格框封装自 GridView 组件、与 ListView 在加载自定义项目时;操作方式一样;只不过在显示时、将会按照宫格形式显示数据;首先在窗口中添加一个宫格框组件、然后添加其 “请求加载项目” 的事件。

事件 按钮1.被单击(来源对象 为 视图)
    变量 index = 0
    项目数据 = 创建 集合()
    计次循环(100,index)
        项目数据.添加项目("项目" + index)
    结束循环
    宫格框1.列数 = 4
    宫格框1.初始化适配器(项目数据)
    宫格框1.置请求加载项目(&请求加载项目)
    宫格框1.置项目被单击回调(&项目被单击)
结束 事件

事件 宫格框1.请求加载项目(索引 为 整数型,根视图 为 视图)
    变量 rootLayout 为 线性布局
    变量 img 为 图片框
    变量 tv 为 标签
    如果(根视图.标记 == 空)
        rootLayout = 创建 线性布局()
        rootLayout.布局方向 = 1
        rootLayout.内容对齐方式 = 水平居中
        img = 创建 图片框()
        tv = 创建 标签()
        sum = 创建 标签()
        ' 添加图片框及标签到列表框中
        rootLayout.添加组件置权重(img,DP到PX(40),DP到PX(40),1)
        rootLayout.添加组件置权重(tv,-1,-2,1)
        ' 设置初始值
        tv.文本颜色 = "#ff0099"
        tv.可停留焦点 = 假
        tv.内容对齐方式 = 垂直水平居中
        根视图.标记 = rootLayout
        根视图.置视图(rootLayout)
    否则
        rootLayout = 根视图.标记
        img = rootLayout.取子组件(0)
        tv = rootLayout.取子组件(1)
    结束 如果
    tv.标题 = 项目数据.取项目(索引)
    img.图片 = "vslogo.png"
结束 事件

事件 宫格框1.项目被单击(来源对象 为 视图,索引 为 整数型)
    弹出提示("项目被单击:" + 索引)
结束 事件

演示APK下载

演示APK中对各种列表框及自带列表框组件都编写了功能演示;可以下载体验查看效果:列表框演示.APK

更多

更多例程源代码请下载IDE、在IDE中搜索”自定义“关键字查看。

模块与类

模块可以被用来储存数据、中转数据、封装自定义数据类、分离APP功能、将不同的功能的实现放到不同模块中、与主程序解耦、使用时只需要创建模块即可使用、对APP的整体开发和后期维护都有着非常重要的作用和意义、除此之外、模块既可以当作静态工具类使用、也可以作为数据类型使用、以下将作分别说明和演示:

  • 静态工具类

  • 自定义类

静态工具类

静态工具类模块相对较简单;可以在整个APP中跨窗口使用、一般开发工作中对于静态工具类使用都较为简单、在 IDE 中只需要在创建模块时、选择静态模块模板、新建的模块文件中将会自动插入示例代码、在代码中定义的函数以及变量使用静态修饰符修饰即可、例如:

' 应用的全局变量、可在整个APP的窗口中使用
变量 静态 全局标记 为 文本型 = ""

函数 静态 计算圆面积(半径 为 整数型) 为 双进度小数
    返回 半径 * 半径 * 3.14
结束 函数

使用时只需要在窗口或者其他模块中、使用 模块名.方法 调用即可、例如:

事件 按钮1.被单击(来源对象 为 视图)
    标签1.标题 = 公用模块1.计算圆面积(3,4)
结束 事件

自定义类

自定义数据类、类似 Java 中的 Class 、一般用于在开发中根据自身业务需求、将不同类型的数据根据归类封装成一个模型类、例如、开发小说APP、我们则可能会用到书本类、如果要将书本类封装成一个自定义类型、书本这个模型中就有:书名、价格、出版社、作者 等等信息、在后期开发中、对书本的操作就会非常简单方便、下面我们用代码演示、将模块定义为一个书本类型、首先在 IDE 中新建一个类模块、并命名为:书本;然后在代码中输入:

'定义模块中的属性变量
变量 书名 为 文本型
变量 价格 为 整数型
变量 出版社 为 文本型
变量 作者 为 文本型

'定义构造函数、在创建这个书本类对象的时候使用、只要函数名称与模块文件名称一致、则为构造函数;构造函数可以定义多个、但每个函数中的参数个数不能一样。
函数 书本(书名l 为 文本型,价格l 为 文本型)
    '将创建模块对象时的值赋值给模块内、注意函数的参数名称不能与属性名相同
    书名 = 书名l
    价格 = 价格l
结束 函数

'声明一个打折函数、当在外部调用时、直接输入折数则可以返回最终价格
函数 计算打折(折数 为 双精度小数) 为 整数型
   返回 到整数(价格 * 折数)
结束 函数

书本模型类、定义好之后、我们则可以在窗口中使用了、下面示例使用当前书本模型的代码:

事件 按钮1.被单击(来源对象 为 视图)
    变量 书本1 = 创建 书本("汤头歌诀",10)
    标签1.标题 = 书本1.书名 + "打折后价格为:" + 书本1.计算打折(0.8)
结束 事件

更多

更多模块类的使用;请参考安装包中的例程。

APP调试与错误捕获

当我们成功编译并输出一个APK文件时、要想查看其效果或运行功能是否达到我们的需求、则必须将其安装到手机或模拟器中进行调试、为了方便调试 VcnStdio IDE 为开发者提供了一个简单的调试插件、当新建一个安卓项目工程并在 IDE 中打开时在 IDE 底部会含有一个 “调试输出” 的小窗口、点击小窗口标题、则可以切换到该调试窗口界面、本文将为大家介绍该调试窗口的具体用法和功能。

  • 插件预览图

  • 设备列表

如果当电脑打开了模拟器或者使用USB连接了手机(手机已经开启开发者模式)、打开IDE后或者点击右侧刷新列表图标、如果设备连接成功、将会在日志输出区面板打印出设备名称信息、并同时会将设备添加到设备下拉框中。

  • 安装卸载APK

当设备连接成功、且成功添加到设备列表中时、点击右侧(+)号图标按钮、系统将会自动安装当前项目工程的APK文件到选择的设备中、如果要在设备中卸载当前APP、点击右侧(-)号图标按钮即可。

  • 捕获输出日志

当我们在开发中需要对代码或者函数返回值、变量值进行打印输出查看调试信息时、或者当APP发生异常崩溃的时候、我们则可以点击工具栏中的 开启捕获日志的 图标按钮、如果开启捕获成功、该图标按钮将会变成灰色禁止状态;且下方日志输出区将会立即输出设备的运行信息、如果想结束或停止捕获日志、点击最右侧 停止捕获日志 按钮即可关闭。

  • 输出自定义调试信息

要在面板区输出自定义调试信息、只需要在代码中使用“调试输出”函数即可、代码示例:

事件 按钮1.被单击(来源对象 为 视图)
    调试输出("","我是自定义输出的信息")
    变量 a 为 文本型
    a = "欢迎使用VcnStudio"
    调试输出("","我是自定义输出的变量值:" + a)
结束 事件

运行APP之后、点击按钮1、将会在日志输出区输出:

注:调试功能可能会随着时间推移而发生更新;若文档未更新、请在开发时以实际使用时为准。

捕获APP错误崩溃闪退信息

在代码中添加指定的异常捕获代码;然后在面板中点击捕获日志按钮:

事件 按钮11.被单击(来源对象 为 视图)
    ' 异常捕获语句可用于针对性的捕获引起 APP 崩溃异常的代码
    ' 例如针对某部分代码、运行APP时报错、闪退、崩溃;则可以
    ' 通过 异常捕获语句 捕获其引起错误的原因
    ' 提示:
    ' 输入 异常捕获首 按下键盘上的 TAB 键、会自动完成代码块
    异常捕获首
        ' 这里我们模拟一个数组索引越界的异常
        变量 ints = { 1,2,3 }
        ' 数组总长度为3、但获取下标为10的元素、则会引发异常
        调试输出("" + ints[10])
    异常被捕获(异常信息 为 对象)
        ' 这里返回的异常信息变量就是具体导致程序崩溃的代码、可以
        ' 将错误输出到标签或调试输出具体错误信息
        ' 注意:这里的变量名“异常信息”不可修改
        标签1.标题 = "异常信息:" + 异常信息
        调试输出("异常信息:" + 异常信息)
    异常捕获尾
结束 事件

其它问题

如果在调试面板中输出的错误信息;尤其是崩溃信息的具体行数显示“Unknown Source”;这种情况一般是在编译类库时、采用了发布版编译;发布版类库的 Jar 包文件中不包含调试信息;因此如果遇到这种未知资源时、只需要在编译类库时;标志为“debug”模式即可。标记方式:

在类库的“libtree.xml”文件中的 package 节点;添加debug属性即可;例如:

<package debug="ture">

添加后、再编译类库;则为调试版类库;注:编译发布版类库时一定要删除该 debug 标记。

安卓组件类库开发

本章将介绍如何封装安卓应用的组件库、在轻舟安卓应用中、一共存在两种类型的组件;分别为:

  • 不可视组件

  • 可视组件

接下来我们将分别讲解这两种组件的具体封装方法;这里需要特别注意:封装组件需具有一定的原生安卓开发知识、如果你不具备该条件;请先学习后再尝试封装。

工程目录及文件讲解

两种组件的项目结构是一样的;不同点是在项目配置树文件中的定义所有区别、下方将逐一说明:

  • static (存放静态资源文件夹)

    • assets 存放不进行编译但会被打包到最终类库压缩包的文件
    • libs 存放第三方 jar 包
    • aar 存放第三方 aar 包
    • res 存放drawable、layout、values自定义资源值
  • src 存放类库的源代码、允许多个包名

  • libtree.xml

    • 该文件为类库的核心配置描述文件、在开发时非常重要;整个类库的函数声明、类库信息、包名等都需要在该文件中配置
  • *.vsln 项目索引文件

libtree.xml

在IDE中双击打开该文件后;我们可以看到如下图示:

  • package 根节点(不可更改)

  • library 库节点、所有组件或类都必须添加到该节点中;同时该节点中也用于配置整个类库的具体信息、该节点包含以下属性:

    • name 类库名称
    • author 类库作者
    • package 类库编译时包名
    • description 类库的功能描述
    • version 版本(可省略)
    • type 指定类库的类型值;必须;(用于指定类库为可视类库还是不可视类)
      • component 不可视组件
      • control 可视控件
  • library 支持添加的子节点标签

    • class 普通单一数据类型
      • method 函数
    • control 可视组件
      • property 属性
      • constant 常量
      • method 函数
      • interface 事件接口回调
        • event 具体事件
    • component 不可视组件
      • property 属性
      • constant 常量
      • method 函数
      • interface 事件接口回调
        • event 具体事件
  • permission 权限节点;在该节点中可添加用于当前类库可能用到的安卓权限。

  • manifest 清单文件;在该节点中可添加该类库用到的安卓清单文件元素。

    • activity 原生Activity类

    • main-activity 主节点子元素、该节点下的内容会被添加到轻舟APP框架中的主Activity APP 类中、例如:intent-filter、meta-data、activity-alias 等等;注意:该节点默认配置文档中并未添加、如有需要、自行添加即可:

      <main-activity>
          ...
      </main-activity>
      

注意:一个类库中可以添加无限个组件或数据类型、例如:当你要封装一个阅读APP的类库时、你可以将相关的组件或数据类型都封装到一个类库中;从而方便使用、分享。

可视组件

可视组件、顾名思义表示是可视的、可以看得见的组件;例如在APP中的按钮、标签、文本内容列表框等等;这些组件都属于可视组件;在 IDE 安装包中、位于 “sdk/android/components/primary” 该目录中都是官方已经封装好的组件、大家在封装时可以参考。

所有可视组件必须继承自视图类。

封装组件时首先需要先下载 VcnStudio 开发工具、并解压至非C盘目录;该步骤本教程跳过;打开IDE程序后、点击新建项目、在弹出的窗口中依次选择:移动应用->安卓支持库->可视组件 然后输入项目名称、点击确定;等待数秒、系统将会创建默认的类库项目。

点击确定后、如果无错误、将会打开创建成功的项目;如下图:

默认创建的项目包名为 myapp.component 、位于工程窗口中的 src 节点下面;在我们自定义创建类库时、可以自定义创建自己的包名;删除掉默认包名即可。然后将自己的组件源文件放到你自定义创建的包下面;例如:下方我们创建了一个自己的包名(选中src节点后右键菜单新建背包)、并在这个包中创建一个蓝色背景的标签组件:

默认创建打开后如上图所示为默认代码;此时我们需要修改为可视组件的模板(与默认蓝色按钮一致即可)、然后添加我们自己的代码;完成之后;代码为:

package exp.mytest;

/* 引入安卓开发框架的核心类 */
import com.simple.android.*;
/* 由于项目中没有用到这两个包的内容;需要屏蔽掉、否则编译器会报错 */
//import com.simple.components.*;
//import com.simple.control.*;
/* 引入安卓原生组件相关包 */
import android.view.View;
import android.widget.TextView;
import android.graphics.Color;

public class 蓝色标签 extends 视图
{
    private TextView mTextView;

    @Override
    public View createView()
    {
        mTextView = new TextView(MainActivity.getContext());
        mTextView.setBackgroundColor(Color.BLUE);
        mTextView.setTextColor(Color.WHITE);
        return mTextView;
    }

    public void 标题(String text)
    {
        this.mTextView.setText(text);
    }

    public String 标题()
    {
        return this.mTextView.getText().toString();
    }
}

然后点击编译;如果代码编写无误、将会在IDE底部编译输出窗口输出编译信息;如果编译出现错误;将会输出错误信息、并同时结束编译;如果编译成功;将会提示包含“类库编译成功”的提示内容;并且在项目根目录文件夹中会新增一个“_build”文件夹;在该文件夹中会输出一个未压缩状态的类库目录、和一个后缀为“.scm”的单文件库(方便分享);复制该文件到 “IDE安装目录\sdk\android\components\extends”中的分类文件夹、然后打开IDE即可。

至此、一个简单的可视类库就封装完毕了。

不可视组件

不可视组件、顾名思义在APP中是不可视的;例如时钟、网络操作库等等。不可视组件相对于可视组件、在封装时较简单;首先还是一样、新建项目时选择安卓不可视组件、创建项目后;会默认加载一个空的项目;该项目的默认工程模板与可视组件不完全一样;默认的类为一个普通的数据运算类;因为不可视组件不需要继承任何轻舟框架中规定的父类;其封装方式与原生 Java 编写 Jar 文件一模一样;因此相较可视组件而言、封装不可视组件更为简单、本文以自带的默认工程做示例讲解。

首先当我们打开项目并加载成功后的默认不可视组件代码为:

由于代码相对较简单、这里不做过多解释;但在实际封装时;应该将待封装的类放在自己创建的包中。

配置文档编写

在代码编辑窗口中;当代码编写完毕时、单击右键菜单;选择“生成类文档”菜单项、即可快速生成编辑窗口类的函数、方法文档;这里需要注意自动生成功能只会提取源码中声明为 public 公开的方法、及接口;非公共修饰符的类成员、包含方法接口都不会处理;除此之外只读与只写属性需要自行处理。

如果方法名称相同;且只有一个参数、参数类型和返回值都一样时、会自动识别为可读可写属性;例如:标题;如果方法为只读或只写属性、在方法前输入 /** 属性 */ 标记注释;生成时将会自动处理为属性;例如:

/** 属性;只读属性 */
public String 只读方法名()
{
    return "";
}

/** 属性;只写属性 */
public void 只写方法名(String value)
{

}

MainActivity回调接口

当组件需要监听APP启动、窗口加载完毕、窗口被关闭事件时、可以通过在类库中实现轻舟安卓框架中预先定义的相关回调接口:

  • IOnRequestPermissions :OnRequestPermissionsResult(int requestCode, String[] permissions, int[] grantResults)

  • IOnActivityResult :OnActivityResult(int requestCode, int resultCode, Intent data)

  • IOnConfigurationChanged :OnConfigurationChanged(Configuration newConfig)

  • IOnNewIntent :OnNewIntent(Intent intent)

  • IOnCreate :OnCreate(Bundle savedInstanceState)

  • IOnDestroy :OnDestroy()

  • IOnKeyDown :OnKeyDown(int keyValue)

  • IOnStart :OnStart()

  • IOnResume :OnResume()

  • IOnPause :OnPause()

  • IOnStop :OnStop()

使用示例:

package mylc.ext;
import com.simple.android.*;
public class 我的组件 extends 视图 implements 
IActivity.IOnCreate,
IActivity.IOnDestroy
{
    Button mButton;
    @Override
    public View createView(){
        this.mButton = new Button(MainActivity.getContext());
        // 注册接口
        IActivity.IOnCreates.add(this);
        IActivity.IOnDestroys.add(this);
        return mButton;
    }
}
  • 回调接口类名:IActivity
  • 添加接口对象:IActivity.{回调接口名}s.add(Object)

事件快捷生成方法

在类库中如果含有回调事件、也就是给组件添加事件;可以在需要添加事件分发的代码处添加下方代码:

//dispatch:回调事件名称(String arg,int arg1)

例如:

@Override
public void onMarkerDrag(Marker arg0)
{
    高德地图标记 flag = new 高德地图标记(arg0);
    //dispatch:标记被拖动(高德地图标记 flag)
}

然后在代码编辑框中右键单击“插入锚点事件”即可自动生成相关联的回调接口代码和事件;需注意:如果存在多个相同名称的事件回调、只能保留一个回调事件。

其它

  • R 资源的处理

    • 类库中的R资源、包含 aar 文件中的资源都会自动处理;无需手动生成。
  • AAR 包的使用

    • 将待封装的 aar 包文件放到 static/aar 文件夹中即可;无需解压;封装时按照使用jar包一样、import 引用待封装的类正常使用即可;aar包中的 R 资源文件也会自动处理。
  • jar 包的使用

    • 将待封装的 Jar 包文件放到 static/libs 文件夹内即可像正常使用 Java 代码一样使用。
  • AndroidX 的使用

    • 将待封装的 androidx 包放到 static/aar 文件夹下面正常引用指定类使用即可。
  • 组件默认属性及事件

    • 可视组件继承自视图类、默认已经自带视图类相关的所有属性、方法、和事件;例如:被单击、被长按事件等等;非特殊必要情况下;无需在类库中重复声明已存在的属性或事件。

视频教程

  1. 封装网易翻译器(不可视组件)

视窗应用工程项目结构

本章将为你介绍桌面视窗应用工程项目源代码结构;在了解详细的工程源码结构后;以便于你能更好的进行开发或对项目的管理工作、以下为一个完整项目的目录结构及必要文件:

  • layout 存放界面设计文件

  • libs 存放第三方jar包

  • src 工程源代码文件目录

  • static 存放图片、或其他资源文件

  • App.spl 应用入口文件

  • *.vsln 项目索引文件

  • _build 编译输出文件夹

layout

该文件夹主要存放应用的界面可视化设计文件、文件格式为".xml"、每一个窗口代码文件对应一个设计文件、该文件只允许通过窗口右键代码的设计器菜单项打开。

lib

该文件夹主要存放第三方Jar包、如果要在项目中直接使用某个或某些Jar包文件、则可以将jar文件放在该文件夹内、在代码中通过“引用”指定的类或包使用。

src

该文件夹主要存放窗口代码、模块代码。

static

该文件夹主要用于存放项目中用到的资源文件、可存放图片、文本、或其他数据文件、该文件在打包时将会一并打包到最终输出的可执行的 Jar 文件中。

App.spl

该文件为整个应用的启动入口文件、也是视窗程序的启动主类、继承自 JavaFx 的 Application 类、当应用每次重新打开、或启动的时候、都会先执行该文件、开发者可以在该文件中添加应用初始化相关代码。

*.vsln

工程索引文件、每次IDE加载项目时将从该文件中加载、该文件必须与工程目录同名、且每个项目中只能存在一个项目索引文件。

工程项目结构

本章将为大家介绍 微信小程序 工程项目结构;在了解详细的工程结构后;以便于能更好的进行开发工作。

  • layout 存放界面设计文件

  • src 存放窗口页面逻辑、模块代码文件

  • static 存放静态资源文件

  • App.spl 应用入口文件

  • Config.xml 小程序配置文件

  • *.vsln 项目索引文件

  • _build 项目编译输出文

layout

在该文件夹中主要存放应用的界面可视化设计文件、文件格式为".xml"。

src

该文件中主要存放窗口页面逻辑及模块代码文件。

static

在该文件夹中主要存放图片、或者其他静态文件。

App.spl

该文件为应用的启动入口文件、当应用每次重新打开、或启动的时候、都会先执行该文件、开发者可以在该文件中添加初始化相关代码。

Config.xml

应用配置文件、该文件用于配置整个站点或小程序的样式、颜色、主题、首页、以及底部导航框、以下将分别对其相关节点进行说明:

  • 首页

    • value : 设置应用首页窗口名称、即应用第一次打开的页面、例如:你的项目有多个页面、需要将 home.sim 这个代码页设置为首页、则设置value的值为“home”即可、注意名称不能有后缀名。
  • 全局页面样式

    • 该节点下方的配置主要影响应用的颜色、风格、以及主题、如果无需特别设置、建议采用默认配置即可、关于每个节点的详细说明请参考:官方文档 https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html#window
  • 底部导航栏

    • show : 设置是否展示底部导航栏、如果设置为“false”则在编译时将会忽略该项、设置为“true”时、如果配置了页面列表、且列表数量大于2、小于6的时候将会显示应用底部导航。(true:真、false:假)

    • 基础配置:设置选项卡标题颜色、背景颜色等等。

    • 页面列表:配置底部选项卡的对应页面、其中的子节点属性为:

      • text:选项卡标题、例如:首页
      • pagePath:页面路径(名称)、例如:home
      • iconPath:图标路径、设置默认显示时的图标路径、例如:static/home.png
      • selectedIconPath:选中时图标路径、设置选中时(点击后)显示的图标路径、例如:static/home_ac.png

注:暂不支持在配置文件中直接添加自定义配置项、如要添加自定义配置、可以编译输出为友好源代码后再添加。

微信小程序基础开发语法

本章将介绍使用轻舟开发微信小程序的相关语法;小程序基于解释型执行的 JS 脚本语言、框架采用微信官方原生框架、以下为详细语法说明:

  • 变量

  • 数组

  • 对象

  • 函数

  • 模块

  • 动态创建

变量

小程序的变量声明相对于安卓与视窗来说、因为无需指定变量数据类型、因此在声明时相对较简单、以下为定义格式:

变量 标识符 
变量 标识符 = 初始值
变量 标识符1,标识符2 = 初始值

示例代码:

变量 时钟ID
变量 a,b,c
变量 x = 0
变量 x,y = 0

数组

小程序的数组声明与变量类似、只是在设置默认值时、需要使用“[]”中括号包裹值;如果没有任何值、则表示为一个空数组、格式为:

变量 变量名 = [ 初始值 ]
变量 变量名 = []

示例代码:

变量 a = [ "vcn","studio" ]  '定义一个含有文本初始值的数组
变量 b = [ 1,2,3 ]  '定义一个含有整数数据初始值的数组
变量 c = []  '定义一个没有任何数据的空数组

注意:数组下标从0开始

对象

定义对象与定义数组类似、只是默认值换成了 “{ }”花括号、使用花括号即可定义一个对象实例、与JSON中的对象基本一致。以下为代码演示:

' 定义一个用户对象
变量 用户1 = { 名称: "vcnstudio",年龄:12,班级:10}
' 获取或输出字段值
调试输出("用户1的名称为:" + 用户1.名称)

函数

定义函数时、需要使用“函数”关键字;由于小程序基于JS语言、因此在定义函数及其参数时、无需设置数据类型、定义格式为:

' 无返回值函数
函数 函数名称(参数1,参数2)

结束 函数

'有返回值函数
函数 函数名称(参数1,参数2)
    返回 ....
结束 函数

代码示例:

' 无返回值函数
函数 函数名称(参数1,参数2)

结束 函数

'有返回值函数
函数 函数名称(参数1,参数2)
    返回 参数1 + 参数2
结束 函数

模块

模块中只能包含静态变量、以及静态函数、例如:

静态 变量 全局变量URL = "http://www.vcnstudio.com"

静态 函数 全局公用函数(参数一,参数二)
    返回 参数一 + 参数二
结束 函数

动态创建

在微信小程序中不能使用代码动态创建组件对象、然后添加到窗口或页面中、所有组件都只能预先添加到页面后才能使用。

部署调试发布小程序

小程序最终编译输出的为基于官方开发框架的项目工程源代码、因此如果要发布小程序、或预览、调试相关功能、需要将项目加载并部署到官方开发工具中。在阅读本文档之前、你需要先下载微信小程序 官方开发工具 (请下载稳定版) 具体步骤如下:

安装微信官方小程序开发工具

安装方式较简单、下载安装包文件后双击点开、然后选择下一步、下一步即可;这里不做详细说明;但需要注意:默认会把程序安装在C盘、如果你不想装在C盘、记得修改路径。

打开小程序官方开发工具并新建项目

打开后的界面如果工具版本类似或者正常情况下;应该是如下图所示、然后点击新建项目

新建项目

新建项目时注意、请选择不使用云服务、不使用模板、然后选择我们项目的 _build 文件夹目录(如果没有请先编译一次项目)、然后输入项目名称、点击测试号、获取APPid、然后点击确定。

加载项目

点击确定之后、根据电脑设备的配置和性能不一样、初始化项目、要等待10-30秒、当在小程序开发工具中能够正常看到渲染界面的时候、则说明项目已经添加成功、可以开始进行开发工作。

可能遇到的问题

  • 加载之后在控制台输出红色错误信息

    • 解决方案:如果是新建的项目编译后导入报错、请在官方QQ群或论坛反馈;如果是已经进行过开发工作的项目编译后产生红色报错信息、请先根据报错详情、检查代码;如果无法解决、请在QQ群或论坛向我们反馈。
  • 打开IDE之后提示需要登录账号

    • 属于正常情况、点击左上角图标扫描二维码登录即可。
  • 提示JS或库文件未被使用

    • 由于一个小程序不能超过2M、因此为了节省应用包体积、任何没有用到的文件或者代码都必须删除掉、遇到这种情况时、只需要根据提示删除指定的文件即可、注意:如果是你新建了一个模块文件、但是在代码中没有用到、请先备份模块文件再删除。
  • 其他未知问题

    • 请到QQ群或官方论坛反馈。

微信小程序组件封装

组件的复用在软件开发中有着非常重要的作用、在本章、我们将介绍、怎样从0开始自己动手封装一个微信小程序的可视化组件;在学习本章教程之前、你需要首先掌握或持有基础的微信小程序开发或JS相关开发知识、一个基于微信小程序原生框架的前端组件主要由以下三个部分组成:

  • 界面模板<template>

  • JS代码<script>

  • CSS效果<style>

注:在 VcnStudio 安装包中已自带大量基础组件;可参考其基础组件进行封装;路径:安装目录/sdk/wxapp/components

界面模板

界面模板为在页面中显示的内容、由 HTML 代码组成、小程序组件界面代码都必须放在 template 标签中;且根组件必须设置style的值为“{{customStyle}}”变量。 例如:

<template>
    <view style="{{customStyle}}">
        <text>我是具体组件</text>
    </view>
</template>

JS代码

JS代码主要定义组件的属性、方法、事件、处理组件中的计算属性与界面模板的显示;在JS代码中、主要分为以下几个重要的部分:

  • 数据(data) 用于定义封装组件所属的特有功能或特点、例如:在一个文本类组件中、可以通过定义属性的方式设置该组件中的文本字体颜色、在可视化设计时则可以通过属性编辑框为组件设置、在代码中可以通过"组件名.属性名"的方式进行设置;属性支持以下5种类型值:

    • 文本型
    • 整数型(数值型)
    • 逻辑型
    • 数组
    • 对象(可视化设计时不可用)
  • 方法(methods) 用于定义组件的方法、在代码中使用、例如一个列表组件如果要想向列表框中添加项目、则可以定义一个“添加项目”的方法、用户在代码中通过"组件对象.添加项目"即可向列表框中添加数据。

  • 事件 用于定义组件的回调事件、例如一个列表框组件、当用户点击项目时、要回调点击事件告诉开发者、分发事件需要使用“triggerEvent”方法。

以下为一个简单的组件代码示例:

<script>
    const sview = require(&#x27;../sview&#x27;)
    Component({
        behaviors:[sview],
        data:{
           mTitle:""
        },
        methods:{
           置标题(mTitle){ this.setData({mTitle:mTitle}); },
           取标题(){ return this.data.mTitle; },
           disOnClick(e){
           this.triggerEvent(&#x27;onClick&#x27;,{e:e})
           },
        }
    })
</script>

上述代码讲解:

1.引入基础类组件(地址和名称固定)、所有可视组件都必须继承该组件。

const sview = require('../sview')

2.定义组件字段、继承、属性。

behaviors:固定用法、设置当前组件继承自 sview 即可。

data:组件的字段、用于接收属性方法的值。

methods: 定义组件的方法

3.定义属性

当在方法中定义了、含有“置”和“取”的前缀方法、如果名字一样、则表示为属性;否则为普通方法、例如上方代码中的标题、即为一个属性。

4.定义事件

定义事件时需要注意:由于事件需要先在 template 模板中注册、因此不能使用中文、且建议以 disOn 开头、后跟具体事件名称、例如:disOnClick 表示当组件被单击时触发该事件、然后通过“triggerEvent”函数分发出去;这个函数中有两个方法、第一个是这个组件在被使用时注册的事件名称(非类库封装开发者不需要了解)、第二个为事件传递出去的参数对象、例如:这里传出去的为“e”也就是原事件源、如果你还需要传出其它参数、添加再添加一个字段及值即可。但需要注意的是:在编写 xml 节点树的时候、需要指定 disargs 属性。默认为 disargs="(e)"

methods:{
    disOnClick(e){
        this.triggerEvent('onClick',{e:e})
    }
}

CSS效果

CSS即为渲染界面的style样式代码、通过编写style样式、可以渲染出不同的界面或布局、微信小程序开发框架支持所有H5的style、因此较简单这里不详细说明、示例代码:

<style>
    .border-style{
        border: #007AFF 1px solid;
    }
</style>

网站项目结构

项目结构

src

    所有待编译的页面、组件、脚本、样式表文件;根据不同的文件后缀区分不同的文件。

static

    所有外部使用的图片、CSS、JS、或者其它不需要编译的文件。

App.spl

    打包网站为本地跨平台应用启动页面。

Config.xml

    项目配置文件、用于配置动态网站开发时所使用的数据库、编译输出目录等。

*.vsln

    项目的索引文件。

文件类型

.spl     页面文件;构建编译时输出的 html 文件。

.sc       组件文件;用于封装自定义组件或JS类;不可视组件编译输出为ES5标准语法、可视组件编译输出为ES6标准语法。

.spx     后端脚本文件、编译时输出为 PHP 标准执行文件;运行时需PHP环境支持。

.jsx      前端脚本文件、编译时输出为 JS 标准执行文件。

.csx     前端样式表文件、编译时输出为 CSS 标准文件。

开发语法

本章将介绍轻舟网站开发相关语法;网站基于 HTML、JavaScript、Css 设计并封装;以下为详细语法说明:

  • 变量

  • 数组

  • 对象

  • 函数

变量

变量声明相对于安卓与视窗来说、因为无需指定变量数据类型、因此在声明时相对较简单、以下为定义格式:

变量 标识符 
变量 标识符 = 初始值
变量 标识符1,标识符2 = 初始值

示例代码:

变量 时钟ID
变量 a,b,c
变量 x = 0
变量 x,y = 0

数组

数组声明与变量类似、只是在设置默认值时、需要使用“[]”中括号包裹值;如果没有任何值、则表示为一个空数组、格式为:

变量 变量名 = [ 初始值 ]
变量 变量名 = []

示例代码:

变量 a = [ "vcn","studio" ]  '定义一个含有文本初始值的数组
变量 b = [ 1,2,3 ]  '定义一个含有整数数据初始值的数组
变量 c = []  '定义一个没有任何数据的空数组

注意:数组下标从0开始

遍历数组:

遍历数组可以在循环中依次获取数组中的每个元素值。

变量 数组1 = [10,20,33,55,24]
变量循环(索引 = 0,取数组成员数(数组1),1)
    调试输出(数组1[索引])
结束循环

对象

定义对象与定义数组类似、只是默认值换成了 “{ }”花括号、使用花括号即可定义一个对象实例、与JSON中的对象基本一致。以下为代码演示:

' 定义一个用户对象
变量 用户1 = { 名称: "vcnstudio",年龄:12,班级:10}
' 获取或输出字段值
调试输出("用户1的名称为:" + 用户1.名称)

遍历对象:

遍历对象可以在循环中依次获取对象中的每个属性及名称。

变量 用户1 = { 名称:"张三",年龄:25 }
变量循环(索引 = 0,取对象成员数(用户1),1)
    变量 属性名 = 取对象成员名(用户1,索引)
    调试输出(属性名 + " " + 用户1[属性名])
结束循环

函数

定义函数时、需要使用“函数”关键字;由于网站基于JS语言、因此在定义函数及其参数时、无需设置数据类型、定义格式为:

' 无返回值函数
函数 函数名称(参数1,参数2)

结束 函数

'有返回值函数
函数 函数名称(参数1,参数2)
    返回 ....
结束 函数

代码示例:

' 无返回值函数
函数 函数名称(参数1,参数2)

结束 函数

'有返回值函数
函数 函数名称(参数1,参数2)
    返回 参数1 + 参数2
结束 函数

页面结构与组成

引用

引用第三方或项目中自定义的样式或脚本文件;编译时会自动根据引用文件的后缀判断文件类型、例如:

引用 MyJs.jsx
引用 "./static/css/mys.css"
引用 "http://www.xxx.com/a.js"

页头

定义页面中的标题、语言、编码、关键字、作者等等信息;例如:

页头 标题 = "这是网站标题"
    编码 = "UTF-8"
    语言 = "zh-Cn"
结束 页头

样式

定义页面中所有可视化、可见的内容、组件的外观、排列顺序、尺寸大小、位置等;在网站开发中样式的使用较多;例如:

' 默认写法
样式 样式一
    宽度 = 100px
    高度 = 32px
    背景颜色 = #ccc
结束 样式

' 与原生混合编写
样式 样式二
    宽度 = 100px
    height = 32px
    border = "1px #ccc solid"
    line-height: 45px;
    box-shadow: none;
结束 样式

' 也可像原生一样写在一排、使用分号“;”隔开
样式 样式三
    宽度:100px;高度:32px;line-height: 45px;
结束 样式

' 使用原生选择器、只需要将名称使用双引号包裹即可
样式 ".p-box > *"
    宽度 = 100px
    边距顶 = 10px
    边距底 = 10px
结束 样式

页体

定义页面的主体、所有可视组件、标签、基础元素都必须放在页体中使用;页体的主要作用是管理组件的存放;而样式主要负责对放在页体中的组件进行渲染、美化、排版。

例如:

页体 类型="Body"
    <容器 类="页面主体">
        <图像 地址="./static/logo.jpg" 内联样式="宽度:100px;高度:100px;" />
        <容器>
            欢迎使用 <段 内联样式="颜色:#ff3636;字体粗细:bold;">{Text}</段> 网站开发插件
        </容器>
        <容器>{Msg}</容器>
        <按钮 类="按钮样式" 被单击="按钮1被单击()">点击我</按钮>
    </容器>
结束 页体

在页体中也支持使用原生HTML标签:

<div class="style1">
    <div style="color:red;">我是DIV标签</div>
    <div>{Nt}</div>
    <button onclick="NativeBtnOnClick">I is Button</button>
</div>

模板变量

模板变量可用于在页体中便捷显示数据、而不需要手动操作DOM节点、模板变量无需定义;只需要在页体中指定位置使用花括号包裹指定字符串即可;即使用{ }花括号包裹的字符串即为模板变量、当在函数中修改该变量的值时、系统将同步更新页面中的值。

模板变量可用于

1.显示普通文本内容

<容器>
    欢迎使用 <段 内联样式="颜色:#ff3636;字体粗细:bold;">{Text}</段> 网站开发插件
</容器>
<div>{Nt}</div>

2.双向绑定 input textarea 标签的输入值

双向绑定需使用 m- 前缀;后跟 value 属性名称;
当用户在编辑框中输入指定内容时;输入的内容将会自动赋值给绑定的变量。
<输入框 值="{InputValue}" 提示文本="请输入内容" />
<编辑框 m-value="{TextValue}" 提示文本="请输入多行内容" />

3.绑定类及内联样式Style的值

当在函数中修改 DivCls 的值时、该容器的样式类也将随之改变。
<容器 类="{DivCls}">
    <容器 内联样式="颜色:{TextColor}">当在函数中修改 TextColor 变量值为 red 时、这段内容文本颜色将会变成红色。 </容器>
</容器>

使用模板变量时需注意:模板变量只能独立存在于标签位置处;例如上方的 Text、Nt 前后不能含有任何其它文本或字符串、且变量名称与花括号之间不能有任何空格!

函数

用于数据处理、与用户交互;接收用户的操作、例如:点击按钮。

事件

监听页面的改变、加载。

界面与布局

本节将讲解如何编写界面布局、内容排版;主要以弹性布局 flex 为核心知识点。

弹性布局

在父布局指定并应用;支持下方属性。

  • 布局方向

    • 设置布局中子元素及组件的排列方向;可以横着排、竖着排。
  • 换行模式

    • 设置布局中子元素及组件的换行模式;可以不换行、自动换行、反着换行。
  • 主轴对齐

    • 设置布局中的子元素及组件在指定的布局方向上的对齐方式;例如:指定布局方向为水平、那么则指定子元素在水平方向的对齐方式。
  • 侧轴对齐

    • 设置布局中的子元素及组件在指定的布局方向垂直轴的对齐方式;例如:指定布局方向为水平、那么则指定子元素在垂直方向的对齐方式。
  • 多轴对齐

    • 设置布局中的元素或内容当存在多行或多列的时候的对齐方式。

子元素

父布局为弹性布局时、子元素支持单独设置自己的布局属性。

  • 自身对齐

    • 设置当父布局为弹性布局时、指定渲染的元素自身相对于父布局的对齐方式。
  • 弹性权重

    • 设置当元素父布局为弹性布局显示时、该属性指定剩余空间所占的权重值;值越大、占比越大。
  • 弹性压缩

    • 设置当元素父布局为弹性布局显示时、且父布局空间不足时;该属性指定是否压缩本元素;0不压缩、1压缩;默认为1 。
  • 弹性占比

    • 设置当元素父布局为弹性布局显示时、该属性定义了在分配多余空间之前,项目占据的主轴空间大小;可设置固定尺寸值;即默认占多少空间。

使用原生代码

在项目开发时除了使用中文封装的内置函数外;轻舟也支持无缝使用纯 JS 原生函数、及浏览器特性;以扩展其项目的更多功能。

直接使用单个函数

针对浏览器内置的 JS 单个原生函数、在轻舟版本中可以直接复制粘贴使用;例如:

var x = Math.PI;  // 返回PI
var y = Math.sqrt(25);// 返回25的平方根 
console.log("Hello world!!!");

在线参考地址:JS和HTML DOM参考手册 - 菜鸟教程

使用@{ }内嵌语句使用

在遇到多行代码、且语法明显具有 JS 原生语法时、例如包含 for 循环、function 函数等等可采用轻舟提供的内嵌语句使用;例如下方使用JS原生的冒泡排序算法:

函数 冒泡排序(arr)
    @{
      var len = arr.length;
      for (var i = 0; i < len - 1; i++) {
        for (var j = 0; j < len - 1 - i; j++) {
          if (arr[j] > arr[j + 1]) {
            // 如果前一个元素比后一个元素大,则交换它们的位置
            [arr[j], arr[j + 1]] = [arr[j + 1], arr[j]];
          }
        }
      }
      return arr;
    }
结束 函数

在页面中使用这个函数:

变量 ar = [10,20,33,55,24]
调试输出(冒泡排序(ar))

将输出从小到大排列的结果。

内置标签及自定义组件的使用

内置标签的使用

内置标签与原生标签一样、只不过汉化了中文名字、方便用户使用;在编译时会输出为原生标签;例如按钮会被编译为button、输入框会被编译为input;因此在使用时与原生HTML开发一模一样;而对其数据值的操作、可以通过documen对象以及内置函数操作;

例如:对指定div设置一个id、再通过内置函数“取元素ByID”则可以获取该div标签对象、从而实现对该标签进行各项支持的操作。

设置内容、修改Style样式、设置HTML内容等等。

<容器 ID="div1">
    我是DIV1的默认文本内容
</容器>
<输入框 提示文本="请输入密码" 类型="密码" />
<编辑框 提示文本="请输入多行内容"></编辑框>

在按钮被单击事件或函数中:

函数 按钮2被单击()
    变量 div1 = 取元素ByID("div1")
    调试输出(div1)
    ' 修改容器中的文本内容
    div1.innerText = "我是修改的内容"
    ' 修改容器中的HTML内容
    div1.innerHTML = "<span style='color:red;'>我是加载的HTML内容</span>"
结束 函数
注册内置标签事件

内置标签的事件、可以在页体中为其注册;也可以通过内置函数“注册事件ByID”、“注册事件By类名”、“注册事件By元素名”注册。

在页体中注册:

<按钮 被单击="按钮1被单击()">点击我</按钮>
<按钮 onclick="按钮2被单击()">点击我2</按钮>

其中被单击、onclick为事件名称、可以参考核心库/全局属性;原生英文事件名称可参考:HTML 事件 - 菜鸟教程

在函数中动态注册:

函数 动态注册事件()
    ' 为ID等于 div1 的元素注册被单击事件;当元素被单击时将会在控制台输出被单击的对象及事件
    注册事件ByID("div1","click",(源对象,事件源)=>{
        调试输出(源对象)
        调试输出(事件源)
    })
    ' 为样式类等于 myCls 的所有元素注册被单击事件;当元素被单击时将会在控制台输出被单击的对象及事件
    注册事件By类名("myCls","click",(源对象,事件源)=>{
        调试输出(源对象)
        调试输出(事件源)
    })
    ' 为元素名称等于按钮(button)的所有元素注册被单击事件;当元素被单击时将会在控制台输出被单击的对象及事件
    注册事件By元素名("button","click",(源对象,事件源)=>{
        调试输出(源对象)
        调试输出(事件源)
    })
结束 函数

自定义组件

自定义组件指所有非内置组件、及原生元素;例如:以LY开头的组件为封装自LayUI的自定义扩展组件;在项目中创建的自定义可视组件等等。

自定义组件的使用与原生元素略有不同;最大的区别在于事件的处理上;在页体中使用时与基础元素的定义格式基本一样;可设置默认属性值;但该属性值不支持模板变量;结尾标签必须在内部结尾、且必须包含ID;例如:

<LY按钮 ID="ly1" /> 
<LY编辑框 ID="bjk1" 内容="我是内容" 文本尺寸="30px" />
' 修改属性
bjk1.内容 = "修改后的内容"
bjk1.文本尺寸 = "10px"
事件注册

针对自定义组件的事件;不支持像原生标签那样注册;因为自定义组件的事件是在组件封装时独立声明的;其统一语法为:置XXX回调 ;例如:

按钮1.置被单击回调((事件源)=>{
    调试输出(事件源)
})

后端API开发

针对后端API接口的开发、轻舟提供了以PHP为基础开发语言的插件;新建网站项目时、选择“API接口工程”项目模板、创建后即为标准轻舟API工程项目。

轻舟 API 接口采用主流 PHP 编程语言作为基础语言;用户层采用轻舟语法、编译输出的API程序为标准 PHP 脚本工程、可部署到所有支持PHP环境的服务器。

普通接口

示例:

' 在前端通过发送GET、POST请求、或使用“请求接口”函数调用该函数
' 前端地址:http://你的域名.com/Api.php?a=测试输出
函数 测试输出()
	输出 "你发送的请求接收成功;这是反馈信息!"
结束 函数

' 前端地址:http://你的域名.com/Api.php?a=获取时间()
函数 获取时间()
	输出 "当前时间:" + 格式化时间("Y-m-d",取现行时间戳())
结束 函数

当将上方代码编译输出后、上传到你的云主机或服务器内;在浏览器通过网站访问指定URL地址、则可以获取接口返回的数据。

数据库接口

自带Mysql增删改查函数;基于PDO引擎、自带防SQL注入;保障数据安全;示例:

' 当前端(手机网站或APP)提交用户注册操作时、在该函数中将注册信息添加到数据表中
函数 注册用户信息()
    ' 取出前端提交的注册信息
    变量 账号 = 取请求值("user")
    变量 密码 = 取请求值("pass")
    变量 年龄 = 取请求值("age")
    ' 判断数据表中是否已存在指定用户
    如果(MYSQL查找("userinfo","user=?",[账号]))
        输出 "该用户已经存在!"
        返回
    结束 如果
    ' 否则将数据添加到数据表中;自增ID可以不用添加
    变量 sql = "insert into userinfo(user,pass,age,regtime)value(?,?,?,?)"
    变量 data = [账号,密码,年龄,取现行时间戳()]
    如果(MYSQL执行(sql,data))
        输出 "注册成功"
    否则
        输出 "注册失败"
    结束 如果
结束 函数

更多使用案例请参考安装包自带例程。