Axure网页怎么制作标签页? Axure标签页设计方法

时间:2021-05-22

在设计移动或后台难免遇到需要设计类似于如下图分隔内容上有关联但属于不同类别的数据集合,及tag标签页,这里的设计一般是利用动态面板,今天我们就来看看axure制作标签页的教程。

软件名称:
原型设计工具Axure RP Pro 8.1特别版 中文汉化特别版(附汉化包+注册码+安装教程)
软件大小:
90.5MB
更新时间:
2018-05-24立即下载

1、以三个标签为例,拖动三个矩形框作为标签1、标签2、标签3。设置悬停效果字体为浅蓝色,选中效果为字体为浅蓝色,线段为浅蓝色

2、接着拖动一个矩形作为标签1要放置的内容承载,这里举例直接写标签1了。

3、接着将其转换成动态面板

4、双击动态面板,将状态1改为标签1,新增标签2、标签3

5、分别进入标签2、标签3的状态,为其状态设计要显示的东西,这里举例为标签2、标签3如图

6、退出动态面板并将动态面板设置为隐藏

7、设置交互事件,以标签1为例,单击时显示动态面板,状态为标签1,矩形为选中状态,标签2、标签3同理,单击时显示动态面板,状态为对应状态,对应矩形为选中状态

8、点击预览,标签页的选择效果出来了,但是出现了选中时,其他标签没变为不选中状态,所以还需利用选项组功能

9、将标签1、标签2、标签3全部选择,右键选择选项组

10、然后新建选项组,命名后点击确定

11、此时再点击预览,就不会出现选中多个的情况了

以上就是axure制作标签页的教程,希望大家喜欢,请继续关注。

相关推荐:

Axure网页怎么设置横向标签页效果?

axure怎么制作页面标签切换的效果?

Axure怎么制作点击即可删除Tag标签动效?

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章