在Axure中中继器是一个神奇的东西。最近在处理列表的时候使用到了中继器的增、删、查。现在对于这个模块做一个简单的教程。算是之前想做Axure系列的学习笔记的开始吧。
前期准备
-
- 电脑：mac和win都可以（案例以win系统为例，mac类似）
- 软件：Axure 8.0（如需软件可以文章后面留言）
- 熟练程度：初级（会使用简单的元件即可）
- 相关使用元件：矩形、按钮、中继器、文本框，多行文本框、下拉列表框。
效果展示
效果展示：https://ksyyq0.axshare.com
正文（制作过程）
-
-
搭建初始静态界面
-
在静态界面的搭建中会使用到前期准备中所提及的元件以及相关属性。这些都是比较基本的操作，就部一一解释了。搭建后的界面如下图，所用元件也做了详细命名处理，大家可以看命名后缀进行一些元件的区分。
-
-
中继器关联相关初始数据
-
中继器的相关初始数据都可以在Axure中前期录入部分数据。录入数据后需要将数据与之前中继器中的文本进行绑定。（如果有些数据为相关同的数据，就可以不用关联，直接复用，具体可以自行查看中继器基础知识）。
-
-
信息删除
-
这一步主要操作为信息的删除，主要以删除行为例。
-
-
信息增加
-
本步主要主要操作为信息的增加。
思路：初始加载隐藏弹框，在点击上部新增的时候进行弹框显示，输入相关信息，然后点击新增，信息添加入表格，弹框隐藏。
1.给弹框的【新增】按钮添加鼠标点击事件
2.为行中的数据绑定输入源
优化数据添加逻辑—姓名不能为空
思路：在新增按钮点击新增时判断姓名文本框中是否有字符的输入，如果没有就在姓名输入栏下显示【姓名不能为空】提示，如果有字符输入就直接添加成功，弹框隐藏。
最后为【新增】【取消】添加隐藏时间（注意，新增的隐藏事件要添加到输入不为空的情况下）
这些内部逻辑处理完成后，只需绑定弹框到顶部新增就行。
弹框隐藏，点击新增显示。
-
-
信息筛选
-
思路：让下拉菜单中选中项作为条件，来协助筛选按钮的事件处理
-
- 性别-女
条件添加
筛选添加 - 性别-男
条件添加
- 性别-女
-
- 全选（取消筛选）
利用中继器的取消筛选。
取消筛选
- 全选（取消筛选）
总结
1：命名：可以让自己更方便的区分组件，找到组件。
2.逻辑先后：在做原型之前，一定要想清楚逻辑，什么在前什么在后（包括判断条件）。
本文来自简书，本文观点不代表 PmTemple 立场，转载请联系原作者。原文链接：https://www.jianshu.com/p/d2103a0e29b2
微信扫一扫 
支付宝扫一扫 
评论列表（6条）
这个教程太实用了！作为经常制作旅行攻略的摄影师，用Axure制作行程规划APP原型时，正好需要这种中继器的增删查功能。📸 特别是筛选功能，可以根据目的地类型、季节等条件筛选照片和路线，太适合我们的旅行计划管理了！感谢分享！
这个教程太实用了！中继器的新增删除功能就像管理我们新品上架和下架一样流畅，特别是弹框新增的设计思路，简直就像给产品添加新系列时的用户体验流程，点赞！
哇！中继器的新增删除功能简直太棒了！作为游戏策划，这让我想起了角色列表管理功能，不用手动一个个添加元素太方便了！教程步骤清晰，收藏了！ (｡･ω･｡)ﾉ♡
这中继器操作也太丝滑了吧！作为全栈，感觉Axure前端原型写好了，后端接口就得按这来😂教程很实用，不过数据绑定那步能不能加点动态效果？原型做得太静态了没灵魂。
哇！这个中继器教程简直太棒了！作为游戏策划，看到这种动态数据交互功能简直就像发现了新大陆~(>^▽^<) 不用在游戏里手动添加100个NPC数据了！新增、删除功能简直是为游戏背包系统量身定做的！感谢分享！
中继器操作就像健身训练计划调整，灵活高效！新增删除数据如同增肌减脂，精准控制。这种系统化思维值得学习，就像我们制定科学的训练方案。