Axure的多状态复选树
yund56 2025-06-25 21:09 3 浏览
本文将详细介绍如何在Axure中实现一种增强型的多状态复选树组件，它不仅支持全选、半选和未选等状态，还具备动态加载、关键字筛选等高级功能。
多状态复选树（Multi-State Checkbox Tree）是一种增强型树形选择组件，在传统复选树的基础上扩展了节点的交互状态，通常包括全选、半选、未选三种状态，并可能支持更多自定义状态（如禁用、部分禁用等）。半选状态表示该节点的子节点仅被部分选中，能够清晰反映层级选择的中间态。该组件适用于需要精细控制层级选择的场景（如权限管理、分类配置），通过状态可视化提升操作的准确性和用户体验，同时支持动态加载、异步更新等高级功能。
演示地址：
设计原则
1）清晰的层级结构
- 使用缩进、连接线或图标直观展示父子关系。
- 提供展开/折叠功能
2）合理的复选框状态
- 选中状态（Checked）：节点及其所有子节点均被选中。
- 半选中状态（Intermediate）：部分子节点被选中（难点！！！：需循环计算父节点子节点状态）。
- 未选中状态（Unchecked）：节点及其子节点均未被选中。
3）关键字筛选
可以通过关键字搜索，高亮对应行并展开。
先决知识：
首先，你已经学会《Axure无限级导航菜单（基础树TREE组件）》里面的导航组件的制作，另外，最好还能掌握《如何在Axure中使用“循环”》和《Axure监听器之中继器监听器》两个基本技巧。
教程：
还是先看一下元件结构：
元件说明
- (动态面板) check：选中状态（i-部分选中，c-选中，u-未选中）
- (文本框) path：用来做循环用的
- (文本框) search：关键字检索功能
- (形状) x：清除关键字(文本框) search
- (矩形) [[Item.text]]：既是节点文字，又是监听器
中继器数据（第一行为列名）：
字段说明：
- id：唯一标识符
- text：显示文本
- path：路径层级信息（斜杠分隔）
- level：层级
- order：排序序号
- expand：是否展开（t-是，f-否）
- check：选中状态（i-部分选中，c-选中，u-未选中）
- leaf：是否为叶子节点（t-是，f-否）
- hide：是否隐藏（t-是，f-否）
中继器交互如下：
动态面板check的交互如下
(文本框) path的交互如下：
这样，一个多状态的复选树就完成了，接下来我们加上关键字检索功能。
(形状) x的交互如下：
(文本框) search的交互如下：
(矩形) [[Item.text]]监听器交互如下：
这样，关键字检索功能也做好了。
优化
从以上交互可以看出，每次更改check节点，都会对中继器进行多次交互，层级越低，循环次数越多，非常影响效率，所以可以直接用(文本域) tree做为状态的存贮，然后在中继器内部新建一个监听去动态调整，不再反复更新中继器，操作就流畅许多。可以自己试着做一下。
本文由 @Jorkin 原创发布于人人都是产品经理，未经许可，禁止转载
题图来自 Unsplash，基于 CC0 协议
该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。
相关推荐
- 没有获得Windows 10 20H2升级通知，怎样直接升级
-
微软公司已经正式发布Windows1020H2操作系统，在正常情况下，微软只会首先推送到少量电脑，然后一边推送一边采集遥测数据。收集遥测数据可以确定哪些电脑可以更新，哪些电脑在更新后可能会失败，微...
- 不想让人随便卸载你安装的程序，用这四招，他将无计可施
-
Windows10不提供设置删除应用程序限制的功能，有几种间接方法可以防止用户删除操作系统中的程序和游戏。一、WindowsInstaller服务使用Windows工具，可以部分限制用户的权限。如...
- 一文看懂苹果全球开发者大会 五大系统全面升级
-
来源：环球网【环球网智能报道记者张阳】北京时间6月23日凌晨1点，苹果全球开发者大会（WWDC2020）如期举行，还是那个熟悉的乔布斯剧院，依旧是高水准的视频展示，但是这届WWDC，却是苹果历史...
- 无需等待微软分批推送，23H2可借助注册表快速获取Win11 24H2更新
-
IT之家10月15日消息，Windows1124H2正在分批推送，但由于存在多种Bug，微软已经开始放缓其推送节奏。WindowsLatest发现，Windows1123H2...
- 办公小技巧:剑走偏锋 PPT中打造动态图表
-
年底到了少不了又要制作各种总结报表，为了让自己的报表与众不同，我们可以借助PowerPoint动画组件+报表的方式，打造出更为出彩的动态图表。下面以PowerPoint2016为例，介绍如何使用三维...
- 文档表格 版本差异何在
-
在办公过程中，对文档或表格的修改是司空见惯的事。那么，一份文档做了内容改动，如何知道差异在哪里？一份表格改动部分数据，如何知道哪些有所变动？不要说审阅和修订功能，因为不是所有人都会用这些功能来标注的，...
- Excel VBA自制日历组件16色可选 完美替代VBA日期控件
-
本日期组件可跟随单元格跟随窗体中ActiveX文本框组合框控件16种配色可选私信回复880日历可体验效果使用说明1打开自己需要应用日历面板的Excel表，注意必须是启用VBA的格式2在...
- 如何从交互角度读懂产品需求文档
-
作为设计师，理解产品经理提供的需求文档是交互设计工作的重要前提与起点，然而对于很多设计师来说，需求文档内容通常非常复杂，设计师们需要花费大量时间去消化、理解和归纳。本文作者结合公司示例，分析设计师如何...
- 植入让文档变得更强大
-
有效地利用文档置入技术，会让我们的常用文档功能变得更加强大，实现更加高效或有趣的应用。1.写字板文档嵌入其他文档有时，我们要组织一个大型的文档，但是这些文档的内容可能来自于不同种类的文档编辑器，比如...
- Office 2016滚动文本框 顺手就来
-
【电脑报在线】如果一页PPT内容较多无法在完全显示，就需要用到滚动文本框，在PPT2016中借助控件即可快速制作滚动文本框。在“告诉我你想要做什么”输入“文本框控件”，在搜索结果点击“文本框（Acti...
- Axure的多状态复选树
-
本文将详细介绍如何在Axure中实现一种增强型的多状态复选树组件，它不仅支持全选、半选和未选等状态，还具备动态加载、关键字筛选等高级功能。多状态复选树（Multi-StateCheckboxTre...
- 办公小技巧:PPT中控件图表巧联动
-
在利用PPT进行图表演示时，操作者有可能要与图表进行交互联动，比如通过输入数据来预测产品的生产情况等，这时就需要用到“开发工具”中的控件了。几个控件配合几句VBA代码，就可以轻松实现上述交互联动效果（...
- 用好插件——找回火狐的旧功能
-
现在的软件，特别是浏览器类软件，更新换代速度都很快，而且无论是外观界面还是系统组件都会有较大的变化，这样会让很多朋友无所适从。以大家常用的火狐浏览器为例，它就已经升级到了最新的35版，而且在新版中对很...
- 重新认识控件(二)
-
图片和文字，都是一种数据形式。我平时对文本框的录入，报错和提交的设计比较多。最近涉及到图片控件的设计，细细琢磨一下，这玩意还有一些平时没太注意的细节点，感觉对于其他控件的设计有指导意义，特此总结一下传...
- JSA宏教程——在文档中添加复合框控件
-
上一期，我们初步认识了控件Control，本节我们将继续控件的相关内容。这几期我们将逐一介绍相关控制。本节先介绍复合框（也叫组合框）Combobox。复合框的作用复合框就是一个下拉选项框，一次显示一个...
- 一周热门
- 最近发表
- 标签列表
-
- filter函数js (37)
- filter函数excel用不了 (73)
- 商城开发 (40)
- 影视网站免费源码最新版 (57)
- 影视资源api接口 (46)
- 网站留言板代码大全 (56)
- java版软件下载 (52)
- java教材电子课本下载 (48)
- java技术的电子书去哪看 (33)
- 0基础编程从什么开始学 (50)
- java是用来干嘛的 (51)
- it入门应该学什么 (55)
- java线上课程 (55)
- 学java的软件叫什么软件 (38)
- 程序开发软件有哪些 (53)
- 软件培训 (59)
- 机器人编程代码大全 (50)
- 少儿编程教程免费 (45)
- 新代系统编程教学 (61)
- 共创世界编程网站 (38)
- 亲测源码 (36)
- 三角函数积分公式表 (35)
- 函数的表示方法 (34)
- 表格乘法的公式怎么设置 (34)
- sumif函数的例子 (34)