一、准备元件
1、打开 Axure 新建文件，从元件栏拖出4个矩形1，左对齐从上往下摆放。宽度一致，为 200 px。高度分别为 80 px，45 px，30 px，30 px;
2、双击矩形，在矩形内分别输入“后台管理”，“用户管理”，“角色列表”，“账户列表”；
3、第2个矩形是一级导航栏，设置背景颜色为 #545C64，字体颜色为 #FFFFF。接着添加1个icon图标，w 30px,h 20px。然后选中矩形、图标，右键组合，并命名为“一级导航_用户管理组合”。
4、第3个矩形是二级导航栏，设置背景色为 #FFFFFF，字体颜色为 #333333.。
5、第4个矩形同样设置。
完成了以上动作，就可以得到一下的展示，看图：
二、设置交互样式
1、全选“角色列表、账户列表 ”，右键点击 交互样式设置 ，选择鼠标悬停 – 填充颜色 – 色值为 #F2F2F2，然后再选 选中 – 填充颜色 – 色值 #AAAAAA 。如图：
2、继续全选“角色列表、账户列表 ”，右键点击设置选项组名称 ，命名为“二级导航_用户管理选项组合”。选择“角色列表”，右键点击 选中（ 默认选中 ），完成 。
三、设置交互用例
1、选择“角色列表 ”，设置鼠标点击时 – 选中 – 选择 This 为 ture ，点击确定。添加目标，选中元件“一级导航_用户管理组合”，选择为true，点击确定。
2、 “账户列表”同上设置，复制粘贴过去即可 。
完成以上设置，我们的选项就可以点击切换的效果了。
3、把 “角色列表、账户列表 ” 选中，右键点击 转换为动态面板，命名为 “二级导航_用户管理选项动面 ” ，点击把该面板隐藏。
4、选中“一级导航_用户管理组合” ，新建交互 – 设置鼠标单击时 – 显示/隐藏 ，选择目标元件“二级导航_用户管理选项组合”；选择：切换，动画：显示时向下滑动 / 隐藏时向上滑动，动画为：线性，250 毫秒 ； 勾上置于顶层 ； 选择：推动元件，方向为下方，动画为：线性，250毫秒。
4、选中“一级导航_用户管理组合” ， 单击时 增加动作：旋转 ，选择目标元件“用户管理展开”；选择：顺时针 180 度，动画：线性，250 毫秒 。
完成以上的制作，我们会看到了单个导航栏已经完成。我们可以给它复制多个这样的导航栏在一起，就可以实现多个并用了。
四、进阶
1、全选除“后台管理”外的所有元件，然后我们给它复制粘贴 1 个（根据需要可以粘贴n个），并把元件的名称修改为需要的名称。这里修改为“日志管理” 。按照以下方式排列：
2、因前面设置“用户管理”的时候，我们已经把 “推动元件 ” 设置好了 ，所以后面无需再设置。但前面我们把 “角色列表 ” 设置为默认选中状态，这里我们又复制了1个，所以我们需要把多复制出来的1个 “系统日志 ”去掉默认选中状态 。
3、选中“一级导航_用户管理组合”和“一级导航_日志管理组合”(如有多个一级导航，则全部选中)，右键选中“选项组”，命名为“一级导航_选项组”。
到这里就完成所有制作了，如有相关问题或建议请在下方留言，谢谢大家观看。
附参考：
http://www.woshipm.com/rp/1088033.html
https://blog.csdn.net/c11073138/article/details/88765446
