首页 > 代码库 > AxureRP7.0基础教程系列 部件详解 中继器部件Repeater

AxureRP7.0基础教程系列 部件详解 中继器部件Repeater

原型库网站—讲师金乌原创发布,可自由转载,请注明出处!

Axure中文官网:www.AxureRP.cn

 

《AxureRP7.0部件详解》

中继器概述 REPEATER OVERVIEW



中继器部件是一款高级部件,用来显示重复的文本、图片和链接. 通常使用中继器来显示商品列表、联系人信息列表、数据表或其他.



中继器的构成 2 PARTS OFREPEATER

中继器数据集 Repeater Dataset

中继器部件是由中继器数据集中的数据项填充的.这些填充的数据项可以是文本、图片或页面链接.
双击中继器,进入中继器数据集,在页面底部面板的最左侧标签可以看到.

 





中继器的项Repeater Item

被中继器部件所重复的布局叫做项(项目).双击中继器部件进入中继器项进行编辑.
在右侧图片显示的编辑视图中所展示的部件,会被重复多次(数据集中有几行就重复几次).

 

填充数据到设计区域

使用每项加载时事件填充数据到设计区域 POPULATING DATA INTO THE DESIGN AREAWITH ONitemload

每项加载时事件

 

  • 插入文本Inserting     Text

双击每项加载时OnItemLoad 事件并使用设置文本动作插入文本到你的中继器.
在 用例编辑器中选择设置文本Set text动作然后在用例编辑器右侧选择你想要插入的文本部件,在右下角点击设置文本值Set text to value 打开 编辑文本Edit text 然后点击 Insert Variable or Function 选择变量 [[Item.ColumnName]]并点击OK.

当你的中继器项加载时,就会将数据集中列(column)的内容插入到你刚刚设置的文本部件中了.
 

中继器中插入图片

  • 插入图片Inserting     Text

导入图片到数据集中并使用 设置图像Set Image 动作 将图片插入到中继器项中.

在 中继器数据集中右键点击要插入图片的项,点击导入图片Import Image并添加图片.然后双击 每项加载时 Onitemload 事件,添加 设置图像 Set image 动作. 选择要将图片插入到哪个部件,然后在默认下拉选项中选择值 Value并在右侧点击fx选择[[item.ColumnName]] ,点击OK.

在中继器包含的部件中使用交互

USING REPEATER DATA IN INTERACTIONS ON CONTAINED WIDGETS

中继器的数据可以添加交互,比如添加基于条件判断的页面链接.

中继器数据交互

 

  •   插入页面链接(参照页)Inserting Page Links

中继器数据集的项中可以添加参照页(页面链接),当用户点击时就跳转到相关页面.

右键点击一个空白项并选择 参照页Reference Page,然后选择页面.

在 终极其中选择一个你想要触发页面跳转动作的部件,对其添加动作 在当前页打开Open Link in CurrentWindow,然后选择链接到外部url或文件 Link toan external url or file ,点击fx ,在弹出的编辑值Edit Value窗口中点击 Insert Variable or function 下拉列表中选择在数据集中添加了参照页的列名.

 

 

使用条件

 

  • 使用条件Using     Conditions

数据集中的项值可以使用带有特定条件的动作进行评估,例如,你可以设置数据集中名称为age的列,如果值>16就设置为选择状态,这样可以突出显示特定的数据项.

 

中继器格式

REPEATER FORMATTING

中继器格式

 

布局 Layout: 该设置允许改变数据的显示方式.

纵向 Vertical: 设置中继器数据集中的项纵向/垂直显示.

横向 Horizontal: 设置中继器数据集中的项横向/水平显示.

换行 Wrap Grid: 超过指定数量就换行/换列.

每列包含数量 Items Per Column:设置每行/每列中包含的数据项的数量.

 

项的背景色 Item Background: 给中继器添加背景色

背景色 Back Color: 给每个中继器的项添加背景色.

交替背景色 Alternating Color: 给中继器的项添加交替背景色.

 

分页 Pagination: 设置在同一时间显示指定数量的数据集的项.

多页 Multiple Pages: 将中继器中的项放在多个页面中切换显示.

每页项的个数 Items Per Page: 设置中继器的项在每个单页中显示的数量.

开始页 Starting Page: 设置默认显示哪个页面.

间距 Spacing: 设置行/列数据之间的间隔

Row: 设置每行数据之间,相隔的像素大小.

Column:设置每列数据之间,相隔的像素大小.

中继器部件的高级教程

排序Sort

过滤Filter

分页Paginate

 


AxureRP7.0基础教程系列 部件详解 中继器部件Repeater