3.1 基础元件

3.1.1 按钮

按钮控件属于基础的控件之一。该控件可在屏幕上绘制一个矩形的带文字的按钮，同时具备按下过程的动画效果

可更改的样式属性：

宽度高度 (size)：1）通过定义不同的宽度高度，以实现不同大小的按钮控件；将鼠标放在按钮边缘，拖动边缘可自由调整按钮大小
坐标 (pos)：1）通过定义不同的XY值，来调整控件的位置；2）通过键盘↑↓← →键更精细地调整按钮控件的XY坐标位置
文本 (text)：灵活修改按钮上的文本内容
字体 (font_family)：修改按钮上文本内容使用的字体。如需设置字体，则必须先在字库选项卡中添加字库。如文本中存在中文则必须设置中文字体。纯英文则不是必须
字体颜色 (font_color)：修改按钮上文本的字体颜色
背景颜色 (bg_color)：对按钮的未按下状态以及按下状态、边框的颜色值进行修改
边框宽度 (border_width)：可以自定义按钮边框的宽度
按钮半径 (radius)：修改按钮的圆角半径，使其的四角呈现出更大或更小的弧度
透明度 (opa)：更改按钮的透明度，使其呈现完全隐藏，若隐若现等效果
切换状态 (state)：添加点击btn时切换控件显示的文本，可以添加多条，按添加顺序切换，切换到最后一条时重新切换回第一条循环
隐藏 (visible)：可以在画布中隐藏/显示元件
首行缩进 (text_indent)：可以设置首行缩进距离

图为更改了样式的按钮控件

3.1.2 图片

图片控件属于基础的控件之一。该控件可以将一张图片绘制在屏幕上，该控件可更改的样式属性有

可更改的样式属性：

图片路径 (src)：要使用图片控件，需要先导入本地的图片素材。之后在图片控件的属性栏中设置图片路径时可以查看到已经导入的本地素材名，选中需要设置的图片
宽度高度 (size)：图片控件在设置图片路径之后会自动将宽度高度设置为原图片的宽度高度；1）通过定义不同的宽度高度，以实现不同大小的图片控件；2)将鼠标放在图片边缘，拖动边缘自由调整图片大小
坐标 (pos)：1）通过定义不同的XY值，来调整控件的位置；2）通过键盘↑↓← →键来调整图片控件的XY坐标位置
拉伸 (stretch)：如果设置图片路径后，勾选拉伸，则继续设置控件的宽度和高度时，原图将跟随控件大小进行拉伸收缩调整
透明度 (opa)：可以更改图片的透明度，使其呈现完全隐藏，若隐若现等效果
隐藏 (visible)：可以在画布中隐藏/显示元件

图为插入的图片控件

3.1.3 标签

标签控件为基础控件之一。该控件可以在屏幕上显示指定的文本内容，而其余地方保持透明

可更改的样式属性：

宽度高度 (size)：1）通过定义不同的宽度高度，以实现不同大小的标签控件；2)将鼠标放在标签边缘，拖动边缘自由调整标签大小
坐标 (pos)：1）通过定义不同的XY值，来调整控件的位置；2）通过键盘↑↓← →键来调整标签控件的XY坐标位置
文本 (text)：可以灵活修改输入框上的文本内容；需要注意，超出标签控件宽度和高度部分的文字将不会显示
文本 (text)：可以灵活修改标签上的文本内容
字体 (font_family)：可以修改标签上文本内容使用的字体。如需设置字体，则必须先在字库选项卡中添加字库。如文本中存在中文则必须设置中文字体。纯英文则不是必须
字体颜色 (font_color)：可以修改标签上文本的字体颜色
透明度 (opa)：可以更改标签的透明度，使其呈现完全隐藏，若隐若现等效果
字体对齐 (align)：字体对齐方式有多种模式，可根据实际需求进行设置；需要注意，当仿真时文字不在同一水平线上，请将对齐方式设置为居中对齐
隐藏 (visible)：可以在画布中隐藏/显示元件
首行缩进 (text_indent)：可以设置首行缩进距离
字体风格 (font_style)：可以添加文字风格，如下划线，删除线，粗体，斜体

图为更改了样式的标签控件

3.1.4 文本框

文本框为高级控件之一。该控件可以在屏幕上绘制一块显示文本的区域。与标签控件有所区别的是，文本区的背景并不透明，并且可以更改背景的颜色

可更改的样式属性：

宽度高度 (size)：1）通过定义不同的宽度高度，以实现不同大小的文本区控件；2)将鼠标放在文本区边缘，拖动边缘自由调整文本区大小
坐标 (pos)：1）通过定义不同的XY值，来调整控件的位置；2）通过键盘↑↓← →键来调整文本区控件的XY坐标位置
文本 (text)：可以将文本设定为多段文本，设定不同颜色风格，灵活修改文本区上的文本内容
字体 (font_family)：可以修改文本区上文本内容使用的字体。如需设置字体，则必须先在字库选项卡中添加字库。如文本中存在中文则必须设置中文字体。纯英文则不是必须
字体颜色 (font_color)：可以修改文本区上文本的字体颜色
背景颜色 (bg_color)：可以修改文本区除了文本的其他区域的背景颜色
透明度 (opa)：可以更改文本区的透明度，使其呈现完全隐藏，若隐若现等效果
字体对齐 (align)：字体对齐方式有多种模式，可根据实际需求进行设置
隐藏 (visible)：可以在画布中隐藏/显示元件
首行缩进 (text_indent)：可以设置首行缩进距离

图为文本区控件

3.1.5 输入框

输入框控件为高级控件之一，该控件也是主要以显示文本为主要功能的控件。该控件区别于文本区以及标签控件所在是，该控件具有占位符，提示输入内容，以及可以添加和删除文本的功能。同时，该控件和文本区一样，背景不透明，可以修改背景颜色

可更改的样式属性：

宽度高度 (size)：1）通过定义不同的宽度高度，以实现不同大小的输入框控件；2)将鼠标放在输入框边缘，拖动边缘自由调整输入框大小
坐标 (pos)：1）通过定义不同的XY值，来调整控件的位置；2）通过键盘↑↓← →键来调整输入框控件的XY坐标位置
文本 (text)：可以灵活修改输入框上的文本内容
占位符 (placeholder)：可以灵活修改提示输入的内容
边框宽度 (border_width)：可以任意修改输入框的边框大小
字体 (font_family)：可以修改输入框上文本内容使用的字体。如需设置字体，则必须先在字库选项卡中添加字库。如文本中存在中文则必须设置中文字体。英文则不是必须
字体颜色 (font_color)：可以修改输入框上文本的字体颜色
背景颜色 (bg_color)：可以修改输入框除了文本的其他区域的背景颜色
透明度 (opa)：可以更改输入框的透明度，使其呈现完全隐藏，若隐若现等效果
隐藏 (visible)：可以在画布中隐藏/显示元件
字体风格 (font_style)：可以添加文字风格，如下划线，删除线，粗体，斜体
字体对齐 (align)：字体对齐方式有多种模式，可根据实际需求进行设置；需要注意，当仿真时文字不在同一水平线上，请将对齐方式设置为居中对齐

图为输入框控件效果

3.1.6 图片按钮

图片按钮为高级控件之一，该控件可以理解为图片控件与按钮控件的结合，既可以显示单张图片又可以开启按下时状态显示另一张图片，实现类似按钮按下的动态切换效果，并且还支持点击后循环切换显示的图片

可更改的样式属性：

未按下图片路径 (src_released)：要使用图片按钮控件，需要先导入本地的图片素材。之后在图片控件的属性栏中设置未按下状态的图片路径
宽度高度 (size)：1）图片控件在设置图片路径后会自动将宽度高度设置为原图片的宽度高度；2)将鼠标放在图片按钮边缘，拖动边缘自由调整图片按钮的大小
坐标 (pos)：1）通过定义不同的XY值，来调整控件的位置；2）通过键盘↑↓← →键来调整图片按钮控件的XY坐标位置
透明度 (opa)：可以更改图片的透明度，使其呈现完全隐藏，若隐若现等效果
切换状态 (state)：开启设置是否按下时，将切换图片状态，添加控件切换时显示的图片，可以添加多张，按添加顺序切换，切换到最后一条时重新切换回第一条循环
隐藏 (visible)：可以在画布中隐藏/显示元件

图为按下状态的图片按钮