手把手教你Axure-布局篇

在上一篇文章中，對于原型的認(rèn)知，我已經(jīng)做了相關(guān)介紹。

接下來，我將會手把手教大家操作Axure。先說下我使用的版本：Axure 9，版本號是：9.0.0.3732

在這里，有一點大家需要特別注意，Axure是向下兼容的。簡單點說，就是RP9，可以打開和編輯RP8上創(chuàng)建的文件；但是RP8，是不能打開和編輯RP9上創(chuàng)建的文件的。

今天，就先從軟件的界面布局開始介紹吧。

總的來說，Axure一共分成4塊區(qū)域，分別為：工具欄、左側(cè)功能欄、中間操作區(qū)、右側(cè)功能欄。

一.基本說明

01.工具欄

簡單點理解，工具欄所承載的，就是最基礎(chǔ)的、最通用的那些操作。

更細一步劃分的話，可分成了上下兩個部分，上面的叫基本工具欄、下方的叫樣式工具。

顧名思義，上方控制的是基礎(chǔ)屬性，下方控制的是樣式屬性。

02.左側(cè)功能欄

簡單點理解，左側(cè)功能欄所承載的，是我們的頁面結(jié)構(gòu)和基礎(chǔ)元素。

更細一步劃分的話，可分為頁面、概要、元件、母版，四個模塊。

頁面：根據(jù)產(chǎn)品功能，定義不同頁面。

概要：可以看到每個當(dāng)前選中頁面中的不同的元素內(nèi)容。

元件：元件庫的管理，展現(xiàn)各種類型的元件。

母版：母版的管理。

03.中間操作區(qū)

這也是我們最常用的區(qū)域，基本上元件位置的擺放、頁面樣式的布局，都會在這個區(qū)域進行操作。

操作方式也很簡單，鼠標(biāo)按住左側(cè)元件庫中的元件，直接拖動到中間操作區(qū)域即可。

04.右側(cè)功能欄

這里的功能，主要是針對某一個具體元件的。也就是說，在我們選中了某個元件后，針對其設(shè)置具體的屬性值。

更細一步劃分的話，可分為樣式、交互、說明，三個模塊。

樣式：針對某個元件，設(shè)置相關(guān)樣式內(nèi)容。

交互：針對某個元件，設(shè)置相關(guān)交互內(nèi)容。

說明：選中某個元件，設(shè)置相關(guān)說明內(nèi)容。

二.相關(guān)設(shè)置

01.區(qū)域大小調(diào)整

現(xiàn)在支持左右功能欄的大小調(diào)整，一般情況下，我都是將最大的空間留給中間的操作區(qū)域，左右兩側(cè)功能欄只保留夠用的空間即可。

調(diào)整的方式也很簡單，只要將鼠標(biāo)放到左右功能欄和中間操作區(qū)域的連接處，鼠標(biāo)指針就會變成左右雙向的箭頭。在這樣的情況下，左右拖動就可以了。

按照自己平時的使用習(xí)慣，結(jié)合自己的電腦屏幕大小，調(diào)整到合適的寬度就可以了。

02.工具欄、左右功能欄的隱藏與顯示

所有的工具和功能，默認(rèn)都是顯示的。但有時候，為了方便操作，我們可以將不需要的區(qū)域進行隱藏。

工具欄的隱藏操作：視圖-工具欄，然后隱藏不要的工具欄即可。

功能欄的隱藏操作：視圖-功能區(qū)，然后隱藏不要的功能欄即可。

對功能欄的操作，不僅僅可以整體隱藏，還可以隱藏具體的某個模塊。

操作方式：視圖-功能區(qū)，然后隱藏不要的模塊即可。

對于已經(jīng)隱藏的工具和功能，如果想要再顯示的話，按照相同的操作方式，再勾選回來就可以了。

03.重置視圖

有時候，我們對相關(guān)區(qū)域進行了一系列操作，但使用起來發(fā)現(xiàn)并不是很順手，但是一個一個將它們調(diào)整回到原來的狀態(tài)又是十分麻煩的事情。

這時候，我們就可以使用重置視圖的功能。

顧名思義，就是將所有的功能區(qū)域恢復(fù)到最初始的狀態(tài)。

操作方式：視圖-重置視圖

以上，就是關(guān)于Axure布局的相關(guān)介紹，基本上涵蓋了我們?nèi)粘２僮鞯慕^大多數(shù)內(nèi)容。

另外，還有很多其他的，比如標(biāo)尺、輔助線等等內(nèi)容，會在后續(xù)的具體操作中穿插著介紹。

------------- End -------------

關(guān)注后，回復(fù)“PRD”，可免費獲取PRD模板。