Axure 02-元件库的使用&个人简历案例

目录

一、元件基本介绍

概述:

二、基本元件的使用

 2.1 形状

2.2 图片

 2.3 按钮

2.4 热区

 三、表单元件及表格元件

 3.1 表单元件的使用

3.2 表格元件的使用

 四、案例

        4.1 登录界面案例

        4.2 个人简历案例


一、元件基本介绍


概述:

-  在Axure RP中,元件是**构建原型图的基础模块**。 将元件从元件库里拖拽到画布中,即可添加元件到你的原型图中。
-  软件自带了三个官方元件库,分别是默认元件库(Default)、流程元件库(Flow)和图标元件库(Icons)。

二、基本元件的使用


        基本元件基本元件是由形状元件、图片元件、线段元件及中继器构成。  

Axure 02-元件库的使用&个人简历案例_第1张图片

 2.1 形状

        矩形、圆形它的用法是差不多的,可以填充它的背景、线段、也可以在里面填字、以及修改颜色、大小

Axure 02-元件库的使用&个人简历案例_第2张图片 

2.2 图片

        使用方法,可以通过双击选择本地磁盘图片,当我们想设置图片大小,按住Shift拖拽图片边框不会失帧,否则会导致失帧,axure会自动提示是否将大图片进行优化,避免原型文件过大。

Axure 02-元件库的使用&个人简历案例_第3张图片

 2.3 按钮

        按钮、主要按钮、链接按钮,它们跟上面的矩形用法是差不多的,除了链接按钮,类似于超链接,可以跳转页面、或者是弹出一个页面等

Axure 02-元件库的使用&个人简历案例_第4张图片

2.4 热区

  • 热区是一个透明的元件,通过交互设置就可实现类似超链接的功能。
  • 比如有一张图片,现在我要实现点击图片中的热区,跳转到系统管理中用户管理,只有点击热区的范围内才会有设置的交互,点击其它地方没用

Axure 02-元件库的使用&个人简历案例_第5张图片

 三、表单元件及表格元件

         下面的图片就是Axure的表单元件与表格元件,大家也可以在元件库中搜索进行查找

Axure 02-元件库的使用&个人简历案例_第6张图片 

 3.1 表单元件的使用

  • 文本框就类似于输入框一样,而文本域与文本框的区别在于可以添加多行文字,从而可以输人更多的文本,如果想写提示词的话,在右边交互点击提示中的提示属性。
  • Axure 02-元件库的使用&个人简历案例_第7张图片
  • 下拉列表和列表框双击即可编辑其内容,列表框有点不同的地方就是双击进入编辑列表框,左下角有一个按钮点击的话可以选中多个
  • Axure 02-元件库的使用&个人简历案例_第8张图片
  • 复选框和单选按钮其实差不多,顾名思义单选只能选择一个、复选可以选择多个,但是单选按钮有个不同点就是,需要右键指定单选按钮组
  • Axure 02-元件库的使用&个人简历案例_第9张图片

3.2 表格元件的使用

  表格元件在画布中的很多操作基本通过右键菜单中完成,例如:行、列、节点、菜单项的添加、删除、移动等操作。

  •  树又称树形菜单,有一个下三角,可展开/隐藏
  • Axure 02-元件库的使用&个人简历案例_第10张图片
  • 表格单元都可以编辑文本内容,如果想新增行/列的话,选中一行或一列,右击鼠标选择新增对应的行/列即可
  • Axure 02-元件库的使用&个人简历案例_第11张图片
  • 水平菜单的应用场景,可以是顶部/底部的导航栏
  • Axure 02-元件库的使用&个人简历案例_第12张图片

 四、案例

        4.1 登录界面案例

                下面的登录按钮我采用了,矩形、文本标签、文本框、按钮、图片等元件,首先先把矩形锁定在底层,在矩形上运用元件绘制登录界面Axure 02-元件库的使用&个人简历案例_第13张图片

        4.2 个人简历案例

                 下面的个人简历我采用了,矩形、文本标签、文本框、单选按钮、水平线、复选框、下拉列表、复选框、按钮等元件,首先先把矩形锁定在底层,将以上元件在矩形上绘制个人简历界面Axure 02-元件库的使用&个人简历案例_第14张图片

你可能感兴趣的:(axure)