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商城
27 条回复 A文章作者 M管理员
  1. 大Ju为重

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

  2. 燚龖♪♬♭

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

  3. Mies

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

    • Mies

      😁自己点了一遍会了

  4. 随缘

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

  5. 孤单顺其自然

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

  6. 🐠得水

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

    • 深南大道

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

  7. HY170200

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

    • 干饭人

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

    • 深南大道

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

  8. 凯凯拉克

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

    • 深南大道

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

  9. 凯凯拉克

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

  10. 神经蛙167966

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

  11. 神经蛙167966

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

  12. 咸鱼404

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

    • 深南大道

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

  13. Kk

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

    • Kk

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

    • Kk

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

    • 深南大道

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

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