【Axure 教程】中继器中级教程-顶部导航

　　通过上一次的左侧导航教程，确信公共依然了然通过中继器怎样创制左侧导航了，这日咱们来尝尝其余的式样，来完毕顶部导航吧~

原型映现：

　　

所需原件：

　　 中继器 文本标签

通过上一次的左侧导航教程，确信公共依然了然通过中继器怎样创制左侧导航了，这日咱们来尝尝其余的式样，来完毕顶部导航吧~

　　 一、导航创制

　　

如上图所示，拖入 6 个文本标签，此中一个举动一级导航默认显示状况，其余 5 个举动二级导航，且设立成组并默认遁匿状况；

　　

同时，正在中继器的数据外中实行赋值设立，正在这里，我以“N 1”举动一级菜单，“N1_1”举动二级菜单的第一个选项，以此类推来设立其余的 5 个二级菜单；

　　 二、交互设立

　　

如上图所示，咱们设立【鼠标移入】一级菜单时，显示二级菜单（分别于左侧导航），同时正在更众选项中设立【弹出成效】，预览即可看到鼠标移入一级菜单时，会弹出二级菜单，鼠标移出后会自愿收起二级菜单；

　　 三、细节优化（同左侧导航）

　　

正在已毕措施二的交互设立后，咱们会觉察借使二级菜单为空值，菜单也会映现，如此就无法抵达咱们预期的理念状况，是以必要为二级菜单扩张【载入时】借使二级菜单为空值，那么遁匿该菜单，且拉起下方组件，如上图的设立所示；

　　

别的，咱们必要为二级菜单设立一个选中状况，并正在点击时将该二级菜单设立为选中；

　　

设立已毕后，咱们选中扫数二级菜单并将它们设立为【二级菜单】的选项组，如此就可能让咱们正在做二级菜单的选中时，抵达“单选”的成效；

　　

更众实质，微信探寻“爱学儿”，一齐交换考虑吧！