Axure RP是一个专业的快速原型设计工具。它能快速、高效的让负责定义需求、设计功能和界面的产品人员创建网站的原型、流程图和说明文档。
本文将将分步骤交大家如何使用Axure RP 8.0创建基础的TAB标签页效果。
最终效果如图(点击TAB页,切换对应TAB内容):
1、 创建一个动态面板(尺寸600px*400px);
2、双击动态面板 – 打开面板状态管理,给面板命名为TAB页卡,并定义三种面板状态,TAB1、TAB2、TAB3;
3、点击确认,右侧概要区就生成了3个TAB页卡;
4、双击概要区页卡动态面板里的TAB1,来编辑TAB1的内容;
5、TAB1编辑区拖入一个矩形(尺寸480px*250px)作为主体内容,再拖入三个矩形(尺寸150*150),作为TAB的表头,命名为TAB1、TAB2、TAB3;
6、选择矩形TAB1,然后选择顶部菜单置于顶层;
7、点击矩形右上角小圆点,选择底部无框矩形;
8、选中TAB2和TAB3,填充底色;
9、添加交互动作,选中TAB1,在右上角, 双击 “鼠标单击时”弹出窗口,
在添加动作列选择设置动态面板,在配置动作列选择勾选动态面板,选择状态为TAB1,点击确认即完成TAB1链接切换;
10、参考9步骤,设置TAB2指向TAB2,设置TAB3指向TAB3;
11、双击右侧概要区动态面板里的TAB2和TAB3,复制黏贴TAB1的内容;按如上步骤调整TAB2和TAB3的样式;
此时,发布预览就可以实现点击TAB1就切换到TAB1的内容,点击TAB2就切换到TAB2的内容的效果。
声明:原创文章,谢绝复制黏贴他处。