发布时间: 来源:专属你的守护 144
产品设计菜单栏是很常见的操作,而对于很多新手小伙伴而言,制作一个抽屉菜单可能是比较困难的!因此,接下来粤秀教育将教大家怎么使用Axure制作一个抽屉菜单!如果你打算自学Axure原型设计的话,推荐粤秀教育的Axure自学视频课,专业讲师传授知识点,可以0基础学会软件功能操作以及动手实操~
Axure抽屉菜单制作方法:
1、先将整个的背景颜色调为浅灰色,之后拉入一个动态面板,并调整自己想要的大小尺寸,在属性设置中将动态面板设置为自动调整为内容尺寸,然后双击该动态面板,将该动态面板命名为“菜单1”,再添加一个状态,分别命名为收起和展开。

2、咨询收起,拉入一个矩形,将尺寸设置为动态面板尺寸后,把矩形命名为“菜单1收起”并设置文字为菜单1,把填充颜色设为白色,拉入一个下拉箭头的图片,调整尺寸,将两个元件进行组合,勾选组合的允许触发鼠标交互。
3、添加“菜单1收起”的鼠标悬停和选中的交互样式,分别把字体颜色为蓝色,填充颜色为浅灰色。
4、为“菜单1收起”添加鼠标咨询的用例,将面板状态设置为展开,并选中推动/拉动元件。

5、将“菜单1收起”内容复制到动态面板的展开状态页面,把下拉图片换成上拉,将矩形的名称改为“菜单1展开”,同时将鼠标咨询的交互的面板状态设为收起。
6、将“菜单1展开”复制,粘贴一次作为子菜单并对应修改名称和文字为子菜单1(注意复制的时候不要复制到了组合),修改鼠标的咨询用例,选中当前元件。
7、复制粘贴子菜单,然后分别修改对应的名称和文字。
这样整个动态面板的设置就完成拉,这仅仅只是一个菜单,我们可以将该动态面板多复制粘贴几次,这样就能形成多个菜单了。
经过预览,发现还有一个问题——那就是咨询一个子菜单之后再咨询一个子菜单,发现两个子菜单都是选中状态,这时候我们就需要进行接下来的步骤进行完善他。
8、随便拉入一个原件,将名称命名为辅助且背景填充的透明度改为透明,添加隐藏用例,将所有的子菜单的选中状态都设为未选中。
9、修改所有的子菜单的鼠标咨询用例,先隐藏辅助视图,然后再设置当前元件的选中状态,最后显示辅助视图(如果一开始就知道有这一步,可以先添加辅助视图,然后直接在步骤6的时候直接设置对应的用例,就不用后期一个个子菜单进行修改)。
以上就是关于“Axure抽屉菜单怎么制作?”的内容分享了,希望能够帮到你!更多Axure精彩分享,尽在Axure相关文章!Axure因其能够快速、高效的创建原型,备受众多产品设计人员所使用!对于想要快速学会Axure原型设计的小伙伴,就可以选择粤秀教育精选的Axure自学视频课!不要犹豫,选择合适的课程开始学习体验吧~
立即申请报名,提升你的技能