Axure教程：App侧边抽屉菜单交互制作

今天给大家示范一下抽屉菜单在Axure中的做法。在抽屉式菜单中，要实现两个交互效果，分别是：

交互一

抽屉菜单中1、2级菜单项的伸缩效果

实现逻辑：设置动态面板的切换状态及“推动/拉动原件”实现

交互二

菜单项的选中状态切换

实现逻辑：在辅助视图中设置选中状态

下面就来看看实现步骤吧：

交互一：抽屉菜单中1、2级菜单项的伸缩效果

步骤1

1、拖入一个动态面板，调整动态面板大小

2、双击动态面板，设置动态面板名称：“菜单1”，添加2个动态面板状态，分别命名为：收起、展开

步骤2

1、双击收起状态，进入“收起”状态页

2、在页面中拖入一个矩形，设置名称为“菜单1-收起”。调整菜单1的尺寸，并输入文字“菜单1”。

3、再拖入下拉箭头图片，调整尺寸

步骤3

添加“菜单1-收起”的鼠标悬停、选中样式，分别设置字体颜色：蓝色，填充颜色：浅灰色。