Axure RP 7原型工具通过中继器实现动态表格效果

一、添加控件

1、添加两个文本控件分别为“姓名”、“Email”

2、添加两个文本框控件分别命名为"inputTextName"、“inputEmailText”

3、添加一个按钮控件“提交”

4、添加一个表格空间,只要头,将头下面的单元格删掉

5、添加一个中继器及两个按钮分别为上一页、下一页。

Axure RP 7原型工具通过中继器实现动态表格效果_第1张图片


6、编辑中继器,在中继器中加入表格控件。用于显示动态数据。

Axure RP 7原型工具通过中继器实现动态表格效果_第2张图片


二、编辑动作

1、单元格中删除行的动作

      进入到中继器编辑界面,将“删除”添加鼠标单击动作为删除行。

Axure RP 7原型工具通过中继器实现动态表格效果_第3张图片


2、加入中继器每项加载时的动作

Axure RP 7原型工具通过中继器实现动态表格效果_第4张图片

Axure RP 7原型工具通过中继器实现动态表格效果_第5张图片


3、编辑提交按钮的动作

Axure RP 7原型工具通过中继器实现动态表格效果_第6张图片


场景为添加行、设置当前页、设置每页项数。

Axure RP 7原型工具通过中继器实现动态表格效果_第7张图片

设置当前页、设置每页项数。

Axure RP 7原型工具通过中继器实现动态表格效果_第8张图片


4、编辑上一页、下一页 翻页场景

Axure RP 7原型工具通过中继器实现动态表格效果_第9张图片


Axure RP 7原型工具通过中继器实现动态表格效果_第10张图片


Axure RP 7原型工具通过中继器实现动态表格效果_第11张图片


三、运行效果

Axure RP 7原型工具通过中继器实现动态表格效果_第12张图片

你可能感兴趣的:(WEB开发)