欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  科技

Axure怎么设计网站后台产品导航栏?

程序员文章站 2023-11-19 10:21:22
Axure怎么设计网站后台产品导航栏?...

axure中是做网站原型很方便,一个网站通常都需要一个导航菜单栏,实现多级导航菜单的功能,axure虽然内置了树状菜单,但是却不能随意变换格式,今天我们就来看看axure设计导航菜单的思路的教程。

1、打开axure,新建一个项目,命名一个页面为左侧导航栏,并双击打开

Axure怎么设计网站后台产品导航栏?

2、拖动矩形框分别作为导航栏面板项目一、子项目一、子项目二,一级项目字体为18,二级项目字体为16

Axure怎么设计网站后台产品导航栏?

3、将子项目一、二装换为动态面板,并命名二级-项目一,设为隐藏,移动到项目一

Axure怎么设计网站后台产品导航栏?

4、点击项目一,选择左侧的属性框,选择鼠标单击时

Axure怎么设计网站后台产品导航栏?

5、选择显示二级-项目一,将可见性选择切换,并勾选置于顶层,向下推拉原件,此时预览可以看见二级项目的功能已经设计成功

Axure怎么设计网站后台产品导航栏?

Axure怎么设计网站后台产品导航栏?

6、接下来制作三级项目,点击动态面板二级-项目一,按建立二级项目的方法进行新建子项目1.1、子项目2.2,字体为14,移动到子项目一下,转换为动态面板命名三级-子项目一,设置隐藏

Axure怎么设计网站后台产品导航栏?

7、同样的在子项目一的属性里选择鼠标单击时,此时交互动作略有变化,首先隐藏二级-项目一,显示三级-子项目一,显示二级-项目一,勾选动作如图即可

Axure怎么设计网站后台产品导航栏?

8、此时再点击预览,简单的导航栏就设计成功了

Axure怎么设计网站后台产品导航栏?

以上就是axure设计网站后台产品导航栏的教程,希望大家喜欢,请继续关注。