中继器引用页面 | Reference Pages

将特定页面的引用存储在中继器的数据集中,在中继器项目中通过元件事件打开这些页面的链接。

如果你不熟悉中继器元件,你可以在我们的中继器元件参考指南中了解它的功能和使用方法,你也可以从我们的中继器基础教程开始。

STEP 0:下载中继器练习文件

如果你还没有练习文件,请下载Axure中继器练习文件.rp并在Axure RP中打开它,该文件包含了Axure中继器教程中对应的每个页面。

STEP 1:将引用页面添加到数据集中

在中继器练习文件中打开“引用页面”页面,在画布上有一个3乘3布局的中继器,展示着各种书籍。

选中“书籍”中继器元件,在检视窗格中的属性页签底部定位到数据集,然后向右滚动数据集直到你看到空白的“ProductPage”列。

已经为中继器数据集中的每本书设置了产品页面,你可以在“页面”窗格中的“产品页面”文件夹下浏览这些页面,因此我们要做的就是将这些页面的引用添加到“ProductPage”列。

右键点击“ProductPage”列中的单元格,然后在右键菜单中点击“引用页面”,在弹出的引用页面对话框中,选择名称与所选行“Title”列中书名相同的原型页面,然后点击“确定”按钮关闭对话框并将引用保存到数据集的单元格中。注意单元格中的页面名称,后面有一个页面图标。

STEP 2:打开引用页面的链接

现在,双击“书籍”中继器元件,以打开它的项目进行编辑。

在打开的新页签中,将画布上的三个元件全部选中,然后点击主工具栏中的“组合”按钮以将这些元件组合在一起(或者,你也可以使用快捷键[CTRL]+[G](Windows)/[CMD]+[G](Mac))。在新的元件组合被选中的状态下,双击检视窗格中属性页签下的“鼠标单击时”来添加一个新的鼠标单击时用例。

在用例编辑器中,点击左侧“添加动作”栏中的“新窗口/新标签”(位于“链接>打开链接”下面),在右侧“配置动作”栏的底部,选择“链接到url或文件”,然后点击“超链接”文本框右侧的“fx”按钮以打开编辑值对话框。

在对话框的顶部,点击“插入变量或函数…”,在弹出的菜单中,点击“中继器/数据集”下面的“Item.ProducePage”,注意这时候编辑值对话框顶部的文本框中将显示“[[Item.ProductPage]]”,然后点击“确定”按钮关闭对话框,再次点击“确定”按钮关闭用例编辑器。

STEP 3:预览

在Web浏览器中预览页面,点击书籍列表中的任意位置可以在新的浏览器页签或窗口中打开其产品页面。

评论(0)

发表评论

电子邮件地址不会被公开。 必填项已用*标注