在交互设计中,经常会用到销售单、采购单等这样的表单,本经验讲解如何使用Axure的中继器实现表行的添加、删除、修改以及自动计算行号的功能。
工具/原料
Axure 8
方法/步骤
1
建立如下图的表格并复制三份
2
第一个表格删除两个空行,第二个与第三个表格只保留一个空行,并将第三个空行的“操作”列输入“+”号且调整字体到合适大小,一般为20磅,第三个空行进行组合并命名为“添加行”,如下图:
3
在页面中拖入一个“中继器”命名为“表格中继器”并将第二个表格剪切到中继器中(删除中继器原有矩行)
4
设置中继器列并删除原有数据(保留一个空白行)
5
在序号列添加一个标签,项目一~项目三添各加一个文本框。操作列添加文字“删除”并调整字体
6
设置删除的鼠标单击时交互为 如图:
7
添加全局变量“XH”
8
设置序号的标签的载入时交互为 如图:
9
设置中继器“每项加载时”交互为如下图
10
设置项目一~项目三文本框的交互为 如图:
11
设置添加行组合的鼠标单击时交互为 如图:
12
最后预览效果:
下一篇:Safari浏览器实用小技巧