axure商城

【Axure中继器】利用中继器简单实现无限级别的树形菜单功能

本文适合有一定 Axure 基础的读者阅读!

一、先看效果:

【Axure中继器】利用中继器简单实现无限级别的树形菜单功能

二、解决思路:

1、素材:一个中继器就够

中继器里放如下组建:Label \ Box \ Icon(箭头)

如图:

【Axure中继器】利用中继器简单实现无限级别的树形菜单功能

2、通过展开或者收缩时,设置某些数据显示或者隐藏即可;

3、中继器的内容设置需要有一定的要求:

a.每行的数据需要体现父子的关系;

如图:

 

【Axure中继器】利用中继器简单实现无限级别的树形菜单功能

字段说明:

type:菜单的级别:1表示一级菜单;2表示二级菜单….以此类推;

ID:菜单的ID,请按规律设置;

PID:菜单的父级ID,体现上下级的关系;

hasson:是否有子菜单,1:有;0:无,这个主要用来显示图标的

name:菜单名称;

eye:是否可见;1:可见;0:不可见;通过这个来实现菜单的折叠还是展开;

xuan:表示图标是否需要旋转,1:要,0:不要;

sel:辅助用,可以不要;

url:链接:有值的时候,点击菜单,可以打开链接;

4、添加交互后,就可以实现了。

三、交互如下:

1、中继器加载的时候:

【Axure中继器】利用中继器简单实现无限级别的树形菜单功能

       2、中继器每项加载时,交互如下:

【Axure中继器】利用中继器简单实现无限级别的树形菜单功能

3、菜单点击时,交互如下:

【Axure中继器】利用中继器简单实现无限级别的树形菜单功能

 

给TA打赏
共{{data.count}}人
人已打赏
产品经理高级教程

作为音乐白痴,我在 Axure 上“弹”起了钢琴

2023-4-13 9:09:42

高级教程

Axure RP 9.0画布回到原点功能失效的解决办法

2023-4-25 11:44:09

axure商城
50 条回复 A文章作者 M管理员
  1. CarlosCheng190525

    感谢分享,搞定。 大家 实验的时候, 完成一个截图的设置后 要测试看看效果,弄明白原理 再做下一步。 中继器的数据 改改 看, eye 初始化时 最好 一级菜单 才设为1。

  2. 青青草原懒大王

    rp_menu和lb_menuName是在哪里选择啊,他们代表啥啊,我用的Axure10,为什么只能选择中继器

  3. axure12 开发

    别试了没用浪费时间,这公本身就有问题

  4. train1981

    请问下每项加载时的那第一个case1 if true是什么条件,我没设置出来

    • 深南大道

      不用设置任何条件;
      然后你再加一个条件时,上面这个就自动变为if true了

  5. ohmy

    源码地址:https://gitee.com/jiahang_jh/axure.git

  6. 雒陽水手

    照着老师的一步一步做了,确实可以实现,感谢!

  7. dd_time

    感谢老师的分享,我用的是axure9。9和10的参数配置有些许出入,琢磨了一上午实现效果了。期待您的其他作品

  8. asrx

    请教一下,步骤三菜单交互时,展开收起功能在哪,我用的axure9,只有展开/收起树节点,这2个完全不同的,没有办法实现上述的步骤过程与效果

    • 深南大道

      所谓的展开和收缩,就是设置是否可见(eye = 1,显示;eye=0,隐藏)

    • asrx

      感谢分享,初步实现了效果,但是最终效果有2个问题,第一,打开的时候菜单默认是全展开,如果希望默认是收起态该如何实现,第二,当直接点击一级菜单时,展开的二三级菜单直接收起,这没问题,但当再次点击收起的一级菜单时,展开结果为二级菜单,但二级菜单旋转图标展示不正确,为展开下拉态,这里有两种可能,第一种情况,如果展开收起一级菜单是默认保留上次的菜单状态,那此时三级菜单应该同为显示,但此时并没有,第二种情况如果展开收起一级菜单仅展示下一级菜单,那此时二级菜单的旋转图标显示不正确,应该是收起态。劳烦楼主解答下疑惑

    • 深南大道

      想默认全部收起,把eye的值改为0,xuan的值也需要改为0.
      后面的问题,你可以把你写的交互发给我看看。
      这个交互是非常简单的,就两句。

    • asrx

      整个效果过程和步骤都是按照上述分享完成的,只增加了移入移出交互

    • 小乌龟呀

      你是把矩形框、图标、文本框 组合 了,在这个组合上加的交互么?

    • asrx

      人工审核有点慢,发了几条都还没出来😂

    • 小乌龟呀

      这样改有一个问题,如果你把三级菜单都已经展开了,然后收缩一级菜单,再次展开一级菜单时,二级菜单的箭头是旋转90°状态的,但是三级菜单并没有显示。需要点击二级菜单收起箭头,再点击箭头展开才能看到三级菜单。

    • asrx

      👍感谢分享,已经实现了功能,但还有2点想继续请教一下,1是现在是全展开的默认状态,如果默认状态是全收起呢,该如何实现? 2是当前在全展开状态下,点击一级菜单收起,再次点击一级菜单展开,此时二级菜单的旋转图标为展开状态但并没有显示三级菜单,这个问题是bug还是需要进一步去优化解决?

    • 小乌龟呀

      我自己琢磨下,加了一个交互,解决了这个问题。

  9. CY、zero

    请教一下,我这一句好像不执行

  10. 大Ju为重

    展开没有问题,但是折叠,点击任何一级任何一个都会全部折叠,是什么问题啊?

  11. 燚龖♪♬♭

    上班时间研究了一天 ,发现没弄出来,没玩过中继器好难受啊,跪求大佬给个PR 😂

  12. MSX

    谢谢楼主学会了。但是 [[Item.url]] 如何能在内联框架中打开页面?

    • MSX

      😁自己点了一遍会了

  13. 随缘

    AXure 10中文版中不行,载入时就不行,预览时界面不显示文字

  14. 孤单顺其自然

    问题:折叠后无法展开;
    已经根据下面回复注意到indexOf的大小写;其实也是直接通过参数选择的;默认使用的参数选择补充;

  15. 🐠得水

    老师您好,loaded事件不是应该在页面加载的时候触发吗?把filter放在loaded里边隐藏不了吧,我用的是axure 9

    • 深南大道

      这个是中继器加载的时候,不是页面加载的时候,页面加载是:pageload

  16. HY170200

    楼主很牛,谢谢。 另外告知有幸看到这条评论的小伙伴,如果是用的Axure10可能会弄不出来,Axure10的中继器有问题(不排除我电脑问题或者软件版本问题,Axure10最新版),我特么折腾一天,愣是弄不出来。换了几分钟弄出来了,擦,想骂

    • 干饭人

      我就是axure10 项目加载时事件只有排序第一个可以,其他都失效,你也是这个问题吗

    • 深南大道

      可能是汉化大问题,我用英文版是没有问题的。

  17. 凯凯拉克

    照着抄的,奇怪了,收缩以后再点击打不开,看了好几遍也不知道错在哪里了

    • 深南大道

      函数要注意大小写:indexOf,不是indexof.
      Axure的代码会转化生成javascript脚本,需要区分大小写。

  18. 凯凯拉克

    不太明白click后两个事件怎么做到的条件没有elseif?

  19. 神经蛙167966

    有中文版的吗,对不上菜单 看这费劲 axure9

  20. 神经蛙167966

    有中文版的吗,看的很费劲

  21. 咸鱼404

    感谢分享 花了两个小时终于看懂全部条件及函数的意义 学会了

    • 深南大道

      恭喜你😁 同样的逻辑,可以运用在表格的折叠行上面。

  22. Kk

    只是截图出来看起来挺费劲的,没有文字描述下每个设置是干什么的吗

    • Kk

      交互项是知道的,主要是想知道每一项是干嘛的,比如赋值给按钮,判断是否是父级等等,虽然慢慢的看还是能弄明白,但是挺费劲

    • Kk

      想问一下,第一步的设置里面,不在其他情形里加入设置文字和图片,是怎么做到情形切换时按钮上的文字还在的?我这边点击之后文字和图片就消失了,必须要把if为真的动作在每个情形里面重新设置一遍

    • 深南大道

      需要注意看,所有的条件都不是if. else 的关系,都是独立的if条件。

  23. 黄老师
    黄老师给作者打赏了¥10
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索