张晓3小时学会Axure图文教程案例篇05 下拉列表联动效果详解.pdf

张晓3小时学会Axure图文教程案例篇05 下拉列表联动效果详解.pdf

  1. 1、本文档共5页,可阅读全部内容。
  2. 2、有哪些信誉好的足球投注网站(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
  3. 3、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载
  4. 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
查看更多
3 小时学会Axure 产品经理原型设计系列教程-实战篇 3 小时学会Axure 图文教程案例篇 ——05 下拉列表联动效果 作者:张晓 在一些旅游、票务定制的网站上定制行程时,需要用户录入出发地、日期、目的地等信 息,相对于手工输入的方式,使用下拉列表来让用户进行选择无疑是一种更好的用户体验, 这节课我们就来实现这样的一个Axure 的交互案例。 一、下拉列表联动效果 原型软件:Axure RP Pro 7.0 中文汉化版 实例描述:用户在下拉列表中选择一个其中选项,即显示用户选择项所对应的的文本内容。 二、交互设计步骤 (一)设计思路:使用“下拉列表(Droplist )”控件(Widgets ,也称元件/控件)的“选 项改变时”用例,当改变了选项时,设置结果标签内容为选中项的值。 (二)实现步骤 STEP1 :完成控件的布局、命名。将标签(Label )、下拉列表(Droplist )控件拖入 主工作区(Wireframe Pane ,也称线框图面板),对控件命名,并将用于显示选择结果的 标签设置为隐藏。 1 3 小时学会Axure 产品经理原型设计系列教程-实战篇 STEP2 :设置下拉框选项列表。双击下拉列表(Droplist )控件,打开“编辑选项”对 话框,新增列表选项。 完成下拉列表选项后,下拉列表控件会默认显示第一个选项内容。 2 3 小时学会Axure 产品经理原型设计系列教程-实战篇 STEP3 :设置下拉列表的交互用例。 (1 )单击下拉列表按钮控件,在【控件交互和注释面板中】双击“选项改变时”用例; (2 )设置动作。在用例编辑器对话框中依次编辑【设置文本】、【显示/隐藏】动作。 其中: 【设置选择/选中】动作:选择用于显示结果的“提示语”标签控件,并将其值设为“选择 下拉框的选中项值”。 3 3 小时学会Axure 产品经理原型设计系列教程-实战篇 【显示/隐藏】动作:选择“提示语”标签控件,将其设为显示。 最终的原型演示效果如下: 4 3 小时学会Axure 产品经理原型设计系列教程-实战篇 1、选择”马云“: 2、选择”张晓“: 三、下节课程预告 Axure 案例图文教程:第06 节 制作tab 页签效果 谢谢! 5

文档评论(0)

xuefei111 + 关注
实名认证
内容提供者

该用户很懒,什么也没介绍

1亿VIP精品文档

相关文档