表单元素

文本输入框

  文本输入框是一个可以输入文字的矩形框，用户可以在里面输入和编辑文字内容。

应用场景

1. 表单输入：在网页和桌面应用程序中，文本输入框常用于表单输入。例如，用户可以在文本输入框中输入他们的姓名、地址、电子邮件地址、密码等。
2. 搜索功能：在搜索引擎和许多网站中，文本输入框用于接受用户的搜索查询。用户可以在文本框中输入他们想要搜索的关键词，然后点击搜索按钮进行搜索。
3. 文本编辑：在文本编辑器、办公软件和开发环境中，文本输入框允许用户输入和编辑大量的文本。一些高级的文本框还支持文本格式化、语法高亮等功能。
4. 数据输入：在数据输入和管理系统（如CRM、ERP系统）中，文本输入框用于输入各种类型的数据，如产品信息、客户信息、订单信息等。

常用属性

输入框大小

属性	作用	默认值
宽	设置输入框的宽度	200
高	设置输入框的高度	50

附加属性

属性	作用	默认值
只读	开启后，代表文本不允许被修改	false
密码输入框	开启后，代表输入框只接收密码类字符（字母、数字、特殊字符）	false
光标颜色	设置输入框内的光标颜色
显示键盘类型	设置输入框输入时弹出的键盘类型，
最大长度	代表输入框输入文本的最大长度，超出的文本则不进行显示
强制执行最大长度	开启后，代表拼音打字时的字符也会被计算在内，例如 最大长度设置为 4 ，输入字符为 你好，对应的拼音为 nihao，此时 只能输入niha，最后一个 o 无论如何也打不出来，但实际需要的最终字符为 你好
数据绑定	将输入的内容和变量关联起来，只支持 String 类型的变量

输入框装饰属性

参考容器

文本样式

参考文本

下拉菜单

  下拉菜单是一个可以点击展开的选项列表，用户可以从中选择一个选项。

应用场景

1. 表单输入：在表单中，下拉菜单可以用于收集用户输入，例如国家、省份、城市、性别等。与文本输入框相比，下拉菜单可以提供更好的用户体验，因为它可以防止用户输入无效的值。
2. 筛选和排序：在下拉菜单中，用户可以选择筛选条件或排序方式。例如，在电商网站上，用户可以使用下拉菜单按价格、销量、评价等条件筛选商品。
3. 语言选择：在下拉菜单中，用户可以选择不同的语言。这对于多语言网站或应用程序尤其有用。
4. 日期和时间选择：在下拉菜单中，用户可以选择日期或时间。例如，在日历应用中，可以使用下拉菜单选择日期和时间。

常用属性

属性	作用	默认值
数据绑定	将选中的下拉选项和变量关联起来，只支持 String 类型的变量

定义选型

属性	作用	默认值
初始选项	设置下拉菜单默认选中的值	200
提示文本	当没有下拉选项时下拉框中显示的文本	50
数据绑定	适用于下拉选项不确定的情况，将下拉选项和变量关联起来，只支持 String 数组类型的变量
添加选项	适用于下拉选项已确定的情况，例如 在选择性别的场景下，可添加下拉选项 男 女

下拉属性

属性	作用	默认值
宽	设置下拉菜单的宽度	300
高	设置下拉菜单的高度	40
边框颜色	设置下拉菜单的边框颜色	#1F000000
边框宽度	设置下拉菜单的边框宽度	1
边框圆角	设置下拉菜单的边框圆角	4
海拔高度	设置下拉选项下方阴影的大小	8

图标设置

下拉文本样式

文本内容 默认为 ${value}

参考文本

复选框

  复选框是一种小方块按钮，用户可以通过点击它来选择或取消选择一个选项。

应用场景

1. 表单输入：在表单中，复选框可以用于收集用户输入，例如兴趣爱好、技能、语言等。与单选按钮和下拉菜单相比，复选框可以提供更好的用户体验，因为它可以防止用户输入无效的值。
2. 筛选和排序：在复选框中，用户可以选择筛选条件或排序方式。例如，在电商网站上，用户可以使用复选框按价格、销量、评价等条件筛选商品。
3. 导航：在复选框中，用户可以选择不同的页面或功能。例如，在网站头部或侧边栏，可以使用复选框显示不同的分类或标签。

常用属性

属性	作用	默认值
数据绑定	将选中的下拉选项和变量关联起来，只支持 Bool 类型的变量
复选框初始值	设置复选框默认值	false
选中的背景色	设置复选框选中的背景颜色	#FF64B5F6
选中图标颜色	设置复选框选中的图标颜色	#FFFFFFFF
未选中边框颜色	设置未选中边框颜色	#FF9E9E9E
密集度	设置复选框内部的间距，以便适应不同的视觉密度	-2
圆角	设置复选框的圆角效果

复选框组

  复选框组是一组复选框，用户可以从中选择一个或多个选项，常用于多选操作。与单个复选框相比，复选框组可以提供更多的选项和更灵活的选择方式。

应用场景

1. 表单输入：在表单中，复选框组可以用于收集用户输入，例如兴趣爱好、技能、语言等。与单选按钮和下拉菜单相比，复选框组可以提供更好的用户体验，因为它可以防止用户输入无效的值。
2. 筛选和排序：在复选框组中，用户可以选择筛选条件或排序方式。例如，在电商网站上，用户可以使用复选框组按价格、销量、评价等条件筛选商品。
3. 导航：在复选框组中，用户可以选择不同的页面或功能。例如，在网站头部或侧边栏，可以使用复选框组显示不同的分类或标签。
4. 多选操作：在复选框组中，用户可以选择一个或多个选项。例如，在邮件客户端中，可以使用复选框组选择多个邮件进行删除或移动操作。

常用属性

选项配置

属性	作用	默认值
添加选项	设置 复选框组选项的值	300
添加选中值	设置 复选框组选中选项的值，支持多选	40

复选框属性

参考复选框

复选框标签文本样式

参考文本

未选中标签文本样式

参考文本

复选列表

单选按钮

开关

表单验证

开关列表

评级栏

选择标签

pin码

计数按钮

信用卡