下拉框可筛选多层级菜单多选_Axure—中继器多级菜单实现

网上有好多关于中继器的多级菜单实现方法，二级菜单、三级菜单等等，但是每个中继器多级菜单的实现都是固定层级的实现，那么有没有一种更简单的方法去实现不固定层级的多级菜单呢？下面和大家分享一种不限层级的中继器多级菜单实现方法。

1、概况

指导思路

菜单展示 —— 父级菜单永远排在子级菜单前面 —— 排序

菜单展开/收缩 —— 筛选/取消筛选

所需元件

• 中继器 * 1
• 该中继器下面的元件
• 矩形 * 1：命名为“区域”
• 矩形* 1 ：命名为“name”
• 中继器外部的元件
• 矩形 * 2： 控制展开/收缩动作，获取部分属性值传递参数

涉及交互事件（用例）：

• 中继器用例：载入时
• 中继器用例：每项加载时
• 矩形用例：鼠标单击时
• 涉及动作：
• 添加排序（中继器）
• 添加筛选（中继器）
• 更新行（中继器）
• 设置文本
• 设置尺寸
• 隐藏（元件）
• 设置选中状态）
• 触发事件

涉及函数及变量

• Target：目标元件
• width：元件宽度
• height：元件高度

注意操作

用例的判断条件

2、素材制作

（1）拖入一个中继器，设置中继器的行距为0（单击中继器，右侧样式最下选择“间距”进行设置）。

双击中继器，进入中继器内部设置。

拖入一个矩形，命名为“区域”：

• 设置（默认）宽高为：250*45；
• 设置（默认）线段颜色为F2F2F2；
• 选中时填充颜色为CCCCCC。

拖入第二个矩形，命名为“name”：

• 设置（默认）宽高为：250*45；
• 设置填充不透明度为0；
• 右键设置交互方式。

（2）拖入矩形，命名为“展开/上级”，样式随意 —— 后面触发事件要用到，矩形不展示。

（3）拖入矩形，命名为“收缩/层级”，样式随意 —— 后面触发事件要用到，矩形不展示 。

设置好之后大概长下面这个样子：

注意：预览效果中应将元件“展开”“收缩”隐藏，用户不需要看到

3、中继器数据

按以下属性表规格为中继器填入部分数据：

字段说明：

（1）Grade – 层级，用于区分层级，明确菜单为第几级菜单：

（2）Cno – 编码，此处