1.4_21 Axure RP 9 for mac 高保真原型图 - 案例20【中继器 - 入门1】中继器原理Repeater Table

相关链接

• 目录
• Axure中文学习网
• AxureShop
• AxureShop-QA

---

案例目标

 1. 了解 中继器 是什么
 2. 了解 中继器 的使用场景
 3. 会使用 中继器 展示数据
 4. 掌握 Item.* 变量的使用（遍历中继器中的数据）

---

一、中继器

1.1 简介

  中继器 （Repeater Table）属于Axure中比较复杂的一个元件，一些有几年工作经验的PM甚至都不会使用，但也不影响工作。侧面反映出这个元件其实不会也没关系，但会使用的话可以大大提高一些场景下的工作效率。同时更还原的原型的制作效果，可以减少文字性描述，降低原型设计和开发结果间的差异性。

  仅看中文来说，中继器 并不知道是个什么玩意。尝试查看百度，是这么描述的：

中继器（RP repeater）是 连接网络线路的一种装置，常用于两个网络节点之间物理信号的双向转发工作。

  个人认为在Axure中，Repeater Table 翻译成中继器不能说是错误，只能说是毫不相关。

  从字面意思来看：Repeater Table = 重复的表格。

  从使用功能来看：Repeater Table = 数据库 或 容器。

数据库 ：可以理解为高级版excel或wps，就是对行、列数据进行一些增、删、改、查、排序、筛选等操作。
 

  点击Learn more可以查看官方文档

1.2 使用场景

中继器（Repeater Table）适用于：

 1.数据处理的场景：增、删、改、查、标记、排序、筛选。例如，商品后台管理系统。

 2.复杂并且相似的布局。例如，聊天工具的信息列表。

1.3 中继器相关函数

TargetItem：目标行，一般后面+列名，例如TargetItem .xxx，一般是在更新行交互或者条件里用的比较多。

Item
交互中：处理单个数据行，通常是Item Loaded事件下的操作。

Item.ColumnName：获取某一列，例如：item.name，用于获取中继器指定列的值。一般做的交互是在中继器每项加载时设置文本或图片的，在更新行、筛选的时候也会用到作为条件。
 
Item.index：中继器会自动编号，按12345……的顺序编号，注：这里的编号是是演示时显示内容是否行数，不是在原来中继器表格里的行数，增删改查筛选后也会自动重新编号。
 
Item.isFirst：判断是否为中继器中的第一行，如果是就返回true，否则就返回false。经常用于条件判断。注：他判断的是演示时显示内容是否为第一行，和index一样，不是原来的中继器数据表中的第一行。
 
Item.isLast：判断是否为中继器中的最后一行，如果是就返回true，否则就返回false。经常用于条件判断。注：他判断的是演示时显示内容是否为最后一行，和index一样，不是原来的中继器数据表中的最后一行。
 
Item.isEven：判断是否为中继器中的偶数行，如果是就返回true，否则就返回false。经常用于条件判断。注：他判断的是演示时显示内容是否为偶数行，和index一样，不是原来的中继器数据表中的偶数行。
 
Item.isVisible：判断是否为中继器中的可见行，如果是就返回true，否则就返回false。暂时未能发现有什么实际案例。因为你能看见的就是可见行，所以结果全部都是TRUE，看不见的你也点不了他。只能作为条件使用。
 
Item.isMarked：判断是否为中继器中的被标记行，如果是就返回true，否则就返回false。
 
Item.isOdd：判断是否为中继器中的奇数行，如果是就返回true，否则就返回false。经常用于条件判断。注：他判断的是演示时显示内容是否为奇数行，和index一样，不是原来的中继器数据表中的奇数行。

Repeater
交互中：处理多个数据行（数据集的统计信息），使用Item.Repeater访问对象。
例如：[[Item.Repeater.visibleItemCount]]
或：[[This.dataCount]] （处理自己的事件时，可用This）
或：[[LVAR1.dataCount]]（处理外部事件时，可将下列属性添加到局部变量中）

Repeater.visibleItemCount：统计中继器中可见项数。
 
Repeater.ItemCount：统计中继器中总行数，注：如果进行了筛选，项目列表的总数量则是筛选后的数量。
 
Repeater.dataCount：统计中继器中数据行的总数量。
 
Repeater.pageCount：统计中继器中的总页数。
 
Repeater.pageIndex：获取中继器的页面，即当前是在中继器的第几页。

---

一、成品效果

Axure Cloud 案例20【中继器 - 入门1】中继器原理

版本介绍

 一、表格
  1.1 使用中继器初始化数据
  1.2 使用函数 Item.列名 遍历并展示数据
  1.3 使用函数 Item.Index 函数展示序号
  1.4 使用中继器的背景-交替颜色功能

---

二、素材准备

  使用Axure自带元件：中继器、矩形。

---

三、制作方法

Step1. 放置一个中继器，双击进入中继器，贴合放置三个大小相等的矩形（背景色透明、边框线宽1）。最后初始化三行数据。

稍后需要区分各个元件，所以需要注意元件的命名规范

 

Step2. 使用中继器函数，遍历展示数据

name：[[item.name]]
id：[[item.id]]
序号(index)：[[item.index]]
 

 
其中： 交互 -> 使用函数 [[item.id]] 、[[item.name]] 中涉及的 id、name与
    样式 -> 数据中设置的 列名 一致

 
注意： [[item.index]]是Axure中继器的默认函数列，按12345…的顺序自动变化。
   ↓↓↓如果设置列名时叫做index，会默认取12345…的序列号，而不是自定义的数据表中的数据。↓↓↓

Step3. 加工 中继器函数，进行拼接。
（为了新增数据时，满足id自增的同时，并符合u_xxxx格式，需要使用拼接功能）

id：u_[[item.id+10000]]

 

Step4. 添加表头（在中继器外部）

---

四、添加数据技巧

  Axure支持从wps、excel直接批量粘贴数据，见下图：

---

22/10/08

M