合理地使用母版進(jìn)行模塊化設(shè)計(jì)，會(huì)使你的原型制作事半功倍。

Axure原型的制作過(guò)程中，你一定遇到過(guò)這樣的問(wèn)題，出現(xiàn)在不同頁(yè)面的功能模塊，如果你是通過(guò)復(fù)制粘貼來(lái)完成的，那么當(dāng)該模塊發(fā)生變動(dòng)需要修改時(shí)，麻煩就大了，個(gè)個(gè)需要改，可能改的不一致，也有可能會(huì)漏改，以至于辛辛苦苦改了半天，一演示，看到的是沒(méi)有改過(guò)的舊版，表示很心痛。

此時(shí)，就該母版發(fā)揮作用了，合理地使用母版進(jìn)行模塊化設(shè)計(jì)，會(huì)使你的原型制作事半功倍。

針對(duì)母版如何高效使用，下面進(jìn)行較詳細(xì)的說(shuō)明：

一、母版的作用

減少重復(fù)工作，提高制作效率；

統(tǒng)一修改維護(hù)，提高中途修改效率；

共用資源，提高原型運(yùn)行效率。

二、模板的基本操作

母版窗口位于軟件工作環(huán)境的左下角，基本操作同其他功能一樣：

新建，窗口頂部的添加按鈕可以添加，也可以把頁(yè)面中已經(jīng)做好的模塊選中后，通過(guò)右鍵轉(zhuǎn)換為母版；

刪除，母版窗口中，選中母版后按delete鍵刪除，或者右鍵菜單刪除；

重命名，選中母版后，再次點(diǎn)擊可對(duì)母版名稱(chēng)進(jìn)行修改，或者右鍵菜單重命名；

編輯，母版窗口中，雙擊母版，主窗口打開(kāi)母版頁(yè)面進(jìn)行編輯，或者在有使用母版的頁(yè)面中雙擊母版，打開(kāi)母版頁(yè)面進(jìn)行編輯；

新建文件夾，窗口頂部的新建文件夾按鈕，或者右鍵菜單中新建選項(xiàng)；

對(duì)母版進(jìn)行組織管理，直接在窗口中拖動(dòng)母版調(diào)整母版順序活層級(jí)關(guān)系，或者通過(guò)右鍵菜單“移動(dòng)”選項(xiàng)進(jìn)行調(diào)整；

添加到多個(gè)頁(yè)面，通過(guò)右鍵菜單添加到多個(gè)頁(yè)面選項(xiàng)（Add to Pages），可以選擇要添加到的頁(yè)面，并可以設(shè)定添加到頁(yè)面的位置；

從多個(gè)頁(yè)面中刪除，右鍵菜單操作，這個(gè)值得一提的是，當(dāng)母版已經(jīng)被頁(yè)面使用時(shí)，是無(wú)法被刪除的，需要先從頁(yè)面中刪除母版，此時(shí)可以用到這個(gè)功能，進(jìn)行一次性刪除；

三、模板的導(dǎo)入功能

當(dāng)一個(gè)新的文件想要使用現(xiàn)有文件中的母板時(shí)，可以通過(guò)新文件的導(dǎo)入功能，將文件中的母版導(dǎo)入新文件。具體操作步驟：

菜單“文件”→“從RP文件導(dǎo)入”→ 選擇目標(biāo)文件 → 跳過(guò)“頁(yè)面導(dǎo)入”步驟 → 選擇要導(dǎo)入的目標(biāo)母版 → 確定導(dǎo)入動(dòng)作（add/action）→跳過(guò)其他導(dǎo)入選項(xiàng)（導(dǎo)入自適應(yīng)視圖 、導(dǎo)入配置文件、導(dǎo)入頁(yè)面說(shuō)明字段 、導(dǎo)入元件說(shuō)明字段 、導(dǎo)入頁(yè)面樣式、導(dǎo)入元件樣式、導(dǎo)入變量、導(dǎo)入?yún)⒖季€）

這樣，新文件的母版窗口就會(huì)出現(xiàn)導(dǎo)入的母版，從而可以在新文件中使用。

母版在原始文件中更新后，一定要通過(guò)“導(dǎo)入”功能，并在導(dǎo)入行為中選擇 “replace”，將更新后的母版導(dǎo)入，這樣新文件中的母版才會(huì)更新，頁(yè)面使用到母版的地方才會(huì)同時(shí)更新。

另外，在首次導(dǎo)入母版時(shí)，可以在原文件的頁(yè)面中復(fù)制該母版粘貼在新文件的頁(yè)面中，這樣，所用到的母版就會(huì)出現(xiàn)在新文件的母版窗口。這種方式快捷，但是只適用于添加新母版，母版更新無(wú)法通過(guò)復(fù)制粘貼來(lái)實(shí)現(xiàn)。

四、母版的拖放行為

1、給母版設(shè)置的不同拖放行為，會(huì)使母版具有不同的特性：

（1）Palce Anywhere

普通母版，可拖放在頁(yè)面的任何位置，統(tǒng)一修改維護(hù)，母板有更新，所有用到該母版的頁(yè)面都會(huì)更新；

（2）LOCKED TO MASTER LOCATION

固定位置母版，在頁(yè)面中的位置固定，統(tǒng)一修改維護(hù)，母板有更新，所有用到該母版的頁(yè)面都會(huì)更新，包括母版位置的更新也會(huì)在所有頁(yè)面中更新；

（3）BREAK AWAY

母版被拖入到頁(yè)面中后，即與原母版脫離關(guān)系，可在頁(yè)面中進(jìn)行修改，而不影響母版本身，母版的修改更新也不會(huì)影響到之前使用過(guò)該母版的頁(yè)面；

2、設(shè)置母版拖放行為的方法

（1） 母版窗口中，母版的右鍵菜單→放置行為（Drop behavior）；

（2）通過(guò)頁(yè)面中已有元件，轉(zhuǎn)換為母版時(shí)，選擇放置行為（Drop behavior）；

五、母版的觸發(fā)事件

母版內(nèi)的元件事件（events）是不能對(duì)母版外的其他元件執(zhí)行動(dòng)作（action）的；當(dāng)你想通過(guò)母版內(nèi)的元件控制母版外元件時(shí)，你會(huì)發(fā)現(xiàn)找不到外部元件，而當(dāng)你在頁(yè)面中使用母版時(shí)，也會(huì)發(fā)現(xiàn)母版沒(méi)有事件。細(xì)想一下可以理解，一個(gè)母版會(huì)被多個(gè)頁(yè)面使用，那么如果母版內(nèi)的元件可以控制母版外元件時(shí)，頁(yè)面中使用到母版的地方所對(duì)應(yīng)的動(dòng)作也應(yīng)該都是一樣的，但這樣的情況時(shí)很少見(jiàn)的。

除此之外，Axure中的事件邏輯是同一個(gè)頁(yè)面內(nèi)的元件才可以互相控制，跨頁(yè)面需要通過(guò)中間變量和中間事件來(lái)轉(zhuǎn)換才能達(dá)到跨頁(yè)面控制的效果。而母版本身不屬于哪個(gè)頁(yè)面，又同時(shí)會(huì)被多個(gè)頁(yè)面使用，如果母版內(nèi)的元件能夠控制母版外的元件，那就與這個(gè)邏輯相違背了。

不管上面的解釋有沒(méi)有看明白，我們只要知道一點(diǎn)，母版內(nèi)的元件事件觸發(fā)不了控制母版外的元件的動(dòng)作。在頁(yè)面中，母版是一個(gè)整體，想要使用母版的事件，需要先對(duì)母版觸發(fā)事件（Raised events）進(jìn)行管理。

1. 管理母版觸發(fā)事件

所謂管理母版觸發(fā)事件，就是為母版新增/刪除事件，同時(shí)將母版事件與模板內(nèi)的元件事件相關(guān)聯(lián)，具體操作如下：

方法一：雙擊打開(kāi)母版的情況下（也就是在母版內(nèi)部），通過(guò)菜單“布局（Arrange）”→“管理觸發(fā)事件”，在打開(kāi)窗口中，可對(duì)母版的觸發(fā)事件進(jìn)行添加、刪除、移動(dòng)等操作；

方法二：在母版中選中某個(gè)元件，選擇任意事件后，在動(dòng)作（action）窗口中，也可對(duì)觸發(fā)事件進(jìn)行新增、刪除、移動(dòng)操作（這個(gè)窗口主要用來(lái)執(zhí)行第2步，關(guān)聯(lián)觸發(fā)事件，見(jiàn)下圖）。

2. 關(guān)聯(lián)母版的觸發(fā)事件到元件事件

本步操作就是將母版內(nèi)元件的事件與母版的觸發(fā)事件關(guān)聯(lián)起來(lái)，例如，給母版定義了A、B、C三個(gè)事件，那么預(yù)覽時(shí)是哪個(gè)元件的什么事件才能觸發(fā)母版事件觸發(fā)的動(dòng)作，就從這一步來(lái)完成，具體操作：在母版中選中某個(gè)元件，選擇想要的元件事件，在動(dòng)作（action）窗口中，選擇“Raised event”，在右側(cè)窗口中勾選需要關(guān)聯(lián)的母版事件。

因此，一個(gè)元件事件可以關(guān)聯(lián)多個(gè)母版事件，在預(yù)覽時(shí)，這個(gè)元件事件可以觸發(fā)該母版事件相關(guān)的動(dòng)作（action）（在頁(yè)面中針對(duì)母版事件設(shè)置的動(dòng)作）；多個(gè)元件事件也可以關(guān)聯(lián)到同一個(gè)母版事件，這樣在預(yù)覽時(shí)，這幾個(gè)元件事件任何一個(gè)事件發(fā)生，都會(huì)觸發(fā)該母版事件相關(guān)的動(dòng)作（action）（在頁(yè)面中針對(duì)母版事件設(shè)置的動(dòng)作）。

3. 設(shè)置母版事件的關(guān)聯(lián)動(dòng)作

本步驟操作是將母版事件與頁(yè)面中其他元件關(guān)聯(lián)起來(lái)，實(shí)現(xiàn)母版內(nèi)元件對(duì)頁(yè)面中元件的控制。具體操作是，在頁(yè)面中選中母版，右側(cè)屬性窗口會(huì)出現(xiàn)母版事件（第1步中定義的母版事件），雙擊母版事件（同元件事件的使用方法），給母版事件設(shè)置相關(guān)的動(dòng)作（action）。

通過(guò)以上三個(gè)步驟，我們就把母版中的元件事件（event）與針對(duì)頁(yè)面中的元件需要執(zhí)行的動(dòng)作（action）關(guān)聯(lián)了起來(lái)。而母版事件，起到一個(gè)銜接作用。

作者：Petrel（UXRen社區(qū)Axure金牌講師，資深交互設(shè)計(jì)師）

本文由 @Petrel 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。