前面文章有说到过中继器,今天我们继续说一说中继器的基础操作,如果还不知道中继器是啥的,请看Axure系列教程(十):中继器的介绍,跟数据库有关联一般都会涉及到增删改查,那我们今天也来看一看中继器当中的增删改查。
这个就是效果图,数据,中继器的搭建。自己扒拉扒拉就可以了,这里就不再阐述了
一、增加操作
1.扒拉一个按钮过来作为新增按钮,采用的是提交按钮元件(ps:利用矩形,按钮形状元件都可以实现按钮的效果,依个人喜好)。
2.扒拉一个动态面板过来,作为新增弹出框,设置动态面板宽为1200,高为1000,动态面板名称为员工信息,双击动态面板将动态面板状态改为新增修改弹出框。进入动态面板当中,将一些需要使用到的元件扒拉过来

因为动态面板是没有颜色滴,所以扒拉一个矩形过来设置宽为1200,高为1000,填充颜色为#CCCCCC。再扒拉一个矩形设置宽340高为330,填充颜色为#0099FF。部门采用下拉列表框,保存、关闭用提交按钮元件,剩下的都是文本标签和文本框元件。(ps:涉及到用户体验度所以保存的宽比关闭的宽要长一些)
设置两个关闭元件的鼠标单击时用例

2.设置保存元件的鼠标单击时用例

使用添加行操作可以新增一行数据,利用变量将数据新增到中继器
二、删除操作
1.进入中继器中,设置删除鼠标点击时用例。可以参考http://www.jianshu.com/p/881a1e75f9e9


全选与取消全选
1.中继器中的全选命名为行内复选框,页面的复选框为全选复选框。通过判断全选复选框是否被选中,设置行内复选框是否被选中。


三、修改操作

1.进入中继器中,设置修改鼠标点击时用例

2.设置点击修改之后的保存按钮的用例更新,更新行操作

更新行的操作与添加行的操作是大同小异的,这里不再阐述
点击修改之后保存会发现。是新增一条修改后的数据而不是在原有的情况下进行修改的。这是因为我们没有把修改和保存进行区分。这里我们通过全局变量来进行区分,如果flag(新增全局变量)=0为保存数据,否则flag=1为修改数据,进入到新增修改弹出框中,对保存按钮进行设置。修改之后的鼠标单击时用例应该是:

四、查询操作
1.按姓名与部门查询滴,所以有四种情况
1).姓名不等于空,部门不等于请选择

检索时,根据我们给的条件进行搜索,条件如下:

2).姓名等于空,部门不等于请选择

因为我们只按一个条件进行检索,如果不移除另外一个条件,那么会干扰搜索进行,在进行搜索之前一定要将另外一个条件从中继器中移除,移除根据我们给的搜索名称进行移除就好了,不需要移除全部
3).姓名不等于空,部门等于请选择

4).姓名等于空,部门等于请选择

姓名等于空,部门等于请选择代表的是没有进行搜索,所以进行移除全部筛选就好了。
到这里中继器的增删改查都说完了,附带再说几个中继器的属性
设置首页

设置上一页

设置下一页

设置尾页

中继器样式设置

需要rp下载链接的请戳 https://pan.baidu.com/s/1dEFYanJ 密码: giwf
网友评论