《Axure中继器中级教程:左侧导航》是一篇关于Axure的学习教程,通过简单几步就能实现教程中的效果图效果,当然只学习这一点,并不能完全掌握Axure技巧;你可以通过此加强中继器,交互产品,文本标签等多维度案例或实操来进行更多的学习;此教程是由gdyw在2021-08-25发布的,目前为止更获得了 0 个赞;如果你觉得这个能帮助到你,能提升你Axure技巧;请给他一个赞吧。
当工作中需要进行左侧导航操作时,我们可以如何使用Axure来进行相关操作呢?本篇文章里,利用中继器为大家展示左侧导航操作,让我们一起来看一下。
原型展示:https://kz5fi3.axshare.com
所需原件:
相信经过前面的 6 篇入门教程,大家已经对中继器有一定的入门了解,那么今天我们进一步学习如何使用中继器制作我们经常用到的左侧导航;
如上图所示,拖入 6 个文本标签,其中一个作为一级导航默认显示状态,其余 5 个作为二级导航,且设置成组并默认隐藏状态;
同时,在中继器的数据表中进行赋值设置,在这里,我以“N 1”作为一级菜单,“N1_1”作为二级菜单的第一个选项,以此类推来设置其余的 5 个二级菜单;
如上图所示,我们设置【点击】一级菜单时,切换显示和隐藏二级菜单,同时在更多选项中设置【推拉】下方组件,预览即可看到点击一级菜单时,会展开二级菜单,并使下方的其余菜单往下移动;
在完成步骤二的交互设置后,我们会发现如果二级菜单为空值,菜单也会展示,这样就无法达到我们预期的理想状态,所以需要为二级菜单增加【载入时】如果二级菜单为空值,那么隐藏该菜单,且拉起下方组件,如上图的设置所示;
此外,我们需要为二级菜单设置一个选中状态,并在点击时将该二级菜单设置为选中;
设置完成后,我们选中所有二级菜单并将它们设置为【二级菜单】的选项组,这样就可以让我们在做二级菜单的选中时,达到“单选”的效果。
以上就是Axure中继器中级教程:左侧导航的全部内容介绍了,关于更多Axure教程信息,欢迎关注北极熊素材库,给你带来最丰富的素材图片和最有用的教程,更多最新资讯。
赠人玫瑰,手有余香
< 上一篇 axure中继器使用教程之制作直播视频的卡片列表操作实例
> 下一篇 Axure 中继器入门教程:数据增删
2022-05-23 11:32
2022-03-07 11:17
首席设计师
高级视觉设计师
高级插画设计师
输入的验证码不正确
评论区
暂无评论