原型设计工具Axure RP入门教程(五):使用Droplist教程设置文本
Axure RP是一套专门为网站或应用程序所设计的快速原型设计工具, 可以让应用网站策划人员或网站功能界面设计师更加快速方便的建立Web AP和Website的线框图、流程图、原型和规格。
在本教程中,您将学习如何基于在下拉列表小部件中所做的选择来动态设置小部件上的文本。
小部件设置
打开一个新的RP文件,然后在画布上打开Page 1。
将一个矩形小部件和一个下拉列表小部件从“ 库”窗格拖到画布上。
将矩形窗口小部件上的文本设置为My favorite color is red。
双击droplist编辑其选项,然后单击编辑许多在对话框的顶部。在出现的窗口中,输入以下选项,并用换行符分隔:
red
orange
yellow
green
blue
purple
单击OK关闭Edit Many(编辑很多)窗口,然后再次单击OK关闭Edit Droplist(编辑下拉列表)对话框。
当下拉列表的选择更改时更改矩形窗口小部件的文本
- 选择下拉列表,然后在Interaction(交互)窗格中单击New Interaction(新建交互)。
- 在出现的列表中选择Selected Changed事件,然后选择Set Text操作。
- 在目标下拉列表中选择矩形小部件。
- 单击Value字段右侧的fx图标以打开“编辑文本”对话框。
- 在对话框顶部的字段中,选择句子中的红色词。
- 单击字段上方的插入变量或函数。在出现的下拉列表中,在小部件标题下选择文本。
- 对话框的上方字段现在应显示“我最喜欢的颜色是[[This.text]]”。(括号中的表达式将由Web浏览器中的下拉列表当前选择的选项替换。)
- 单击OK关闭Edit Text(编辑文本)对话框,然后再次单击OK以保存设置文本操作。
预览互动
预览页面,然后在下拉列表中选择其他颜色。矩形窗口小部件上显示的句子应更新以反映您的选择。
附加信息和提示
使用广播组设置文本
如果您希望将选项显示在单选组而不是下拉列表中,则仍可以与上一教程中描述的交互进行类似的交互。 使用相同的“设置文本”操作,并将其添加到组中每个单选按钮的Selected事件中。
关注慧聚IT微信公众号???,了解产品的最新动态及最新资讯。