3 photolemur 样式下载_Axure9实操教程3-元件库与元件

cd045ce5aab291c09ce06674d07ee3ca.png

锵锵锵……(●'◡'●)……更新啦……

Axure制作的原型基本上就是元件组成的界面内容,很大程度上可以模仿出真实的效果,俗称“高保真”,当然跟真正系统是没发比的。但作为研发参考,或者给甲方爸爸展示是非常高效的一种原型啦。


元件库

Axure一般有三个自带的元件库,这些元件库中的元件已经可以满足设计要求。

f4d73cdc93fe9918a3f047a067d633e8.png
Axure自带元件库

除此之外,用户可以自己创建元件库,也可以从网上下载一些元件库加载进入,点击“+”号后,选择下载的元件库,打开后就将下载的元件库加载到元件中了:

d3f614a8d0ecd78dcdda088860f418dd.png
载入元件库

5a74ce1d8413a848a68b9e8fe0f6cb88.png
载入的元件库

除了可以载入元件库,也可以自己创建元件库,创建元件库跟创建原型的方式基本相同,Axure会记录元件库中的样式、交互等,载入元件库后,就可以直接拖出元件使用,不用再进行样式、交互的设计,所以常用的比如输入框、按键、下拉框甚至是登录框组合等,都可以制作成元件,方便后面使用。

5d7d4128e3ba68baaa09bdfdece59d7e.png
自创元件库

元件库除了元件之外还有一种,就是图片库,把常用的底图或者透明背景图放到库中方便使用:

54bfe28829404c23ae2d857266f0953a.png
选择图片文件

70fa7b891a49811781166975ff2e8743.png
图片库标示

af15f01d08f8dbd2cf6cdf66d53b3013.png
图片库

元件库的其他操作:

f73b61211b72e68cfd10f09a926f6550.png
元件库其他操作

获取元件库:打开官网推荐的元件库网页;

编辑元件库(图片库不可编辑):打开元件库,对里面的元件进行自由编辑;

打开源目录:打开元件库所在文件夹;

移除元件库:将库从Axure9移除。


元件

Axure中自带的元件有3中:

  1. Default:制作原型的基本元件库
  2. Flow:用于制作流程图的元件库
  3. Icons:图标库,包含一些常用图标

其中,制作原型用的基本上都是Default和Icons,其中Default中包含了形状元件、图片元件、文本元件、以及动态面板、中继器、内联框架等特殊元件。掌握了Default中的元件其他的都不在话下啦。

怎么使用元件呢?直接从库中将要使用的元件拖出即可,拖动就可以移动元件位置,如果有参考物,系统会启用智能参考线(红色),蓝色的线条是元件的边界,也是变换控件可以变换元件的大小和形状:

18447b3155363105d3c1af0e3ae32cde.png
拖出元件放置

按住变换控件上的锚点,可以拖动变换元件,如果要在不改变元件形状的条件下改变大小,可以按住shift再拖动锚点;按住ctrl后,鼠标靠近锚点,可以看到鼠标变成一个环形的箭头,这个时候可以改变形状的角度。这些操作如果要求精确,可以直接再样式中进行(需选中元件):

8e579557305adbf65a374e6a6735aeb4.png

还有填充、描边等样式调整,这些都很好理解,宝宝们自己试试就知道啦。

7a90ef493875a46ce4a223af2d88782f.png

所有元件的放置和样式设置都大同小异,这里就不多说了,我已经很啰嗦了……吐舌……

在工具栏中还有很多元件编辑和控制的工具,在后面使用过程中,我们来一一讲解。

d9b0939df065329d79933e71d185345f.png

最后说下多元件的情况下,发现在工作区拖选择框总是会选中不需要的元件,可以将选择模式更改一下,可以选择接触即选中或者全部框住才选中:

443190d2b64cc2406344f7730435cd0b.png

又或者,在概要中点击选则,多选时按住ctrl单击需要选中的元件;或者按住shift点击第一个要选择的元件和最后一个要选择的元件,则这两个元件和他们之间的元件将全部被选中。

如果直接在工作区按住chrl/shift点击元件都可以实现多选。


啊……肚子好饿,该吃午饭了……

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值