tab点击一个按钮切换排序_Axure8原型教程：实现Tab选项切换

本文针对于初级产品同学学习Axure原型交互设计，笔者介绍了如何实现Tab选项切换(选项卡、导航栏等)，希望能为大家提供帮助。

Tab的切换实现可以帮助你更好的画原型，尤其针对我这种强迫症患者，很实用。不管是APP还是web端，都能用到，而且需要用到的地方还很多。

思路：

1. 通过动态面板实现内容页面切换，n个tab设置n个状态；

2. 绑定tab按钮的点击事件，设置动态面板的状态切换

步骤：

1. 按照上面的思路，几个tab设置几个状态，先拉出所需要的按钮(选项)+空白矩形(设置为动态面板)；

2. 双击动态面板，根据我们的按钮(选项)设置状态，这里设置了四个tab，所以就设置四种；

3. 当状态设置好之后，点击任意状态进行编辑，界面大小统一；

4. 设置好界面后，绑定按钮与界面关系。

单击“小学”，axure界面右侧-属性-鼠标单击时-显示面板状态-勾选(动态面板)-选择按钮所对应的动态面板状态(意思就是连线)，选择好之后可以设置相关的动画巴拉巴拉啥的。另外三个依次这样弄一下，点击预览，完美。

作者：妖怪口袋，微信公众号“妖怪口袋”

本文由 @妖怪口袋原创发布于人人都是产品经理。未经许可，禁止转载

题图来自Unsplash，基于CC0协议

tab点击一个按钮切换排序_Axure8原型教程：实现Tab选项切换相关推荐

jq实现点击一个按钮，触发另一个点击事件（点击按钮触发另一个按钮的点击事件）
jq实现点击一个按钮,触发另一个点击事件 $("#a").click(function(){$("#b").trigger('click');}) 实现点击完i ...
vue 点击一个按钮触发两个事件_vue事件点击穿透解决大法
最近在做项目的过程中遇到一个非常奇葩的bug,在h5页面点击一个按钮弹出弹窗,但是这个弹窗刚出现就会自动消失,导致屏幕出现闪动现象,关键这个bug还是偶现的.经过一番研究才发现是vue事件点击穿透引起 ...
Creator新手引导 | 限制只能点击一个按钮 | 文字打字机效果
效果实现这个非常简单巧妙源码在文末实现思路节点有点多,一个一个讲解下 bg是游戏背景图,主要是为了和灰黑色的遮罩区别 Btn_parent是三个按钮的父节点,加了一个layout,使每个按钮不 ...
MFC 点击一个按钮去触发DATE TIME PICKER的DTN_DROPDOWN事件
转自:https://zhidao.baidu.com/question/135291549740469005.html 我想点击一个button控件去把date time picker控件的下拉框给 ...
点击一个按钮显示div，点击div之外的地方div隐藏，点击div之内的地方div不隐藏
<input id="btnClick" type="button" value="原生写法" class="btn-gre ...
原生JS实现点击一个按钮显示一个div，再点击按钮div隐藏，或点击除div外其它空白处div隐藏...
<!DOCTYPE html> <html style="font-size: 24px"> <head><title>js点击按钮 ...
java通过按钮打开新窗口_如何在java程序中，当点击一个按钮后，关闭当前窗口，开启一个新的窗口。...
JButton btn=new JButton(new AbstractAction("关闭并打开") { @Override public void actionP ...
java弹框形式输入_java中点击一个按钮弹出两个输入文本框的源代码
展开全部写了一个很简单的案例,可以参考和修改import java.awt.BorderLayout; import java.awt.GridLayout; import java.awt.eve ...
在页面里点击一个按钮后出来一个层,可以操作的那么一个层!
演示:http://www.bl.gov.cn/english/invest_adv.php 这个页面里面你点一下中间那个YOUR QUESTION,出来一个层,可以操作的 <!DOCTYPE ...
jquery 打开服务器文件管理,javascript - 前端js如何封装一个方法或者是jQuery的插件实现点击一个按钮打开本地文件管理系统，进行上传文件...
世界只因有你2017-05-16 13:38:563楼前段时间封装的一个方法,使用ajax和formData方法,实现文件上传,在上传的过程中显示上传进度 js $('#upload').on('c ...

tab点击一个按钮切换排序_Axure8原型教程：实现Tab选项切换

思路：

步骤：

tab点击一个按钮切换排序_Axure8原型教程：实现Tab选项切换相关推荐

最新文章

热门文章