交互行为
按钮
按钮是一种常见的小部件,通常用于触发特定的操作或事件。在低代码平台中,用户可以通过拖拽和配置来创建和使用按钮小部件。按钮小部件的主要功能是触发特定的操作或事件。当用户点击按钮时,可以执行预定义的操作,如提交表单、打开链接、显示对话框等。
应用场景
- 提交表单:在表单页面中,按钮通常用于提交表单数据。当用户填写完表单后,可以点击按钮将数据发送到服务器进行处理。
- 导航:在页面中,按钮可以用于导航到其他页面或网站。例如,用户可以点击按钮打开一个新的页面,或返回到上一个页面。
- 触发事件:在应用程序中,按钮可以用于触发特定的事件或操作。例如,用户可以点击按钮播放音频、视频或显示对话框等。
- 交互:按钮可以与其他小部件进行交互,实现更复杂的交互效果。例如,当用户点击按钮时,可以显示或隐藏其他小部件,或切换小部件的状态等。
- 确认操作:在执行某些操作前,按钮可以用于确认用户的选择。例如,在删除文件或数据前,可以显示一个确认对话框,让用户确认是否执行操作。
常用属性
属性 | 作用 | 默认值 |
---|---|---|
宽 | 设置按钮的宽度 | 200 |
高 | 设置按钮的高度 | 40 |
边距 | 参考容器 | #FFFCFCFC |
边框 | 参考容器 |
条件生成器
条件生成器是一种工具类型的小部件,它帮助用户通过简单的逻辑设置来创建和修改条件语句。其可以与变量绑定,支持 字符串、布尔、数字、对象、数组 五种类型的表达式。
应用场景
- 数据筛选:在数据展示或报告应用程序中,条件生成器可以用于筛选数据。用户可以通过设置条件来筛选出符合特定条件的数据,例如筛选出年龄大于18岁的用户或状态为已发布的内容。
- 搜索功能:在搜索应用程序中,条件生成器可以用于构建复杂的搜索查询。用户可以通过设置多个条件来构建搜索查询,例如搜索标题包含"编程"且发布日期在2022年之后的文章。
- 权限控制:在权限管理系统中,条件生成器可以用于定义用户权限。管理员可以通过设置条件来定义哪些用户可以访问或修改特定的资源,例如只有管理员可以编辑高级设置。
- 自动化流程:在业务流程自动化系统中,条件生成器可以用于定义触发自动化任务的规则。例如,当订单状态变为"已发货"时,自动发送通知邮件给客户。
- 数据分析:在数据分析工具中,条件生成器可以用于创建数据分析的条件。用户可以通过设置条件来分析符合特定条件的数据集,例如分析销售额超过一定阈值的产品。
- 表单验证:在表单应用程序中,条件生成器可以用于创建表单字段的验证规则。例如,要求用户输入的密码长度必须大于8个字符,且包含至少一个数字。
例如,定义一个变量,在右侧的属性编辑器中进行变量绑定并设置条件
滑动列表
滚动条
滚动条小部件是一种用于浏览和导航内容的小部件,通常出现在列表布局等容器中。
应用场景
- 浏览长内容:在网页或应用程序中,滚动条通常用于浏览长内容。例如,当用户打开一个包含大量文本或图像的页面时,滚动条可以帮助用户浏览和导航内容。
- 导航数据:在表格或数据列表中,滚动条可以用于导航数据。例如,当用户打开一个包含大量数据的表格时,滚动条可以帮助用户浏览和导航数据。
- 查看详细信息:在对话框或弹出窗口中,滚动条可以用于查看详细信息。例如,当用户打开一个包含详细信息的对话框时,滚动条可以帮助用户浏览和导航详细信息。
- 浏览历史记录:在浏览器或应用程序中,滚动条可以用于浏览历史记录。例如,当用户打开一个包含历史记录的页面时,滚动条可以帮助用户浏览和导航历史记录。
- 调整视图:在地图或图像查看器中,滚动条可以用于调整视图。例如,当用户打开一个包含地图或图像的页面时,滚动条可以帮助用户浏览和导航视图。
常用属性
属性 | 作用 | 默认值 |
---|---|---|
滚动条是否可见 | 设置滚动条是否可见 | 200 |
滚动条轨道是否可见 | 设置滚动条轨道是否可见 | 40 |
滚动条厚度 | 设置滚动条厚度 | 4 |
滚动条轨道弧度 | 设置滚动条轨道弧度 | 12 |
滑杆
滑杆是一种用于选择和调整数值的小部件,通常由一个水平或垂直的条形区域和一个可拖动的滑块组成。
应用场景
- 调整音量:在音乐或视频播放器中,滑杆通常用于调整音量。用户可以通过拖动滑块来选择一个音量范围,从而调整音量大小。
- 调整亮度:在图像或视频编辑器中,滑杆可以用于调整亮度。用户可以通过拖动滑块来选择一个亮度范围,从而调整图像或视频的亮度。
- 选择进度:在音乐或视频播放器中,滑杆可以用于选择播放进度。用户可以通过拖动滑块来选择一个播放进度范围,从而跳转到指定的播放位置。
- 调整数值:在设置或配置页面中,滑杆可以用于调整各种数值。例如,用户可以通过拖动滑块来调整屏幕分辨率、字体大小、网络速度等。
- 选择范围:在数据分析和可视化工具中,滑杆可以用于选择数据范围。例如,用户可以通过拖动滑块来选择一个数据范围,从而筛选出符合条件的数据。
常用属性
属性 | 作用 | 默认值 |
---|---|---|
初始值 | 设置滑杆的初始值 | 5 |
最小值 | 设置滑杆的最小值 | 0 |
最大值 | 设置滑杆的最大值 | 10 |
步长 | 设置滑杆的步长 | |
宽 | 设置滑杆的宽度 | |
活跃颜色 | 设置滑杆的活跃颜色,即滑杆左侧的颜色 | #FF4B39EF |
不活跃颜色 | 设置滑杆的不活跃颜色,即滑杆右侧的颜色 | #FFE0E3E7 |
显示值 | 设置为true,即滑杆滑动的过程中显示值 | false |
设置精度 | 即显示值的精度 | |
禁用 | 设置为true,即禁止滑杆滑动 | false |
日历
日历是一种用于显示和选择日期的小部件,通常由一个网格或列表组成,每个格子代表一个日期。
应用场景
- 日期选择:在表单或设置页面中,日历可以用于选择日期。用户可以通过点击日历上的格子来选择一个日期,从而完成日期输入。
- 日期范围选择:在数据分析和可视化工具中,日历可以用于选择数据范围。用户可以通过拖动日历上的格子来选择一个日期范围,从而筛选出符合条件的数据。
- 倒计时:在倒计时或提醒应用程序中,日历可以用于显示倒计时。用户可以在日历上设置一个目标日期,并查看距离目标日期的天数。
常用属性
属性 | 作用 | 默认值 |
---|---|---|
日期描点列表 | 设置日历描点,在指定日期上描点,支持变量绑定 | |
选中背景颜色 | 设置日历的选中背景颜色 | #FF5C6BC0 |
行高 | 设置日历的行高 | 52 |
标记颜色 | 设置日历的标记颜色 | #FF4CAF50 |
标记大小 | 设置日历的标记大小 | 8 |
星期视图 | 开启后,则只展示当前周的日历天数 | false |
显示头部 | 关闭后,则不展示日历头部 | true |
周一开始 | 开启后,日历从周一开始,默认从周日开始 | false |
显示格式按钮 | 开启后,日历右上角会出现一个按钮,点击可进行切换格式 | false |
标题文本样式 | 参考文本 | |
星期文本样式 | 参考文本 | |
日期文本样式 | 参考文本 | |
选中日期文本样式 | 参考文本 |
相机区域
相机区域是一种用于拍照和视频录制的小部件,通常由一个预览窗口和一组控制按钮组成。
应用场景
- 拍照和视频录制:在相机应用程序中,相机区域可以用于拍照和录制视频。用户可以通过点击控制按钮来拍照或录制视频,并将拍摄的内容保存到本地或上传到服务器。
- 实时视频监控:在视频监控或安全监控应用程序中,相机区域可以用于实时显示监控画面。用户可以通过相机区域查看监控画面的实时情况,并进行实时监控和分析。
常用属性
属性 | 作用 | 默认值 |
---|---|---|
宽高比 | 设置相机区域的宽高比 | |
像素比 | 设置相机区域的像素比 | |
左 | 设置水印位置距离左侧多远 | |
下 | 设置水印位置距离底部多远 |
定时器
切换图标
提示 Tooltip
摇杆
摇杆是一种用于控制方向和速度的小部件,通常由一个圆形或矩形的区域和一个可拖动的遥杆组成。
应用场景
- 游戏控制:在游戏应用程序中,遥杆可以用于控制角色的移动和方向。用户可以通过拖动遥杆来控制角色的移动速度和方向,从而实现游戏的操作。
- 无人机控制:在无人机控制应用程序中,遥杆可以用于控制无人机的飞行方向和速度。用户可以通过拖动遥杆来控制无人机的飞行速度和方向,从而实现无人机的操控。
- 虚拟现实控制:在虚拟现实应用程序中,遥杆可以用于控制虚拟角色的移动和方向。用户可以通过拖动遥杆来控制虚拟角色的移动速度和方向,从而实现虚拟现实的交互。
- 工业控制:在工业控制应用程序中,遥杆可以用于控制设备的运行方向和速度。用户可以通过拖动遥杆来控制设备的运行速度和方向,从而实现设备的操控。
常用属性
背景属性
属性 | 作用 | 默认值 |
---|---|---|
背景大小 | 设置摇杆的背景大小 | 200 |
背景颜色 | 设置摇杆的背景颜色 | #FF9E9E9E |
开启外环 | 开启后,显示外环 | true |
开启中环 | 开启后,显示中环 | true |
开启内环 | 开启后,显示内环 | true |
开启方向线 | 开启后,显示方向线 | true |
方向线颜色 | 设置摇杆的方向线颜色 | #FFFFFFFF |
摇杆属性
属性 | 作用 | 默认值 |
---|---|---|
摇杆大小 | 设置摇杆的摇杆大小 | 40 |
摇杆背景 | 设置摇杆的摇杆背景颜色 | #FF2196F3 |