Axure实现表格的删除 *** 作

上篇： Axure实现表格的编辑 *** 作 -

上篇，实现了Axure表格的编辑 *** 作，本文将介绍表格的删除 *** 作。

1、单行删除

在“内容列表”中继器中新增“删除”按钮，并增加“删除”按钮的“鼠标点击时”用例：

选择“中继器-删除行”，并设置删除所在行的内容。

2、批量删除

1）在“内容列表”中继器中的“单行内容列表”最左边新增一个矩形和复选框，复选框默认为“未选中”状态

设置复选框的用例：

复选框选中时，标记所在行

复选框选中时，标记复选框所在行

复选框未选中时，取消标记复选框所在行

2）新增“批量删除”按钮

3）设置“批量删除”按钮的“鼠标点击时”用例，删除所有“已标记”的行

删除 *** 作完成。

最近在学Axure，觉得里面最难的就属元件中继器的使用了，下面就和大家分享一下它的使用方法。

打比方用中继器实现自动添加和删除效果，如下图：

步骤如下：

一、打开Axure软件，从元件库拖入中继器，会重新出来一个中继器（主页），在中继器（主页）会自动出现一个矩形，把矩形删掉，从元件库拖入你想要的元件。（2个文字标签）

二、给拖入的元件文字标签（有2个）分别命名（只支持英文），例如s1, t1

三、设置中继器数据，如下图：

四、设置中继器 项目交互，如下图：

双击Case1（选择rich text）

点击进入编辑文字，插入函数，选择 Item.s1

五、设置中继器格式：

六、设置添加功能，在主页页面添加两个文本框和一个添加按钮。

七、给添加按钮设置鼠标点击时事件，双击用例1，出现如下图：

八、点击右下角 Add Row,会出现如下：

九、分别 点击左上第一个fx和第二个fx, 新增局部变量选择文本框单行，插入函数都选择 LVAR1

十、做删除效果。在中继器主页拖入占位符元件。

十一、给占位符元件设置鼠标点击时事件，双击用例1，点击最左侧 Mark Rows, 选择 this

选择左侧 Delete Rows

十二、完成，点击F5即可预览效果。

---