Axure的基本操作

來源：酷知科普網 6.01K

Axure RP是一個專業的快速原型設計工具。Axure（發音：Ack-sure），代表美國Axure公司；RP則是Rapid Prototyping（快速原型）的縮寫。下面就介紹一下Axure的基本操作。

操作方法

（01）首先下載軟體。

（02）接著點選安裝軟體。安裝步驟就是一直點下一步，這裡不多說了。

（03）安裝好後，開啟Axure。

（04）開啟後我們先認識一下介面。工具欄：類似office軟體，可以對字型大小、背景填充、圖形寬高以及位於工作區的位置（XY軸）進行修改；工作區：繪製產品原型的操作區域，所有的用到的元件都直接拖拽到裡面就好了。頁面導航：可以通過滑鼠拖動調整頁面順序以及頁面之間的關係，雙擊可以重新命名。部件庫：也叫元件庫或元件庫，所有軟體自帶的元件和載入的元件庫都在這裡，這裡可以執行建立、載入、刪除axure元件庫的操作，也可以根據需求顯示全部元件或某一元件庫的元件。大家可以點選放大鏡圖示，搜尋自己需要的部件。母版：這裡可以建立重複出現在每一個頁面的元素，這樣在製作時就不用再重複這些操作。通常用於頁面頭部、選單欄等的製作。頁面互動：這裡可以設定當前頁面的樣式，新增與該頁面有關的註釋，以及設定頁面載入時觸發的事件onpageload。部件互動：這裡可以設定選中元件的標籤、樣式，新增與該元件有關的註釋，以及設定頁面載入時觸發的事件。閃電樣式的小圖示代表互動事件。

（05）瞭解部件庫的使用是Axure的基礎，下面我們就來梳理一下Axure中的常用部件：

（06）Axure rp的線框圖元件：圖片圖片元件拖入編輯區後，可以通過雙擊選擇本地磁碟中的圖片，將圖片載入到編輯區，axure會自動提示將大圖片進行優化，以避免原型檔案過大；選擇圖片時可以選擇圖片原始大小，或保持圖片元件的大小。文字在網頁中文字的名稱是lable，用於頁面中新增說明文字、文字連線，或一些動態的提示。矩形矩形的應用比較廣泛，比如作為頁面的背景、按鈕、以及一些元件的遮蓋等；矩形的形狀可以通過滑鼠右鍵點選–編輯選項—改變形狀，來變成我們需要的形狀，比如做選項卡時候我們需要頂部圓角的矩形，就可以通過改變矩形的形狀來實現。佔位符製作原型時，可以用它來代替對一些沒有互動或者互動比較簡單容易說明的區域；也可以做成關閉按鈕。佔位符在保真比較高的產品原型中作用不大。圓角矩形因為圓角矩形應用廣泛，所以單獨拿出來作為元件給使用者，免去了對矩形的設定。動態面板非常重要的axure元件，必須要學會使用的元件，動態面板的顯示、隱藏、多狀態等，都是非常有用的。在這裡不過多介紹，詳細介紹請參考：小樓axure圖文教程（五）動態面板的使用。水平線就是一條水平的線，可以作為表示頁面一些區域分割時使用，比如在兩塊不同區域之間新增一條水平線，來明顯的區分。水平線可以通過設定元件屬性中的角度Rotº變成斜線來使用。垂直線沒什麼好說的，和水平線一樣的作用。圖片熱區用於點選圖片中某個區域產生互動事件時使用，圖片熱區也是矩形的一種，可以通過設定矩形無邊框，背景色100%透明度來實現。文字框（單行）用於輸入文字的axure元件，用於登入、標題、密碼框（滑鼠右鍵–編輯選項–隱藏文字）等功能。文字框（多行）從字面意思就知道了它的功能，用於實現更多文字內容輸入的axure元件，用於回覆、評論、微博釋出框這類的功能。下拉列表（框）滑鼠點選時展開多個選項的axure元件，主要用來類別選擇或多條件查詢效果時使用。列表框一個多選項的列表，帶滾動條效果，個人認為樣子很醜，應用不是很多，應用場景可以參考word自定義快速訪問工具欄中選擇新增項的效果。複選框複選框用於同類別內容可以同時選擇多個時候使用，比如註冊時候個人興趣的選擇，又比如批量刪除郵件時選擇多個郵件的功能。單選按鈕多個選項僅能選擇其一時候使用，比如性別選擇。多個單選按鈕聯動效果需要同時選中多個需要聯動的單選按鈕—滑鼠右鍵—編輯選項–指定單選按鈕組來實現。不嫌麻煩的話也可以通過設定每個單選按鈕的onclick事件來實現。內部框架用於在頁面中嵌入其他頁面的axure元件，可以設定好大小後雙擊它，指定要嵌入的頁面。框架可以通過編輯選項取消滾動條，應用場景多見於網站後臺原型和移動網際網路產品原型。表格表格很常見，就不多做解釋，每個表格都可以設定單獨的事件，但是axure還不支援單元格的合併。選單縱向主要用於網站導航。多使用於網站後臺。選單橫向主要用於網站導航，多使用於網站前臺。樹主要用於網站導航。多使用於網站後臺。

（07）Axure rp元件的觸發事件：OnClick（點選時）: 滑鼠點選事件，除了動態面板的所有的其他元件的點選時觸發。比如點選按鈕。OnMouseEnter（滑鼠移入時）: 滑鼠進入到某個元件範圍時觸發，比如當滑鼠移到某張圖片時顯示該圖片的介紹。OnMouseOut（滑鼠移出時）: 滑鼠離開某個元件範圍時觸發。比如滑鼠離開圖片時，圖片介紹消失。OnKeyUp（按鍵彈起時）: 文字框（單行與多行）編輯時，鍵盤按下某一個按鍵鬆開時觸發，不支援其他axure元件。比如統計文字框輸入的字數。OnFocus（獲取焦點時）: 當一個元件通過點選或切換獲取焦點時觸發。比如搜尋框編輯時，清空“請輸入關鍵字”的提示。OnLostFocus（失去焦點時）: 當一個元件失去焦點時觸發。比如使用者名稱、密碼的驗證。OnChange（選中項改變時）:下拉列表框或列表框的選中項改變時觸發，不支援其他元件。比如選擇地址時，選擇不同的省份，顯示對應的省內城市。OnMove（移動時）：當動態面板移動時觸發。是指通過其他事件的觸發控制面板移動時，比如當進度條移動時，進度比例的變化。The OnShow and OnHide events（顯示或隱藏時）：當動態面板隱藏或顯示時觸發。比如圖片顯示時按鈕文字是關閉圖片，圖片隱藏時按鈕文字變為開啟圖片。OnPanelStateChange（狀態改變時）：當動態面板更改面板的狀態時觸發。OnDragStart: Occurs when the drag begins（開始拖動面板時）：當開始拖動動態面板時觸發。比如在動態面板拖動開始時，顯示“拖動開始”的文字提示。OnDrag: Occurs as the panel is dragged（面板拖動時）：動態面板拖動時觸發，比如拖動一塊動態面板另外一塊跟隨移動。OnDragDrop: Occurs when the panel is dropped（面板拖動結束時）：當拖拽結束時觸發。比如滑動解鎖，面板拖動結束時根據滑塊的位置設定相應的效果。

（08）新增元件到畫布：在左側元件庫中選擇要使用的元件，按住滑鼠左鍵不放，拖動到畫布適合的位置上鬆開。