中继器，从物理层面是一个实体工具，可以作为局域网所有节点的中心，放大信号，增强远距离的通信，把不同传输介质的网络连在一起。
而在Axure软件中，中继器英文是“Repeater”，直译为“重复器”，但汉化者并没有使用，而是采用中继器这个更专业的词汇。
这样翻译其实很有道理，中继器也相当于一种媒介，把外界信息收集起来，再实现包括基础数据、操作、操作后的效果。
例如我们常见的增删改功能、排序筛选等，其本质就是对数据的重复操作。增加数据就是重复再显示一次，删除数据就是把重复效果去掉，这样一想，我们就更容易理解中继器到底在做什么了。
本文的思路仍然是从基础理论说起，再讲常用效果的实现思路。
一、原理与属性与样式
既然中继器最本质的特点是repeat，那么我们先搞清楚它是如何重复的？重复的规律是什么？
拖入一个中继器，重点看属性和样式，如下图红圈
属性和样式
1.1 中继器属性
在前文中已经比对过矩形、动态面板、热区的属性，每类元件都有其特有的交互用例
中继器有【每项加载时】【项目调整尺寸时】
● 【每项加载时】
交互事件中有一个默认Case1，意指将某个矩形设置为某个数据。而中继器数据区域，第一列列名为Column0，下方值显示为 1/2/3，和中继器显示的1/2/3对应。添加第二列数据后，按照同样的方式设置第二列显示的数据为数据区Column1。
因此不难得知如下规律
1）中继器属性区有N行数据，中继器就重复N次，每一行数据相当于一个项目
2）每行数据，也即每个项目中包含X个元件，X个元件对应了同一行数据中的多列
如上述示例，三行数据则中继器重复了三次，每1行数据包含两列，每一列和项目中的某个元件对应
● 【项目调整尺寸时】
英文原版为 【OnItemResize】，直译为 【当项目尺寸改变时】，意指当每一项目的尺寸发生变化。那么什么情况才算尺寸发生变化呢？
项目中发生【显示隐藏、移动、旋转、设置尺寸】都可认为尺寸改变，而设置文字或设置图片则不算
1.2 中继器样式
● 样式-布局
分为三种：垂直、水平、网格排布。也就是在中继器重复时，每个项目是纵向重复、水平重复、网格重复
以下三个中继器设置了完全相同的数据和每个项目的基础样式，只是布局方式不同
布局
● 样式-背景
背景色，设置了每个项目的背景色，例如设置为绿色，则每次重复时都会自动加上绿色背景
背景
● 样式-分页
分页，原理和我们常见分页功能相似，例如通常每页10条
多页显示：数据总行数，超过了每页显示的数量，则勾选
每页项目数：设置5，则每一页显示5条数据，从第6条开始会显示到第2页
起始页：设置默认开始的页码，设置2，则中继器默认显示第2页的数据
● 样式-间距
也即每个项目之间的间距
如果项目布局是垂直排列，那么设置行间距，如果项目布局是水平排列，那么设置列间距，如果是网格排列，可以设置行和列间距
间距
1.3 中继器数据
能支持的功能有
可直接Ctrl+V粘贴数据
可导入图片
建议这样设置来提高效率
事先把图片放入到同一个文件夹内
事先把基础数据填写到Excel内
事先把项目中元件的名字，和数据区的列名统一
二、初级示例：某网校页面的课程排列
先找一个网校打开某类课程的页面，发现每一门课程都有相同的属性，如下截图
某网校的网课
一门课程的属性分为7个：图片、课程名称、学校、讲师、集数、类型、简介
观察和分析的步骤如下
1、每门课程的属性都有这些，重复！————应该使用中继器
2、纵向垂直排列————中继器的布局方式应该选 【垂直】
3、每一行课程中间有间隔————中继器的间隔应该设置【行间距】，具体值需要测量
4、课程有图片————中继器每行数据的图片需要【提前设置并导入】
5、每门课程的属性有7个且不同————中继器的项目至少有7个元件，数据区需要7列数据，每列列名需要和元件名称对应
按照上面的分析，我们先做三个课程，也即三行数据，具体设置如下
中继器设置要点
设置上图的最佳步骤是
1、拖入一个中继器
2、在基础属性中画好一门课程的所有属性，并把元件名称写为英文
3、在中继器的数据区，粘贴提前写好的课程内容，并把【列名】修改为【元件名】，均为相同英文名
4、右击图片列的单元格，导入图片
5、Case1中，每项加载时事件设置每个元件的值等于中继器的列名，再设置图片显示为图片列名
根据上面的设置，预览效果如下
预览效果
以上。
中继器原理和基本属性就是文中提到的这些了，但其实它远不止如此，不然怎么会让我用强大这个词来形容它呢，下次再总结它常用的案例。
— — — — 系 列 目 录 — — — —
这不是Axure教程！（四）元件六要素与用例
这不是Axure教程！（五）变量与函数
— — — — 目 录 完 — — — —
网友评论