穿梭框是常用的一种选择器，很多新手小伙伴在Axure里不会制作。今天，粤秀教育通过实际操作实践，分享给大家Axure如何用中继器制作高保真穿梭框原型图。零基础小白想要自学Axure做产品原型，那么专业教学就可以事半功倍！选择粤秀教育的Axure自学视频课，就能够在最短的时间获取到最全面的Axure知识~感兴趣就就进~

Axure中继器制作穿梭框效果方法：

一、材料准备

中继器（内含矩形）*2；背景框*2；左箭头*1；右箭头*2；文本*2，如下图所示摆放：

中继器内的矩形需要取消边框，然后设置鼠标移入时填充颜色为灰色，选中时填充颜色为蓝色，这样会有更好的交互感。背景框置于底层，调整合适的大小和位置即可。

左边的为未选项中继器1，在中继器表格内填写对应选项文字；然后复制到右面，为已选项中继器2，由于已选项默认为0，所以需要删除中继器所有行，默认空值即可。

中继器1和2均需取消隔离选项组和隔离单选按钮组效果，两个中继器内的矩形需要设置单选组。文本元件命名为逻辑1和逻辑2，默认为空且隐藏，后续用于逻辑交互。

二、交互设置

中继器1每项载入时：设置中继器1内矩形文字为列表Column0的值，这个交互是中继器默认设置的。

中继器1内矩形鼠标单击时：选中当前元件：因为之前我们设置了选中的颜色变蓝，所以这样做以后，就可以知道选中了那一项，而且因为设置了单选组，所以也不会同时选中多个。

设置逻辑1的文本为列表Column0的值：这里其实就是把选中的值记录下来，方便后面左右箭头穿梭的操作。

中继器2每项加载时及内部矩形鼠标单击时：交互和中继器1一致，不过需要注意的是，中继器2里面设置的文本是逻辑2的文本。

右箭头鼠标单击时：这里需要判断逻辑1的文字是否为空，如果为空就是还没选中，就不发生交互，如果不为空，就需要做一个增加行和删除行的交互。

增加行：在中继器2里增加行，增加的值为逻辑1文本值；

删除行：删除中继器1里的和逻辑1文本值相同的行。

完成上述两个交互之后，我们还需要清空逻辑1的文本，因为如果不清空，我们点右箭头就可以无限增加同一个选项，所以这里需要清空逻辑1的文本值。

左箭头鼠标单击时：左箭头和右箭头的交互其实是一个道理的，首先需要判断逻辑2的文本是否为空，如果为空就是还没选中，就不发生交互，如果不为空，就需要做一个增加行和删除行的交互，不过这里和中继器1的交互是反过来的。

增加行：在中继器1里增加行，增加的值为逻辑2文本值；

删除行：删除中继器2里的和逻辑2文本值相同的行。

设置逻辑2的文本值为空值，那这样一个实用的穿梭框原型就制作完成了。完成之后，以后我们需要使用的话，只需要填写在左边中继器1的表格里填写选项文字即可，方便使用，小提示，如果选项多的话可以在excel表格复制粘贴到中继器表格里哦

最终效果：

以上就是关于“Axure中继器怎么制作穿梭框效果？”的全部内容分享了，希望能够帮助到你~更多Axure技巧学习，尽在粤秀教育！Axure相关文章、Axure相关问答、Axure专业自学视频课都是你学习提升的好帮手~想要快速有效的学习掌握Axure，那么Axure视频课就真的千万不要错过了！专业讲师、全面知识点、从0到1逐渐掌握~下面为各位小伙伴推荐几套Axure相对热门的基础课：