按钮工具栏

1. 组件概述

按钮工具栏是一个容器组件，用于将多个按钮组织在一起，形成一个统一的操作区域。工具栏内的按钮之间会自动保持一定的间距，使界面更加整洁美观。它适用于需要在同一位置放置多个相关操作按钮的场景，比如表单底部的”提交”和”重置”按钮、编辑器的工具按钮等。

加载中...

查看 JSON

复制 JSON

2. 应用场景示例

• 场景一：AI 对话应用的操作区。在一个 AI 问答应用中，用户输入问题后，底部需要放置”发送”、“清空”、“语音输入”等多个按钮。使用按钮工具栏可以将这些按钮整齐地排列在一起，用户可以方便地选择不同的操作方式。
• 场景二：答题练习的控制面板。在一个学习辅导类应用中，答题区域下方需要放置”提交答案”、“查看提示”、“跳过此题”等按钮。通过按钮工具栏将这些按钮组织在一起，形成清晰的操作区域，方便学生进行各种操作。

加载中...

查看 JSON

复制 JSON

3. 功能配置

高级

基本折叠组

配置项	说明
标题	工具栏左侧显示的标签文字，用于说明这组按钮的用途。例如”操作”、“快捷功能”等。如果不需要标题，可以留空。
标题提示	在标题旁边显示一个小问号图标，鼠标悬停时弹出提示内容。适合放置对这组按钮功能的简短说明。
控件提示	在工具栏旁边显示一个小问号图标，鼠标悬停时弹出提示内容。
描述	显示在工具栏下方的浅色说明文字，用于补充解释这组按钮的用途或操作说明。
按钮管理	管理工具栏中包含的按钮。可以添加新按钮、删除已有按钮、拖拽调整按钮顺序。点击”新增按钮”可以添加一个新的按钮，添加后可以在画布中选中该按钮进行详细配置（如设置按钮文字、样式、点击事件等）。

状态折叠组

配置项	说明
可见	控制工具栏是否显示。默认可见。可以绑定变量，根据条件动态控制工具栏的显示与隐藏。
隐藏	控制工具栏是否隐藏。与”可见”相反。
禁用	控制工具栏是否禁用。开启后，工具栏内的所有按钮都会变灰且不可点击。可以绑定变量，例如在表单校验未通过时禁用整个操作区。

设计

基本折叠组

配置项	说明
布局	控制标题与工具栏的排列方式。可选：内联（标题和按钮在同一行紧凑排列）、水平（标题在左，按钮在右，占据整行）、垂直（标题在上，按钮在下）、继承（跟随父级表单的布局设置）。