Axure怎么制作折叠菜单?

作者&投稿:禾彬 (若有异议请与网页底部的电邮联系)
~

在很多的网站、APP、平台里面,大家应该都见到过折叠菜单!对于折叠菜单,可以很好的将信息隐藏以及展现!那么,我们使用Axure软件怎么制作出来折叠菜单效果呢?下面就为大家详细分享制作步骤!自学Axure,入门很简单,交互却头疼!因此,专业提供多套Axure自学视频课,软件基础功能操作+基础案例教程,可以全面学习掌握Axure原型设计、交互原理~

Axur制作折叠菜单教程:

一、准备元件

打开Axure新建文件,拉出一个矩形,w为200px,h为40px,色值为#333333,在矩形内输入“一级菜单”,然后命名为“一级菜单”;

拖进一个矩形,同样w为200px,h为40px,色值改为#FFFFFF(纯白色),在矩形内输入“选项一”;

把“选项一”在复制两个出来,分别叫“选项二”、“选项三”。

完成了以上动作,就可以得到一下的展示,看图:

好了,完成之后我们就来开始做第二步~

二、设置交互样式

(1)全选“选项一、二、三”,右键点击交互样式设置,选择鼠标悬停_填充颜色_色值为#F2F2F2、然后再选选中_填充颜色_色值#E4E4E4。

如图:

(2)继续选中“选项一、二、三”,右键点击设置选项组名称,命名为“选项”、选择“选项一”右键点击选中(默认选中),完成。

完成了以上的设置,继续下一步~

三、设置交互用例

(1)选择“选项一”,设置鼠标点击时_选中_选择This为ture,点击确定。(选项二、三同上设置,复制粘贴过去即可)。

完成以上设置,我们的选项就可以点击切换了,看效果:

(2)把“选项一、二、三”选中,右键点击转换为动态面板,命名为“选项”,点击把该面板隐藏。

(3)设置“一级菜单”,设置鼠标单击时_设置面板状态_可见性:切换、动画:显示时向下/隐藏时向上,动画为:线性,250毫秒、勾上置于顶层、勾上推动元件,方向为下方,动画为:线性,250毫秒。

这样就完成了,为了防止大家设置错误,下面放一张设置的图:

再附一张效果图:

完成以上的制作,我们会看到了这只是单个菜单而已,我们可以给它复制多个折叠菜单在一起。

四、进阶

(1)全选所有元件、动态面板_右键点击组合,然后我们给它复制粘贴n个,按照以下方式排列:

(2)因前面用户设置的时候,我们已经把“推动元件”设置好了,所以后面无需再设置。但前面所做的,我们把“选项一”设置为默认选中状态,这里我们又复制了两个,所以我们需要把多复制出来的两个“选项一”去掉默认选中状态。

设置完,继续看效果:

以上就是关于“Axure怎么制作折叠菜单?”的全部内容分享了,感谢大家的阅读,希望大家从中有所收获!想要获取更多Axure操作技巧,可阅读更多Axure文章哦!当然,如果你想要更加清晰专业的学习到Axure技巧知识点,那么建议大家Axure视频课程学习哦!省时省力快速全面学会Axure原型交互设计~




Axure基础详解一:下拉菜单
Axure的基本下拉菜单样式可能不尽如人意,为了提升美观度和灵活性,自制下拉菜单是更好的选择。下面介绍两种制作方法。方法一:利用显示隐藏原理。当用户点击选择框,下拉选项会弹出,选中某项时则隐藏。关键在于将选择框的文本设置成选项的文字,交互上设置动态面板在点击时切换状态。方法二:动态面板切换更...

Axure 8中如何设计三级折叠菜单
1、可以使用axure自带的树 2、自己使用显示与隐藏功能做(只建议做两级,三级有点麻烦且维护困难)

利用AxhubCharts元件库在Axure RP中快速创建可视化统计图
在Axure RP中,通过AxhubCharts元件库能轻松构建各种统计图表,如折线图、柱状图、饼图等,极大地提升了设计效率。以下是操作步骤详解:首先,你需要从以下链接下载AxhubCharts.rplib元件库:[链接](pan.baidu.com\/s\/1GMq6KL...,提取码:obg3)。下载后,将其导入Axure RP的【库】,选择【载入元件库...

axure如何折叠展开怎么再原有页面显示
用动态面板隐藏,再显示,加动画效果即可

axure预览页面快捷键(axure快捷键大全)
单纯的折线图非常的难看,很难分清折点在哪,所以我们需要添加圆形节点。选择圆形,拖入折点位置,调整好大小 5、依次复制圆形,将所有的节点都添加上。注意,如果有点前选中的节点,一定要突出显示,这样效果会更好 8. axure快速入门 什么是Axure Axure RP是美国Axure Software Solution公司旗舰产品,是...

Axure9.0怎么制作二级菜单?怎么使用?
二级菜单效果制作完成,查看效果。二级菜单的效果制作完成了,最终效果:以上就是关于“Axure9.0怎么制作二级菜单?怎么使用?”的全部精彩内容分享了,希望你能从中有所收获哦!如果觉得一篇文章不够尽兴,那么Axure相关文章可别错过!总而言之,学习道路,单一知识是很难成就自我全面发展的!想要全面精通擅长...

Axure rp7.0的折叠和展开效果如何实现
树的折叠和展开是封装好的,不用设置就可以实现的。

【Axure视频教程】曲线图
学习制作可视化曲线图的原型模板,使用Axure进行操作。当你鼠标移入曲线图时,会弹出显示折点具体数据的窗口。此模板由Axure原生元件构成,操作便捷,可以自由调整样式和交互效果。观看下方视频,从零开始,一步步教学,无论你是新手还是有基础的用户,都能轻松掌握。

AxureRP8怎么设置树状菜单
Axure RP 8怎么设置树状菜单?Axure中制作菜单的时候,想要制作一个树状菜单,该怎么制作呢?下面我们就来看看详细的教程,需要的朋友可以参考下 Axure RP 8中可以制作不同类型的菜单,想要制作树状菜单,该怎么制作呢?下面我们就来看看详细的教程。1、打开Axure RP 8软件,在元件库中找到“树状菜单”,...

Axure怎么使用动态面板制作APP隐藏菜单?
以上就是关于“Axure怎么使用动态面板制作APP隐藏菜单?”的内容分享了,希望能够帮到你!更多Axure精彩分享,尽在Axure相关文章!Axure因其能够快速、高效的创建原型,备受众多产品设计人员所使用!对于想要快速学会Axure原型设计的小伙伴,就可以选择精选的Axure自学视频课!不要犹豫,选择合适的课程开始学习...

柳州市17325645685: axure7.0怎么制作折叠和展开的菜单效果 -
利贵少林: 首先说一点,axure是做原型的工具,这个只需要开发人员看得懂即可,不要做的花里胡哨跟真的一样,没那意义.至于实现方法,因为你说的不是很具体,所以简单提供一个思路:1. 一个菜单中的每一项,都用一个部件或者动态面板2. 点击触发事件时,每一个部件一个隐藏上移的效果,下一项可以先等待0.3秒或者多少时间,这样折叠时会有一个时间差,造成视觉效果3. 展开时,反向

柳州市17325645685: 如何使用Axure RP制作折叠菜单效果 -
利贵少林: Banner图切换效果还可以成为轮播图效果. axure中完成Banner图切换效果可以使用动态面板的状态切换来实现. 提供一个axure夜话案例

柳州市17325645685: Axure 7.0如何实现 下拉菜单可以折叠展开但不影响菜单外的其他部件保持固定不动? -
利贵少林: 用动态面板进行切换即可

柳州市17325645685: Axure抽屉效果菜单效果该怎么制作 -
利贵少林: Axure抽屉效果菜单效果该怎么制作?做网页端菜单的抽屉效果很常见,若做原型的时候能快速简单的做出来,可以节省你的宝贵时间,也更能展示你的作品. 1、先建四个动态面板,同时选中这四个面板,在选择组里命名“菜单”;并勾选调...

柳州市17325645685: 如何用axure做出Tab页签和滑动菜单 -
利贵少林: 制作方法:(其实非常简单,换个方式思考.不要用写程序的方式思考原型的制作)1. 先制作一个“导航”的Master,在Master里给各个页做好链接.(不区分Tab效果)2. 在需要突出Tab效果的页面里,单独做一个效果盖在导航的对应位置上.不同的页之间通过复制,简单改一下文字就可完成. 如果您对我的回答有不满意的地方,还请您继续追问;答题不易,互相理解,互相帮助!

柳州市17325645685: 关于axure设计网页web页面的问题,我设计了一个网页,如下图,怎么把图一设计成图二. -
利贵少林: 两张图区别很大的,不知道具体是哪里做不出效果?左边的折叠菜单,点击“活动”添加下一项以创建"校友管理"项目,或者在软件里上方有个向左的绿色箭头,能让菜单向上一级.页面多了以后滚动条就有了.软件里背景色不好修改的,生成的html文件,你可以在源文件里修改左边栏的背景色.右边的内容,两张图内容不一样,应该没指这个吧

柳州市17325645685: axure rp 5.6 在动态面板中,怎么制作下拉菜单? -
利贵少林: AXURE里提供了下拉菜单的控件,你可以直接使用,如果不喜欢使用那个或者觉得样式不好.可以通过动态面板来实现. 实现的方法,就是将下拉菜单的内容,做到动态面板里,通过主菜单的onclick事件上,添加隐藏和显示动态面板的事件来实现. 中间有一个值得注意的事.因为控制下拉菜单的菜单是同一个,所以onclick的时候需要判断当前菜单处于显示还是隐藏状态.简单的方法是设置一个变量,变量为1就显示,为0就隐藏,先判断下这个,再根据判断结果去显示/隐藏动态面板就可以了.

柳州市17325645685: 如何利用Axure RP 8软件设计水平菜单 -
利贵少林: 找到组件“Classic Menu-Horizontal”,拖到页面中,然后编辑子菜单就ok了.新增子菜单后,可以选中子菜单后,再设计用例.

柳州市17325645685: Axure怎么做菜单栏??? -
利贵少林: 你可以用表格制作,把边框颜色设置和底色一样;也可以通过矩形拼接而成.

柳州市17325645685: 怎么在axure怎么做下拉菜单 -
利贵少林: 把更多选项的内容设置成动态面板,设为隐藏.当鼠标移入某“模块”(应该是个右下矩形)时,显示该动态面板,移出时隐藏.

本站内容来自于网友发表,不代表本站立场,仅表示其个人看法,不对其真实性、正确性、有效性作任何的担保
相关事宜请发邮件给我们
© 星空见康网