码迷,mamicode.com
首页 > 其他好文 > 详细

干货分享:使用Axure的动态面板做Tab

时间:2015-05-18 21:05:30      阅读:126      评论:0      收藏:0      [点我收藏+]

标签:产品经理   axure   


  相信学习产品经理的童鞋都知道,Axure是一个产品经理必备的专业快速原型设计工具,那么在Axure的使用中,怎么用动态面板做Tab呢?下面小编就为大家整理了一二,希望对你有帮助。

 

首先,我们先来看看Axure的动态面板可以用来做什么:

  1)tab式页签的切换效果:Axure的官方给出的实例就是这个

  2)鼠标触发式和点击触发式的下拉菜单效果:这个可以结合Axure的默认组件中的“垂直菜单”、“水平菜单”来实现,常用于导航的原型制作。

  3)鼠标触发式的浮窗效果:类似“Alt”的效果,常用于浏览提示和触发式广告。

  4)JS的鼠标点击弹层效果:这个是目前使用被广泛使用的效果之一。

  5)注册表单中的根据焦点判断提示的效果:当焦点在输入框内的时候提示该表单栏目填写规范,当焦点离开输入框的时候根据填写的结果提示正确或者错误原因,这个需要动用高级设计交互编辑功能结合Axure的逻辑条件和设置变量功能来实现。

 

在用Axure的动态面板做Tab,主要需要通过以下几个步骤实现:

  1、拖动一个动态面板组件到页面编辑区域


技术分享

 

  2、给动态面板添加2个状态:

  1)单击右键》编辑动态面板》管理面板状态

  2)点击加号按钮,可以不断的添加状态

  3)点击第二个红色的框,可以编辑该动态面板的所有状态

 

技术分享

 

  3、在状态1页面拖动两个矩形组件

 

技术分享

 

  4、设置点击切换

  1)选中状态1组件,弹出用例编辑器,

  2)选中【设置动态面板状态】

  3)选中对应状态(状态1)


技术分享

 

  5、复制该动态面板的矩形组件到状态2,完成tab的制作。

 


 

       推荐学习:产品经理实战教程

干货分享:使用Axure的动态面板做Tab

标签:产品经理   axure   

原文地址:http://10253010.blog.51cto.com/10243010/1652405

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!