Axure RP9 手风琴式侧边栏

最新推荐文章于 2024-06-27 10:47:47 发布
最新推荐文章于 2024-06-27 10:47:47 发布
阅读量1.1k 收藏
点赞数
分类专栏： RP9 手风琴左侧边栏 文章标签： Axue RP9
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43026206/article/details/124386508
版权
本文指导如何在界面中添加动态面板，首先创建名为'左侧边栏'的面板，随后添加展开/关闭的'一级菜单'，并设置其大小自适应内容。通过复制交互，完成多个面板配置，最后关闭最外层面板，详细介绍了前端布局的基本步骤。
摘要由CSDN通过智能技术生成

1.添加动态面板，命名为“左侧边栏”
在这里插入图片描述
2.双击编辑，在编辑页面再次添加动态面板，并命名为“一级菜单”，双击编辑新增展开和关闭状态，
关闭内层动态面板的编辑状态，设置为“调整大小以适合内容”，
在这里插入图片描述

3.新建交互

在这里插入图片描述
4.复制多个
在这里插入图片描述
5.关闭最外层动态面板即可

LifeOases
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Axure RP9 手风琴效果设置
07-08
利用Axure画原型，分享手风琴效果的模版
Axure 9 实战案例，动态面板的应用 6，导航菜单栏的手风琴效果
默林工作室
09-02 2558
Hello！欢迎来到Axure 9 实战案例教程专栏。点击了解课程简介>>我们接着再继续学习动态面板的应用，本篇课程我们来讲解一下，如何运用动态面板绘制导航菜单栏的手风琴效果。我们还是先来看看完成效果图，大家可以看到，手风琴菜单的交互主要包括：①点击菜单1~3时，可展开或收起内容区域；②点击收起菜单1~2时，其余下方菜单均向上移动；③点击展开菜单1~3时，其余菜单均收起（即手风琴效果）。菜单初稿一如既往，这里提前把菜单初稿准备好了。下面来给大家讲解一下手风琴效果的实现步骤。
Axture RP9实现动态导航栏
最新发布
2301_76794079的博客
06-27 390
4，主导航栏选择新建交互-单击时-显示隐藏-选择元件（为之前动态面板）-选择切换-动画效果按照自己想法设置-确认。完成简单交互，如图所示。2，将子导航栏全选，并按鼠标右键，转化为动态面板，给动态面板加一个名字（方便后续选择），并将动态面板隐藏，如图所示。3，在主导航栏这一项选择交互，按照自己想法添加元件样式。实现动态导航方法很多，简单介绍一种。1，如图做好自己想要做到导航栏。此帖子为作者学习经验记录。
Axure 折叠面板（手风琴）动态交互效果制作
weixin_44933101的博客
08-01 2593
什么是折叠面板？ 折叠面板可能是响应式设计中的最重要主力。这是一个非常有用的逐步呈现的模型——突出显示每个部分的重要细节，必要时利用点击来显示更多详细信息。因此，设计始终集中在最先显示的关键信息上，以便其他一切都易于访问。......
Axure8实现最常见的左侧动态导航
热门推荐
SCGH_Fx的专栏
03-23 1万+
转载自：Axure8实现最常见的左侧动态导航当初自己想了很久才实现了这种左侧的动态菜单栏。今天我跟大家分享一下怎么实现点击实现动态开合的那种左侧菜单栏。希望能帮助到一些刚入门的朋友们。主要知识点：通过显示/隐藏实现子菜单的开合通过移动控制菜单间的跟随移动，实现动态效果问题：想实现一个如下图一样的左侧动态菜单栏核心思路：菜单的开合怎么实现？答：可以通过动态面板的显示/隐藏实现开合，每级父菜单下的子菜...
使用Axure制作手风琴菜单
weixin_44540247的博客
01-15 1119
Axure在页面设计这一块起到了很大作用，它不仅可以将客观的文本改变为直观的演示模板，还可以对于页面的各个方面进行UI设计美化页面等等。 例如设计一个网站肯定少不了菜单栏。菜单栏的样式很多，有点击显示菜单、移入显示菜单等等。现在在设计上都喜欢加入一些看起来比较酷的操作，手风琴菜单也是比较普遍的样式。从展开样式，到动画特效看起来都是比较舒服的。 下面将分为两块来讲解如何使用Axure制作一个手风琴菜单的样式模板。 菜单样式布局： 如上图是一个简单的菜单栏样式。 这样一个布局很简单，首先需要搭建一个背景框架，
小白自学Axure- 侧边菜单栏
weixin_50534910的博客
01-09 981
在状态一“折叠”下创建交互，选择事件（单击/双击...触发）-选择“设置面板状态”-修改面板状态为”展开“，并勾选二级菜单展示方式。再选择状态二“展开”以同样步骤创建交互就能得到一个菜单栏咯。建议：给每一个动态面板设置名称，这样在后续设置交互时，便于区别、操作！2、双击打开后设置每个状态的样式。1、给对应项创建“动态面板”
AxureRP9 Bootstrap4 插件
02-05
Bootstrap4 for AxureRP9 插件是一款专为Axure RP9设计的工具，它将流行的前端框架Bootstrap 4引入到原型设计过程中，使设计师能够更便捷地创建响应式、移动优先的网页原型。Bootstrap 4是目前最广泛使用的前端框架...
Axure RP 9 元件库
12-07
Axure RP 9 元件库加载，Ant design Axure组件库，Axure库全套，Google Material Design 900个实用的Axure图标组件库 LIB002+-+AxureUX交互原型Web元件库精简版
AxureRP9萌新修炼手册.pdf
11-18
Axure RP9 是一款强大的快速原型设计工具，由 Axure Software Solution 公司开发，用于创建原型和交互设计。它的发音通常为“艾克舒尔”。该软件广泛应用于产品经理、交互设计师、信息架构师等多个领域，不仅限于...
AxureRP9萌新修炼手册(1.6版)+Axure RP 9 快捷键.zip
10-26
本篇将围绕"AxureRP9萌新修炼手册(1.6版)"及"Axure RP 9 快捷键"这两个主题，详细介绍Axure RP 9 的基本操作和快捷键，以帮助初学者迅速提升技能。 1. **Axure RP 9 基础知识**： - **界面布局**：Axure RP 9 的...
Axure 三级菜单 手风琴效果
10-31
Axure 三级菜单 手风琴效果的RP文件，无论是学习，还是自用，都可以方便使用。
Axure 9实现左侧动态导航栏
James199209的专栏
03-26 4405
目前很多B端产品都是基于左侧的导航栏，有研究表明导航栏放在左侧效率更高。那基于Axure怎么能够实现呢，其实只需要动态面板组件就可以搞定。 1.首先，拖入四个矩形组件，如下图所示，第一个矩形取名为一级菜单1。然后将后三个全部选中，右键选择转化为动态面板。取名为二级菜单1。 2.这个动态面板可以预先设置为隐藏。该设置是为了实现在点击一级菜单时才能显示出二级菜单。默认是不展开的效果。 3.接下来设置动画效果，选中一级菜单1组件，右侧选择动作--单击时，显示/隐藏，目标选择二级菜单1，选择切换，同时
axure 侧滑抽屉式菜单_AxureRP教程
weixin_29149931的博客
12-30 869
前面介绍的《AxureRP教程–自适应菜单效果》里的自适应菜单，其实也可以叫做抽屉式菜单，皆因其可展开可收缩，类似抽屉的开关，不过自适应菜单有空间大小的显示，这里介绍的则没有大小限制，完全取决于菜单项的多少。抽屉式菜单网上也有很多朋友尝试制作过，在这里我自己也尝试了一下，做了一个三级菜单的抽屉式效果。抽屉式菜单应用的比较广，一般常见于左侧的导航式菜单。本例的实现原理是用一个动态面板来控制一级菜单，...
Axure学习笔记（十）-手风琴菜单效果实现（使用动态面板）
weixin_48911487的博客
08-20 647
注：本笔记适用环境：win10+Axure RP 8 1.构建两个状态 2.勾选自动调整尺寸（让下拉的部分能够显示出来） 3.设置点击事件（state1和state2要分开画，不然会不管点击哪——选项卡或者是子选项，都会跳转到下一个状态的） 4.结果 点击前： 点击后： ...
axure9 变成小手_Axure9原型设计：动态面板实现手风琴菜单（低配版）
weixin_39974958的博客
12-19 276
原标题：Axure9原型设计：动态面板实现手风琴菜单(低配版)编辑导语：手风琴菜单常常在多级目录中使用，是系统设计中常见的设计之一。本文作者主要分享了用Axure9动态面板如何实现手风琴菜单效果，一起来看看~ 在学习动态面板的时候，看到5分钟玩转Axure之动态面板(进阶)手风琴菜单效果很好，只是写的不够详细，在一番摸索后，貌似到达了同样的效果。所以分享出来，做一个简单的示例说明。步骤如下：一、拖...
用Axure实现左侧动态导航栏
qq_66798676的博客
06-25 776
双击p1，面板状态管理。把state1改名为展开状态。在点击+号按钮，新添两项，取名为展开状态和收起状态。．给动态面板p1设置动作，选择状态那里选择“Next”．双击打开收起状态，在面板中画一个导航栏A一样的矩形。把把导航栏A、A1、A2设为动态面板，取名p1。给导航栏B设置动作，导航栏对应正确的动态面板。首先在面板上画几个矩形，大小一样排列好。首先在面板上画几个矩形，大小一样排列好。把B1、B2设为动态面板，取名p2。
element-plus实现侧边栏手风琴效果
gurenchang的博客
08-10 660
element-plus实现侧边栏手风琴效果
Axure动态面板和轮播图的使用
C0051的博客
12-15 651
是Axure中一个非常强大的高级元件，用于实现多个状态的切换展示，同时也常用于充当Axure中的定时器。可以将其看成一个容器，可以容纳多种不同状态，通过各种交互触发其状态发生变化。
axure rp9如何导入并使用导航侧边栏menu组件
09-26
Axure RP9 是一款强大的原型设计工具，可以帮助我们创建交互式的应用程序和网页原型。要导入并使用导航侧边栏 Menu 组件，我们可以按照以下步骤操作： 1. 首先，在 Axure RP9 中打开你的项目文件或者新建一个项目。 2. 打开 Axure RP9 的库面板，选择 “基本” 选项卡。 3. 在 “基本” 选项卡里，找到侧边栏菜单组件，通常它会被命名为 “Menu” 或者 “侧边栏菜单”。 4. 将侧边栏菜单组件从库面板拖动到你的页面上。 5. 调整侧边栏菜单组件的大小和位置，使其适应你的设计需求。 6. 单击侧边栏菜单组件，你可以看到右侧的交互面板。 7. 在交互面板中，你可以设置菜单的默认状态和交互效果。例如，你可以设置菜单在点击或者鼠标悬停时展开或折叠。 8. 如果你需要添加菜单项，可以在侧边栏菜单组件内部添加文本或者按钮，并调整它们的样式和布局。 9. 可以使用 Axure RP9 的交互功能，为每个菜单项添加链接或者事件，以实现页面之间的跳转或者功能的交互。 10. 最后，你可以预览你的原型，查看导航侧边栏菜单组件的效果。如果需要，可以对组件进行进一步的修改和优化。 如果你需要在其他页面上使用相同的导航侧边栏菜单组件，可以复制并粘贴该组件，并根据需要进行相应的调整。 总结来说，使用 Axure RP9 导入并使用导航侧边栏菜单组件非常简单。通过拖动、调整大小和设置交互效果，以及添加链接和事件，我们可以创建出符合设计需求的交互式导航侧边栏菜单。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值