In this tutorial, you'll learn how to dynamically add rows to repeater widgets using the Add Rows action.在本教程中,你将学习如何使用“添加行”操作将行动态添加到中继器部件。
Note注意
Click here to download the completed RP file for this tutorial. 单击此处下载本教程的完整RP文件。
1. Widget Setup部件设置
Open a new RP file and open Page 1 on the canvas.打开一个新的RP文件,然后在画布上打开Page 1。
Drag a repeater widget, a text field widget, and a button widget onto the canvas.将中继器部件,文本输入框部件和按钮部件拖到画布上。
Set the button's text to
Add New Row
.将按钮的文本设置为“添加新行”。
2. Add a Row to the Repeater When the Button Is Clicked单击按钮时,将行添加到中继器
Select the button widget and click New Interaction in the Interactions pane.选择按钮部件,然后在“交互”窗格中单击“新建交互”。
Select the Click or Tap event in the list that appears, and then select the Add Rows action.在出现的列表中选择点击事件,然后选择添加行操作。
Select the repeater widget in the Target dropdown.在目标下拉列表中选择中继器部件。
Click the Add Rows button. In the Add Rows to Repeater dialog that appears, click the fx icon to open the Edit Value dialog.单击添加行按钮。 在出现的“将行添加到中继器”对话框中,单击fx图标以打开“编辑值”对话框。
At the bottom of the dialog, click Add Local Variable.在对话框的底部,单击“添加局部变量”。
In the third field of the new local variable row, select the text field widget. This local variable will capture the text field's text in the web browser.在新的局部变量行的第三个字段中,选择文本输入框部件。 此局部变量将在Web浏览器中获取文本输入框字段的文本。
In the upper field of the dialog, enter the local variable's name in brackets:
[[LVAR1]]
在对话框的上方字段中,在方括号中输入局部变量的名称:[[LVAR1]]Click OK to close the Edit Value dialog and then click OK again to close the Add Rows to Repeater dialog.单击“确定”关闭“编辑值”对话框,然后再次单击“确定”关闭“将行添加到中继器”对话框。
Click OK in the Interactions pane to save the Add Rows action.在“交互”窗格中单击“确定”以保存“添加行”操作。
Preview the page and enter some text in the text field.预览页面,然后在文本输入框中输入一些文本。
Click the Add New Row button to add a new row to the repeater. The new row's rectangle widget should display the text from the text field.单击添加新行按钮,将新行添加到中继器。 新行的矩形窗口部件应显示从文本输入框获取的文本。