Axure RP9制作三级菜单实现展开收起（保姆级教程）

最新推荐文章于 2024-04-12 16:57:39 发布
最新推荐文章于 2024-04-12 16:57:39 发布
阅读量2.3k 收藏 5
点赞数 3
文章标签： axure 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_73566291/article/details/132532589
版权

废话不多少，直接上效果图

 首先，先使用方框创建好基本结构

 

然后，对每一级菜单创建动态面板

 

然后先设置二级菜单的交互事件

设置好以后，把二三级菜单打组

 

 

打组完成后，对一级菜单添加交互事件

然后这样一组的三级菜单就做好了，接下来都是一个步骤！

 

 最后两组三级菜单做好如下

预览效果

 

奋进的程序初学者
关注
  • 3
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
Axure学习日记之tab菜单（一）——实现菜单下拉及折叠效果
Daye_V的博客
05-21 1517
Axure学习日记之tab菜单（一）——实现菜单下拉及折叠效果 在用Axure制作原型时常常会用到二级菜单，先记录一下二级菜单的创建，包括了动态显示。。 第一步：拖入三个动态面板，勾选自动调整内容尺寸（很重要），点击任意一个面板进入，添加一个新状态（状态2）； 第二步：进入状态2，将“一级菜单（1）”粘贴进来，同时新建二级菜单； 第三步：给动态面板添加点击事件，鼠标单击时->当前面板->状态2，同时勾选推动/拉动原件； 第四步：进入状态2，对一级菜单（1）设置单击事件，鼠标单击时->
Axure9 |菜单的弹出与收起
Binnadadada的博客
05-27 3486
实现效果： 首先，布置页面，将菜单所有的元件组合，组合的名称为"菜单"；同时将“菜单”设置为隐藏； 我们要实现的效果很简单，就是单击“+”时，菜单展开，再次点击菜单收起。也就是说，如果菜单不可见，那么单击“+”时，应该展开菜单；如果菜单已经可见，单击“+”时，收起菜单； 所以，按照这个思路，开始设置“+”的交互。 如图，事件为单击时， 1.添加情形一，在情形一这个条件下，插入动作--显示菜单； 2.添加情形二，在情形二这个条件下，插入动作--隐藏菜单； ...
Axure 三级菜单 手风琴效果
10-31
Axure 三级菜单 手风琴效果的RP文件，无论是学习，还是自用，都可以方便使用。
Axure三级目录展开与收起
06-10
内容概要：Axure三级目录展开与收起资源文件 适用人群：产品经理 使用场景及目标：适用于工程项目类或办公类产品设计
Axure实现导航栏的展开与收缩
最新发布
LAO__LIN的博客
04-12 632
使用场景一般是B端后台系统需要以导航栏的展开与收缩实现原型的动态交互，主要使用区域是左边或者顶部的导航栏展开与收缩，同一级导航下的小标题，放在一起既美观又节省时间。
【Axure】怎么在原型图中实现菜单栏的展开和折叠
玫瑰与鹿°
06-19 1万+
要实现的功能： 点击右上角的“加号”，会弹出如下菜单栏。 第一步：在元件库中找到相应元件，添加即可。 第二步：将下面的4个文本框进行组合，并在右方“概要：页面”中，给组合起个名字。 第三步：在选中“加号”的前提下，添加用例。 第四步：切换可见性——选相应组合——确定 ...
Axure RP 9 for mac 高保真原型图 - 案例18 【导航栏-展开、收起】导入元件库
GroupiesM的博客
09-16 2513
Axure RP 9 for mac 高保真原型图 - 案例18 【导航栏-展开、收起】导入元件库
Axure RP9——【工具栏展开收起效果】
两条线-twolines
11-25 6189
工具栏展开收起效果 TOOLBAR 目录 工具栏展开收起效果 I.效果演示 II.实现步骤 I.效果演示 当点击按钮的时候，可以显示出工具栏的内容；再次点击可以收缩复原。 如下演示： Axure RP9 ——工具栏展开收起效果 II.实现步骤 （1）工具栏展开效果 ①按钮先向右移动一小段缓冲距离 ②按钮向左移动到达指定位置；工具栏面板从中心向两端展开；工具栏组合移动到（0,0）的位置 ③按钮通过旋转变成关闭样式 （2）工具栏关闭效果 ①按钮先向左移动一段...
Axure教程—折叠面板
weixin_43516258的博客
06-24 2155
本文介绍利用Axure中的动态面板制作折叠面板
Axure中继器实现三级菜单
weixin_44933101的博客
10-26 1682
在日常产品设计中，我们时常会使用到系统一级、二级、三级菜单等，那除了传统的动态面板设计菜单、矩形直接设计，有什么更便捷的方式吗，那就是用中继器实现三级菜单，下面我们一起来看看如何实现。Axure Design 高保真原型设计欢迎您，本站提供Axure多种动态交互元件库以及原型模板、高效便捷，提高设计效率。Axure Design 高保真原型设计欢迎您，本站提供Axure多种动态交互元件库以及原型模板、高效便捷，提高设计效率。步骤1：页面中拖入一个中继器，中继器中放三个元件，分别为图片、矩形、箭头图片。
AxureRP9展开栏目.rp
02-02
用Axure RP9做出图片轮播效果，利用动态面板实现展开栏目效果
Axure中ERP框架的三级菜单.rp
07-31
Axure中erp框架三级菜单的实现模型原理及方法，在实际的设计中用处很是广泛。欢迎广大朋友们提出指教及批评！
Axure 2、3层级菜单展开折叠Demo.rp
02-21
使用Axure做的 2、3层级菜单展开折叠Demo rp 源文件。 点击一级菜单展开二级菜单，点击二级菜单展开三级菜单。 用户可直接下载使用。
Axure RP9实现二级选择框联动 下拉多选框.rp
03-08
Axure RP9实现二级选择框联动，利用全局变量、动态面板、赋值等原理，第一个选择框单选，第二个选择框多选
Axure RP9 - 实现菜单下拉及折叠效果
热门推荐
wjs2580219863的博客
05-09 1万+
话不多说，直接上手： 1，拖入三个动态模板，分别命名1,2,3。 2，双击打开任意一个动态模板，我以1为例，添加一个模板状态，打开这个状态，加入原菜单以及新的二级菜单。 3，对状态2模板中一级菜单添加点击事件，点击设置当前面板状态为state1，并在动作中勾选推动/拉动原件。 4，退出动态模板，对该模板添加点击事件，点击设置动态模板状态为state2，同上，记得勾选推动/拉动原件，这样一个折叠菜单就配置完成了。 5，效果如下，点击弹出二级菜单，再点击收回，另外两个菜单配置同理.
其他行 展开 收起_Axure教程（中级）：侧导航收缩及展开
weixin_36278243的博客
01-13 686
本文为大家演示了，如何用Axure实现侧导航栏收缩、展开的效果，enjoy~在web端的后台管理平台，我们经常看到这样的侧导航。我们来简单模仿一下交互效果，此教程主要是运用动态面板的显隐和推拉动元件的效果：一、页面布局从左侧元件库拉入一个【矩形】作为【模块导航1】，一个【动态面板】作为【二级导航】，宽度设置为一样，如下：双击【动态面板01】，编辑【state1】，添加4个【矩形】作为展开的子导航。...
Axure实现水平菜单、垂直菜单、抽屉式菜单
聪哥
09-16 7779
通过Axure实现水平菜单、垂直菜单、抽屉式菜单的界面展示。
Axure实现随意折叠和展开
二枫的代码小窝
06-11 2689
1.拖动四个Rectangle，命名并上色 2.设置menu1，menu2的onclick方法——>Show/Hide——>Push/Pull Widgets 3.设置content1，content2为隐藏（Hidden） 4.改为重叠 5. 效果如图
axure9下拉菜单多级
09-08
在 Axure 9 中创建多级下拉菜单可以通过以下步骤实现： 1. 创建一个按钮或文本框，作为触发下拉菜单的元素。 2. 在 Axure 的交互编辑器中，选择该元素，然后点击右侧的 "鼠标交互" 选项卡。 3. 在 "鼠标交互" 选项卡中，选择 "单击" 或其他触发事件，并点击 "添加动作" 按钮。 4. 在弹出的动作列表中，选择 "显示/隐藏" 类别下的 "显示面板" 动作。 5. 点击 "面板" 字段旁边的 "+" 按钮，创建一个新的面板。 6. 在新创建的面板上，设计你的下拉菜单内容，可以使用形状、文本、链接等元素来模拟菜单项。 7. 可以在该面板上继续添加子菜单或其他层级的菜单项。 8. 在交互编辑器中，回到刚才的 "显示面板" 动作设置界面，选择刚才创建的面板。 9. 点击 "确定" 完成设置。 这样，当用户点击按钮或文本框时，相应的下拉菜单面板就会显示出来。你可以根据需要设置多个不同的下拉菜单按钮和面板。 希望以上内容对你有帮助！如果你还有其他问题，请随时提问。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值