本文将教大家如何用AXURE中的中继器制作对称对比图
一、效果
预览地址:https://c517td.axshare.com
二、功能
修改中继器的数据,可自动生成对比图
三、制作
1、中继器
拖入一个中继器,并对其赋值,如图:
2、中继器内部
1、制作蓝色条形
点击进入中继器,拖入一个矩形,命名为2,其大小为1×20.颜色设置为#0000FF,如图
2、制作橙色条形
拖入另一矩形,命名为3,其大小为1×20.颜色设置为#FEA213,如图
两个矩形叠放一起(蓝色在下,橙色在上),如图:
3、文本制作
拖入一个矩形命名为1,用来显示中继器中的d0数据,如图:
内部整体设计,如图:
最终设计,如图:
四、交互设置
中继器每项加载时,
1、矩形2和3(两个条形图)的尺寸设置,如图:
2、矩形1、矩形2和3的文字设置,如图:
整体设置,如图:
制作完毕,希望能帮助到您