2.3　左侧面板

2.3.1　站点地图

站点地图指用来增加、删除和组织管理原型的页面。在原型制作中，一个原型至少会包含一个页面，如果产品很复杂，涉及多个模块和多个页面，可以通过添加“文件夹”和“子页面”来组织该原型页面，如图2-14所示。

图2-14

2.3.2　元件库

Axure默认提供的元件库里包含4类元件，即基本元件、表单元件、菜单和表格、标记元件，如图2-15所示。

下面，介绍一些常用的元件。

◇基本元件

矩形：分为“有边框”和“无边框”两种。

椭圆形：严格来说叫圆形，因为将椭圆形拖动到设计区域时其默认的也是圆形，只是在具体操作时可以调整其宽度和高度罢了。

图片：在Axure操作中大多数情况下并不是从元件库里拖动某个元件到设计区域，因为现在很多软件都带有截图功能，将截好的图片在Axure的设计区域直接粘贴后就可以作为图片使用了，同时在具体操作中也可以双击粘贴进去的图片，然后打开对应窗口重新选择图片。

图2-15

占位符：在制作原型时，当还不确定界面上对应位置应该放什么时，或者还不想详细设置，可以用一个占位符来代替。

按钮：包括3种常用按钮，即按钮、主要按钮和链接按钮。其中主要按钮的功能是在原型界面上按Enter键时，会直接响应这个主要按钮上的事件。

热区：是指可以响应事件的一块区域，在界面上不会显示。例如，针对一张效果图里面一个按钮，可以在按钮位置放一个热区，然后添加事件处理。这样就避免需要把按钮从效果图上切下来后再处理的麻烦。

动态面板：一个非常重要的元件（详细介绍见“第8章动态面板的设置与应用”）。它就像一个容器，并带有“分层”管理功能，在同一时刻只能显示其中一个层，且每一层可以容纳不同的内容。

◇表单元件

表单元件的界面涉及的内容包括文本框、下拉列表框、列表框、单选按钮和复选按钮等，这些内容都比较常见，所以这里也就不再过多赘述。

◇菜单和表格元件

在表现一些二维数据时，可以用“表格”功能来表示，其使用方法类似于Excel（全称Microsoft Office Excel）表格制作，在制作时可以设置每个单元格的样式。

◇标记元件

一组用来做标记的，给元件添加说明的工具。在Axure操作中，当默认的系统元件不能满足我们的原型设计需要时，如在系统元件中没有Android或iOS系统的元件，可以选择“创建元件库”功能，如图2-16所示。这样就可以设计自己的元件库了，可以极大地丰富Axure元件的多样性。

图2-16

提示

网络上尤其是Axure官方社区有很多第三方免费元件库可供下载，相关资源可详细查阅本书附录。

2.3.3　母版库

母版是用户自定义的一组元件，将它转成母版的目的是一次性设计，多次重复使用，避免无谓的劳动付出和工作时间上的浪费。另外，还有一个好处是利用母版可以预先设计好元件的位置，当将母版文件拖动到“设计区域”时，会自动将该位置设定在“锁定”状态，如此也就不用重复思考把它放在哪个位置会比较合适了，该方式常用在页面上公共部分的设计中。

以下面的“导航菜单”为例，将它固定在设计区域距左上角（10，10）的位置，选择“导航栏”内的指定元件内容，并单击鼠标右键，在弹出的菜单中选择“转换为母版”选项，并将“拖放行为”设置为“固定位置”，如图2-17所示。

双击“新母版2”进入编辑状态，选择全部元件，然后移动到设计区域（10，10）的位置，关闭母版编辑窗口，并从母版库里拖动“新母版2”到设计区域，此时可以发现“母版”位于（10，10），并且边框呈现为“红色虚线”状态，这就意味着母版被自动固定在了界面设计区域（10，10）的位置，无法操作，如图2-18所示。

图2-17

图2-18