2.认识Axure RP界面

2.1 菜单栏与工具栏区

菜单栏与工具栏区是Axure RP的功能区域，Axure RP所有的功能命令和常用命令的快捷操作均位于此处。一些常用的操作有：

（1）重置视图。用户在使用Axure RP的过程中不小心关闭了某些窗口，可以使用此命令恢复到Axure RP的默认视图状态，从“视图”菜单选择“重置视图”命令即可。

（2）发布命令。发布菜单包括预览、生成等命令，是项目设计过程中常用的命令。该命令在菜单栏和工具栏上均有显示，如图1-2所示。

（3）元件布置。设置元件的层次关系、组合关系，设置多个元件之间的对齐方式等，如图1-3所示。

（4）视图模式。视图模式包括相交、包含、连接三种模式。在相交模式中，只要元件的任意部分包含在鼠标拖选的范围内，元件即被选中；在包含模式中，只有被鼠标拖选全部包含的元件才被选中；在连接模式中，拖动鼠标产生连接线，可以将任意的元件用线条连接起来，如图1-4、1-5所示：

2.2 站点地图区

站点地图区主要用来组织页面之间的关系，实现添加、删除页面等操作，便于用户管理各类页面。常用的操作有：

（1）添加、删除页面。使用面板工具或者快捷菜单，均可添加、删除各类页面和文件夹，如图1-6所示。

（2）页面层次组织。页面层次组织包括页面的上下位置移动、内外层级移动，通过命令可以将页面放置在任意位置和任意层级；同时，还可以添加文件夹将页面分类管理，如图1-7所示。

（3）生成流程图。右键快捷菜单中的“生成流程图”命令，可以将网站页面之间的逻辑结构用流程图表示出来，如图1-8所示。

2.3 元件库区

元件是Axure RP中的重要概念，也是制作各类原型的基础。具有特定外观和一定功能，能响应用户各种操作的功能集合就是一个元件。Axure RP自带的元件有基本元件、表单元件、菜单表格元件、流程图元件等。同时，也可以自定义元件或者安装第三方发布的各类元件。元件库管理区的常用操作有：

（1）选择元件库。从元件库面板中选择“选择元件库”菜单，可以根据类别选择要显示和使用的元件，如图1-9所示。

（2）安装第三方元件库。从元件库工具栏中点击“选项”命令，从弹出的下拉菜单中选择“载入元件库”命令，即可安装下载好的元件库，如图1-10所示。

（3）元件的基本使用。页面原型由各种不同的元件组成，元件的基本使用包括元件的插入、复制、删除、叠放层次、组合操作。

①插入元件。Axure RP中插入元件采用拖放的方式，如图1-11所示。

②复制元件。按住Alt键，拖动元件即可完成复制操作，如图1-12所示。

③删除元件。选中要删除的元件对象，按键盘Delete键，即可删除选中的元件对象。

④设置元件叠放层次。选中元件，鼠标右键弹出快捷菜单，下移至“顺序”，弹出下一级命令，执行即可移动元件的层次，如图1-13所示。

⑤组合元件。将不同的元件组合在一起，既方便移动操作，也可以避免位置的误操作；同时，组合在一起的元件共享事件及事件用例，减少用户操作。拖动鼠标，选中要组合的元件集合，右键弹出快捷菜单，选择“组合”命令即可完成元件的组合操作。

2.4 页面属性区

页面属性区一般放置在线框图编辑区下方，主要用来设置页面的整体外观和行为。例如设置页面背景颜色、页面对齐方式、页面全局性事件等。常用的操作有：

（1）页面整体样式设置。包括设置页面背景图片、背景图片重复方式、页面背景颜色、页面对齐方式等，如图1-14所示。

（2）全局页面交互设置。主要设置页面载入时、滚动时、视图窗口大小调整时等事件的用例，如页面载入启动时钟设置等，如图1-15所示。

2.5 元件交互与说明区

元件交互与说明区是使用较为频繁的区域，各类元件的人机交互功能均在此区域。人机交互主要是指元件响应用户的各类操作。常用的操作有：

（1）元件命名。为每一个拖入的元件都起一个易于辨别的名字是一个良好的操作习惯，当界面元素数量较多时，起名字是非常必要的。元件名既可以使用英文字母和数字，也可以使用中文，如图1-16所示。

（2）添加用例。用例就是元件相应各种事件所进行的操作，常用的事件包括鼠标单击、鼠标移入/移出、获取（失去）焦点、显示/隐藏等。点击各类事件即可进入用例编辑状态，如图1-17所示。

（3）创建超级链接。超级链接是网页中最常见的元素，用户在Axure RP中，可以方便地为文字、图片、形状等各类元素创建超级链接，如图1-18所示。

2.6 元件属性与样式区

元件属性与样式区主要用来设置元件的位置、大小、颜色、形状、阴影等属性和样式，以及简单的鼠标交互样式。常用的操作有：

（1）设置形状。更改形状元件的外观，构建选项卡等网页页面，如图1-19所示。

（2）设置交互样式。为吸引用户注意力，对超级链接、图片等网页元素，鼠标悬停、离开、移入时，在颜色、大小等属性上可以设置变化，如图1-20所示。

（3）设置基本样式。设置元件的位置、尺寸、边框、填充效果、字体等基本样式，如图1-21所示。