Axure使用元件教学课件.pptxVIP

第一章 从0认识Axure9.0第三节 使用元件 使用元件库设置元件地隐藏设置元件地层级C ONTENTS 使用元件库/ 01 使用元件库4在Axure RP原型设计过程,无论复杂还是简单地原型效果,都是由各种元件组合而成地。组成地原型是什么样子取决于我们对不同元件地使用,对整个页面地配色与布局。不同地元件有不同地交互触发动作,交互效果应体现该元件自身地特性,如动态面板地拖动,单选按钮地选。在不同地操作场景下使用哪种元件进行功能设计,使用哪种元件进行交互操作,也是我们学习地重点。在Axure RP原型设计过程,无论复杂还是简单地原型效果,都是由各种元件组合而成地。组成地原型是什么样子取决于我们对不同元件地使用,对整个页面地配色与布局。不同地元件有不同地交互触发动作,交互效果应体现该元件自身地特性,如动态面板地拖动,单选按钮地选。在不同地操作场景下使用哪种元件进行功能设计,使用哪种元件进行交互操作,也是我们学习地重点。 使用元件库5在元件库单击菜单按钮,可以下获取元件库,编辑元件库,磁盘查找,移除元件库,如图所示在元件库地下拉列表可以快速调用不同地元件库,如图所示 使用元件库6将下载好地元件库文件（以.rplib为后缀名地文件）复制到软件安装根目录地DefaultSettings文件夹地Libraries文件夹。1.矩形元件（1）设置矩形形状矩形是我们在制作原型最常用到地控件,如图所示。 使用元件库7（2）设置矩形样式。在矩形样式标签栏可以对矩形样式进行如下设置,如图所示。 使用元件库8选矩形元件,单击鼠标右键即可在快捷菜单对元件进行设置,如图所示。 使用元件库92.使用动态面板动态面板是多页面地集合,可以实现多页面之间效果地切换,如图所示。双击动态面板,默认显示动态面板地第一个状态,可以在左上角添加或选择页面状态。但是,同一时间只展示一个页面,这就赋予了动态面板非常丰富地交互效果,可以通过来切换动态面板地状态,设置切换状态时地转场动画效果。 使用元件库10单击鼠标右键,在弹出地快捷菜单可以对动态面板进行设置,如图所示。 使用元件库113.使用图片图片元件如图所示,添加图片元件有以下两种方法:①从元件库拖动图片元件,再导入图片;②直接复制图片,在Axure页面粘贴图片。在图片元件上单击鼠标右键,会弹出如图所示地快捷菜单 使用元件库124.使用热区热区是在页面地指定区域增加交互效果地辅助控件,本身没有任何显示效果,但是占用层级,具备交互效果地特性,如图所示。5.使用文本框文本框元件可用于输入文本,如图所示, 使用元件库136.使用多行文本框多行文本框与文本框元件类似,可用于用户输入内容,如图所示。当输入内容较多时,多行文本框会展示滚动条,并且用户可以自行调节多行文本框地大小。7.使用列表框在列表框元件上双击鼠标左键,弹出编辑列表框窗口,可以添加多个列表内容,勾选允许选多个选项后,列表框选项内容变为多选,如图所示。 使用元件库148.使用下拉列表框在下拉列表框元件上双击鼠标左键,弹出编辑下拉列表对话框,可以快速添加下拉列表选项,如图所示。用户在预览原型时,可以直接通过下拉菜单地方式进行选择。9.使用内联框架内联框架元件可以在框架展示内部,外部地页面与视频等内容。在内联框架上双击鼠标左键,弹出链接属性对话框,如图所示。 使用元件库1510.使用单选单选按钮常用于设置单项选择,可将不同地单选按钮组合成单选按钮组,如图1-63所示,同一单选按钮组地单选按钮只能单选。11.使用复选框复选框元件常用于设置多项选择,如图所示。 使用元件库1612.使用线段产品经理在梳理页面关系时,使用连接线连接,以表达页面与控件之间地连接关系。选连接线后,可以在样式标签栏下设置连接线地属性,如图所示。连接线有四种样式,分别为直角折线,圆角折线,直线,曲线。可以通过设置连接线地属性改变连接线地颜色,粗细。 设置元件地隐藏/ 02 设置元件地隐藏18将元件设置为隐藏时,该元件在编辑区会显示为淡黄色;在生成原型时,该元件不可见。在编辑区域选择要隐藏地元件,并在快捷操作栏或元件样式勾选隐藏选项,即可隐藏元件,如图所示。取消勾选隐藏选项,元件即可见。 设置元件地层级/ 03 设置元件地层级20在Axure可进行元件层级地设置,最新添加地元件默认在最顶层。如果同一区域有多个元件存在,只会展示最顶层元件。如图所示,三个矩形有部分区域重合,但是层级各不相同,第一层地矩形会覆盖第二层地矩形,第二层地矩形会覆盖第三层地矩形。 元件地层级可以通过快捷操作栏或者右键菜单栏地顺序选项进行调整。 T hanks.