求知 文章 文库 Lib 视频 iPerson 课程 认证 咨询 工具 讲座 Modeler   Code  
会员   
要资料
 
追随技术信仰

随时听讲座
每天看新闻
 
 
目录
Axure RP安装与激活
1.Windows上安装
2.macOS上安装-Axure教程
3.激活Axure RP 10-Axure教程
4.Axure汉化流程-Axure教程
5.Chrome插件安装-Axure教程
入门
6.Axure RP入门-Axure教程
7.Axure RP操作界面-Axure教程
8.预览和共享原型-Axure教程
9.功能快捷键-Axure教程
10.自动保存备份文件-Axure教程
元件的使用
11.元件的基础操作-Axure教程
12.元件组合-Axure教程
13.元件样式-Axure教程
14.元件库-Axure教程
15.网格,辅助线和边界对齐-Axure教程
基础元件
16.形状元件-Axure教程
17.图像元件-Axure教程
18.热区元件-Axure教程
19.线条元件-Axure教程
20.动态面板元件-Axure教程
21.内嵌框架-Axure教程
22.文本框与多行文本框-Axure教程
23.下拉列表-Axure教程
24.列表框-Axure教程
25.复选框-Axure教程
26.单选按钮-Axure教程
27.树元件-Axure教程
28.表格元件-Axure教程
29.经典菜单元件-Axure教程
30.快照元件-Axure教程
页面的使用
31.管理页面-Axure教程
32.页面样式-Axure教程
母版
33.创建和使用母版-Axure教程
34.母版视图-Axure教程
35.引发事件-Axure教程
交互介绍
36.事件、用例和动作-Axure教程
37.事件清单-Axure教程
38.动作清单-Axure教程
39.文本链接-Axure教程
40.交互样式-Axure教程
41.动画-Axure教程
高级交互
42.变量-Axure教程
43.条件逻辑-Axure教程
44.数学、函数和表达式-Axure教程
45.选项组-Axure教程
46.移动动作边界-Axure教程
中继器
47.中继器元件-Axure教程
48.向中继器动态添加行-Axure教程
49.动态删除中继器行-Axure教程
50.更新中继器行-Axure教程
51.标记中继器行-Axure教程
52.中继器行排序-Axure教程
53.过滤中继器行-Axure教程
54.中继器分页-Axure教程
自适应视图
55.自适应视图-Axure教程
记录您的原型
56.页面和元件注释-Axure教程
57.Word说明书-Axure教程
58.打印-Axure教程
流程图
59.流程图-Axure教程
60.流程连接器-Axure教程
发布你的原型
61.原型播放器-Axure教程
62.自定义HTML输出-Axure教程
63.Web 字体和字体映射-Axure教程
项目团队
64.创建和共享团队项目-Axure教程
65.使用团队项目-Axure教程
66.管理和查看团队项目历史-Axure教程
67.对团队项目进行故障排除-Axure教程
68.将团队项目升级到 RP 10-Axure教程
 
 
目录
中继器分页-Axure教程
来源:Axure工坊       编辑: Alice (火龙果软件)
1596 次浏览
2次  

在本教程中,您将学习如何对中继器元件进行分页,以将它们的项目分成画布上的多个“页面”。您还将学习如何使用设置当前页在页面之间进行切换显示,以及如何通过Repeater.pageIndex和Repeater.pageCount属性显示页码和总页数。

1.元件设置

1. 打开一个新的 RP 文件并在画布上打开Page 1。

2. 将一个矩形元件拖到画布上,右键单击它,然后从上下文菜单中选择创建中继器。

3. 编辑数据集中的数据,分别输入1-9的数字。

4. 在元件库窗格中,切换到图标库并使用窗格左上角的搜索字段来搜索箭头。将左箭头和右箭头拖到中继器的两侧各放置一个。

2. 给中继器分页

1. 选择中继器并在样式窗格底部的分页部分选中多页显示。

2. 在每页项目数字段中输入3,并将起始页保留为1。这会将中继器的九个项目分成三页,每页三个项目,中继器加载到Web浏览器时将显示第一页。

3.点击箭头元件时设置当前页面

1. 选择右箭头并在交互窗格中单击新建交互。

2. 在出现的列表中选择单击事件,然后选择设置当前页动作。

3. 在目标下拉列表中选择中继器元件。

4. 在页面下拉列表中选择下一项,然后单击确定以保存动作。

5. 使用左箭头重复这些步骤,将中继器的页面设置为上一项。

4.预览交互

1. 在 Web 浏览器中预览页面。您应该会看到中继器的前三项。

2. 单击右箭头可查看接下来的三个项目,再次单击可查看最后三个。

3. 单击左箭头可向前浏览项目。

5.显示当前页码和总页数

1. 回到 Axure RP,将一个标签元件拖到画布上并将其放在中继器下方。将其文本设置为Page 1 of 3。

2. 选择中继器元件。在交互窗格中,将鼠标悬停在项目加载事件下的设置文本动作上,然后单击出现的添加目标按钮。

3. 在目标下拉列表中选择标签元件。

4. 单击值字段右侧的fx图标以打开编辑文本对话框。

5. 在对话框的顶部区域,选中文本Page 1 of 3中的1。然后,单击插入变量或函数,并在出现的列表中选择中继器/数据集下的pageIndex。该区域中的文本现在应为:Page [[Item.Repeater.pageIndex]] of 3。

6. 同理选中文本3,并再次单击插入变量或函数。在中继器/数据集下选择pageCount。该区域中的文本现在应为:Page [[Item.Repeater.pageIndex]] of [[Item.Repeater.pageCount]]

7. 两个括号中的表达式将分别替换为中继器在 Web 浏览器中的当前页数及其总页数。每当中继器的页面更改时,当前页面的编号将自动更新。

8. 单击确定关闭“编辑文本”对话框,然后再次单击确定以保存设置文本动作。

6. 预览交互

预览页面并单击左右箭头更改中继器的页面。标签元件上的文本随即更新以显示当前页面的编号。


您可以捐助,支持我们的公益事业。

1元 10元 50元





认证码: 验证码,看不清楚?请点击刷新验证码 必填



1596 次浏览
2次