《AxureRP9网站与App原型设计》教学教案—06用Axure母版减少重复工作.docx

第6章用Axure母版减少重复工作

课时内容用Axure母版减少重复工作

课时

教学目标掌握母版功能、3种拖放行为，学会蓝月亮导航菜单母版设计

教学目标

教学重点母版功能、3种拖放行为

教学难点母版功能、3种拖放行为

教学设计.教学思路：通过实例引入母版的概念；通过多媒体演示和实机操讲解母版功能；通过实战熟悉利用母版设计导航菜单的方法。

教学设计

.教学手段：多媒体+计算机.教学资料：教材、多媒体课件

教学内容

Axure母版的使用是为了减少重复的工作，在原型设计过程中，往往会设计很多重复的页面内容，包括页面的首部、版权信息、导航菜单。这就加大很多工作量，而通过母版，在母版里面只需要进行一次设计，其他页面可以直接使用母版的内容，并且在母版里修改内容，可以实现所有引用母版的页面同时更新，也不需要到每个页面里单独修改内容。

用母版设计页面重复出现的内容6.1母版功能介名

用母版设计页面重复出现的内容

Axure的母版能够重复制作原型某个类似的功能，实现母版制作一次，其他页面进行复用的效

E百页

E百页

E百页回公司介留■版权信息西背曷图200修改背景色6.2.3拖放行为为从母版脱离

E百页

回公司介留

■版权信息

西背曷图

200

修改背景色

从母版脱离：这种拖放行为会使页面引用的母版与原母版失去联系，页面引用的母版元件可以像一般元件一样进行编辑，常用于创立具有自定义元件的组合。

实战演练

（1）在母版区域里新建一个“导航菜单”母版，进入到此母版里，拖曳5个“矩形1”元件到工作区域作为5个菜单，将其宽度均设置为100,高度均设置为40,分别重命名为“首页”“公司介绍”“新闻中心”“招贤纳士”“联系我们”。

巴会1Q国口口

回苜贝国公司介培

国新闻中心回招贤纳士彳

E联系我的I首页公司介绍新闻中心招贤纳士联系我们

望［III

QHD累

叫画版权信息国―——I

导航菜单母版

（2）将制作完的“导航菜单”母版，引用到“联系我们”页面里，需要在“导航菜单”母版上,右键单击，在弹出的快捷菜单中，选择“新增页面”选项，在弹出的“添加母版到页面中”对话框里设置将母版引用到“联系我们”页面里。

X赤加母版到页面中添加［。帆章华］到以下页?：

■诩?不法中子重中子R

回首B

回公耽M8

回新他00口回省士|g回n|（?■

?）幢定为母版中的位置

O海定新的位*

□苣于底层Aia

□页面中不包含此卷版时才RM加.

说明：此建作无法E.

取消

母版引用到页面里

(3)进入到“联系我们”页面里，可以看到引用的导航菜单内容，默认引用的母版内容是锁定、不能移动的。如果想修改此母版内容，需要将引用的母版内容变为一般元件，右键单击引用的母版内容，在弹出的快捷菜单中勾选“脱离母版”选项。

概要回首页目公司介蛤回新苗中心回招贤纳土国版权信息四背昌图国导航菜单7Ctt联系会＜]

概要

回首页

目公司介蛤

回新苗中心

回招贤纳土

国版权信息

四背昌图

国导航菜单

7Ctt

联系会＜]X与39X

0

B口

设置从母版脱离拖放行为

页面内容没有更新6.3实战蓝月亮导航菜单母版设计

页面内容没有更新

6.3实战

蓝月亮导航菜单母版设计

(4)导航菜单从母版脱离后，导航菜单变为普通元件，可以随意地移动和放置，与母版没有任何关系，即使修改“导航菜单”母版内容，“联系我们”页面内容也不跟着变化的。进入到“导航菜单”母版，复制一个导航菜单，将文本内容命名为“留言本”，回到“联系我们”页面里可以看到，页面内容并没有更新。

页H我要QBC3

回苜煲日公司介绍

国新闻中心回招士

国联泵的出版

QBD同版权信息

国首昱图国导航菜单

元件一旦与母版脱离关系，就变为普通的元件，这种方式常用于页面局部区域与母版不同，但绝大局部与母版一致的情况。这时就可以先引用母版，再脱离母版，最后自定义元件。

母版的3种拖放行为，即任何位置的拖放行为、锁定到母版中位置的行为、从母版脱离的拖放行为，前两种拖放行为会跟着母版的修改而发生变化，而最后一种从母版脱离后就不会随着母版的修改而发生变化。可以根据具体场合来选择3种拖放行为。

在前面的章节中，学习了母版功能的使用、制作母版的2种方式以及母版的3种拖放行为,Axure的母版区域是一个经常被用到的功能，它可以减少设计原型的工作量，提高工作效率，解决重复制作原型某个类似功能耗时耗力的问题。下面通过设计蓝月亮导航菜单母版，来看看母版在实际工程中是如何使用的。

蓝月亮门户

在页面区域的实例里，我们规划过它的栏目结构，它有6个一级导航菜单，包括首页、走进蓝月亮、清洁之家、科学洗涤、人力资源、联系我们。

首页、清洁之家、科学洗涤下没有二级菜单，走进蓝月亮下面有3个二级菜单：关于我们、