Axure教程：用中继器实现学生成绩表增删改及组合筛选

本篇文章介绍了如何用中继器实现学生成绩表增删改及组合筛选。

先来一张成品效果图，整体上有表单区和选项卡两部分组成，选项卡设置有隐藏。

实现效果：

可以通过新增按钮打开选项卡，编辑信息后再次点击新增即完成新增信息；点击编辑按钮即可打开选项卡，同时编辑按钮变为保存，对该行进行编辑后点击保存即可保存修订后信息；点击删除即可删除该行信息；选择性别即可对中继器信息按照性别进行筛选；在区间值文本框中输入数值即可对中继器信息按照成绩进行筛选；点击全部即可移除筛选显示全部信息。

实现思路：

首先添加中继器和表头，并完善信息；

添加选项卡相关组件；

添加新增按钮并设置交互条件；

为中继器中编辑和删除按钮设置交互条件；

添加两个筛选条件并设置交互条件；

添加全部按钮并设置动作来取消筛选。

以上就是整体大概的设计思路，中间细节部分见下文。

注：大部分关键组件都进行了合适命名，命名的好处就是减少交互动作设置时张冠李戴！

一、添加表头和中继器内容

1. 添加五个矩形组件，设置适当大小，并将矩形内容设置为：序号、姓名、性别、成绩和备注，此即为中继器表格的表头部分，如下图：

2. 添加一个中继器，双击中继器进入中继器编辑页，添加五个矩形，设置宽度和上面表头部分一致（可直接复制表头，去除矩形文字即可），将五个矩形分别命名为：序号、姓名、性别、成绩和备注，添加两个按钮编辑和删除，分别命名为：编辑/保存和删除，特别提醒：此处编辑按钮可通过改变文字充当保存按钮，通过设置条件减少了保存按钮的设置。

3. 在右边检视窗口的属性标签中为中继器添加五列，分别命名为：xuhao、xingming、xingbie、chengji和beizhu（图简省用对应拼音命名，亦可自由命名，能对应即可），顺便为中继器添加几条假数据，如下图：

4. 为中继器数据与组件进行关联，在右边检视窗口属性标签的交互中，为中继器每项加载时设置动作，即将中继器中的五个组件设置文本为中继器表的对应列名，例：[[Item.xuhao]]，如下图：

二、添加选项卡相关组件

该选项卡是用来新增信息和编辑信息的，该部分由矩形、文本标签、下拉框和文本框组成，先添加一个矩形作为底框，调整大小，然后分别添加下图标识组件并调整大小和设置文字；为方便后续动作设置，此处只需将三个文本框和一个下拉框命名为：姓名、性别、成绩和备注即可。

2. 双击下拉框对内容进行添加，此处设置两个值：男和女。

3. 全选该步骤添加的全部组件进行组合，就是将选项卡相关组件组合为一个，组合后设置该组合名称为选项卡，然后设置选项卡组合为隐藏。

三、添加新增按钮并设置交互

1. 添加一个按钮设置文字为新增，添加鼠标单击时动作1，点击编辑条件，为选项卡组合设置原件可见值为false；然后添加动作显示选项卡组合，因为初始设置选项卡为隐藏，此处需新增信息时首先设置其可见然后编辑信息；见下图：

2. 为新增按钮添加鼠标点击时动作2，点击编辑条件，为选项卡组合设置原件可见值为true，如下图：

3. 当选项卡可见时单击按钮就是将已编辑信息写进中继器中，首先为为中继器添加动作：添加行。

各列内容分别为：

xuhao列值为[[LVAR1.itemCount+1]]，意思是序号根据中继器已有的行数自行增加1；