Axure教程—对称对比图（中继器）

本文将教大家如何用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的文字设置，如图：

整体设置，如图：

制作完毕，希望能帮助到您