学习【AxureRP9萌新修炼手册V2.2】笔记
目錄
?
有用連接
一、基本操作?(Axure RP9)
(一)畫布操作?
(二)元件操作?
二、元件庫?
(一)圖標元件庫(Icons)
(二)流程元件庫(Flow)?
?? ?1、連線的操作
?? ?2、連線的樣式?
?? ?3、元件的含義??
(三) 默認元件庫(Default)?
?? ?1、基本元件?
?? ?2、表單元件?
?? ?3、菜單表格元件?
?? ?4、標記元件?
有用連接
- Axure RP 9 軟件官網下載地址:https://www.axure.com/download?
- Axure RP 9 漢化文件下載地址:http://chanpinban.com/downloads/?
- AI研習社 https://ai.yanxishe.com/
- 獲取原型頁面尺寸的功能 http://chanpinban.com/get_dp/
- 阿里巴巴矢量圖標庫 http://iconfont.cn/
一、基本操作?(Axure RP9)
繪制線框草圖之前,我們先對一些基本操作進行了解。?
(一)畫布操作?
?? ?打開畫布:在頁面模塊中,雙擊任何一個頁面,都可以打開相應的畫布,同時畫布區域上方出現對應的標簽。?
?? ?關閉畫布:點擊標簽上的關閉按鈕,或者在畫布標簽上點擊鼠標右鍵,通過在菜單中選擇相應的關閉選項完成操作。?
?? ?畫布排序:通過鼠標拖動畫布標簽進行排序。?
?? ?恢復原位:點擊畫布左上角的準星圖標或者快捷鍵<Ctrl+9>鍵,即可讓畫布回到原點。?
?? ?移動畫布:通過滾動條移動畫布;或者,按住<空格>鍵不放,畫布中的鼠標指針變為抓手形狀,此時即可拖動畫布進行移動;也可以通過鼠標滾輪垂直方向移動畫布,按住<Shift>鍵不放,通過鼠標滾輪水平方向移動畫布。?
?? ?縮放畫布:在工具欄中通過改變顯示比例縮放畫布,或者按住<Ctrl>鍵不放,通過鼠標滾輪改變畫布顯示比例。
(二)元件操作?
?? ?使用:如果想使用某個元件,我們只需要將它從元件庫中拖入畫布擺放即可。?
?? ?對齊:默認情況下,兩個矩形元件并排擺放,中間的邊框為兩條邊框的寬度,如果想保持一條邊框的寬度,需要在【偏好設置】中,進行【元件對齊】的設置(見第一章第四節)。?
?? ?旋轉:元件的旋轉可以通過按下<Ctrl>鍵的同時,拉動元件任意一個邊界點來實現。旋轉之后,可以通過右鍵菜單【變換形狀】-【重置文本到 0°】?
?? ?圓角:矩形元件可以編輯圓角,通過鼠標指針拖動矩形左上方的小三角形圖標即可改變圓角的大小。?
?? ?改變形狀:形狀類元件都可以通過點擊鼠標右鍵,在菜單中通過【選擇形狀】將當前形狀改變為其他形狀。?
?? ?改變尺寸:可以通過鼠標指針拖動元件的邊界點任意改變
?? ?元件的尺寸;也可以按住<Shift>不放,同時鼠標指針拖動元件邊界點等比改變元件的尺寸。?
?? ?復制元件:通過鼠標右鍵菜單的【復制】與【粘貼】,或者使用通用快捷鍵<Ctrl+C>鍵與<Ctrl+V>鍵可以完成畫布間或者軟件間的復制粘貼操作;同一畫布中,可以通過<Ctrl+D>鍵進行復制;或者,按住<Ctrl>鍵不放,拖動元件到新的位置松開,完成復制與擺放的操作。?
?? ?編輯文字:部分元件可以添加文字內容。在未開啟單鍵快捷鍵功能時,直接輸入即可替換當前文字內容;開啟單鍵快捷鍵功能時,需要雙擊元件或者在元件上點擊按下回車鍵進入文字編輯狀態。
二、元件庫?
軟件自帶了三個官方元件庫,分別是默認元件庫(Default)、流程元件庫(Flow)和圖標元件庫(Icons)。
(一)圖標元件庫(Icons)
?? ?那么,這里的圖標如何在 Axure使用呢??
?? ??? ?將鼠標指針移入圖標,會出現三個按鈕,分別是添加添加入庫、收藏以及下載圖標。?
?? ??? ?點擊下載,就會出現編輯圖標顏色以及不同格式的下載鏈接。
?? ??? ?我們無需在這里編輯顏色,只需要點擊【SVG 下載】按鈕下載圖標即可。?
?? ??? ?下載下來的 SVG 文件,可以拖入 AxureRP9 的畫布中;或者,先從默認元件庫中拖入圖片元件,雙擊導入 SVG 文件。?
?? ??? ?然后,在圖標上點擊鼠標右鍵,上下文菜單的【變換圖片】選項中選擇【轉換 SVG 圖片為形狀】。?
?? ??? ?此時的圖標就變成了和 Icons 元件庫中一樣的形狀圖標,可以自由更改顏色和形狀編輯
(二)流程元件庫(Flow)?
流程元件庫中包含了一些繪制流程圖的元件。 我們只需要將這些元件拖入到畫布,并添加連接線,即可進行流程圖的繪制。?
?? ?1、連線的操作
?? ??? ?點擊工具欄中的“連接”圖標就會進入連線模式。
?? ??? ?一般元件都會有四個“×”連接點。我們在起始元件的連接點上按下鼠標左鍵拖動,到結束元件的連接點上松開,即可完成連線的操作。
?? ?2、連線的樣式?
? ? ? ?連接線的線段顏色、類型、線寬以及箭頭樣式可以在工具欄中進行設置。
?? ??? ?另外,在樣式模塊中也有關于連線的樣式設置。
?? ?3、元件的含義??
? ? ? 流程圖元件庫中有一部分元件,通過名稱即可了解含義。?
(三) 默認元件庫(Default)?
這個元件庫是最常用的元件庫,包含了 4個分類。 分別是:基本元件、表單元件、菜單表格元件和標記元件。
?? ?1、基本元件?
?? ?基本元件中包含了常用的形狀、圖片、線段以及文本類型的元件。 還有一些具有特別用途的元件,包括熱區、內聯框架、動態面板以及中繼器。?
?? ??? ?(1)形狀?
?? ??? ?形狀元件包含了多個預設樣式,矩形、圓形、占位符以及按鈕,它們之間通過樣式的更改可以互相轉換。我們還可以通過在元件上點擊鼠標右鍵,通過菜單中的【選擇形狀】,讓矩形變為圓形或占位符。?
?? ??? ?另外,形狀元件還可以通過上下文菜單【變換形狀】選項中的【轉換為圖片】,將形狀元件轉換為圖片元件。 在Axure RP 9中,我們還可以為形狀添加背景圖片。形狀元件一般用于頁面中的背景、邊框、按鈕、分割線等。?
?? ??? ?(2)圖片?
?? ??? ?圖片元件拖入畫布后可以表示一張圖片,也可以通過雙擊元件,導入本地的圖片素材。?
?? ??? ?如果需要批量添加圖片,可以通過多選本地磁盤中的圖片素材文件并拖入的方式添加到 Axure RP 9 的畫布中。
?? ??? ?【提示】圖片可以添加文字內容,需要在元件上點擊鼠標右鍵,從菜單中選擇【編輯文本】進入文字編輯狀態。
?? ??? ?(3)文本?
?? ??? ?文本元件包括文本標簽、文本段落、一級標題、二級標題和三級標題,用來表示頁面中的一些文字內容。
?? ??? ?實際上文本元件也是形狀元件,給文本元件添加邊框,就變成了矩形元件。?
?? ??? ?(4)熱區?
?? ??? ?熱區元件是一個透明元件,并且不可編輯文字。它的透明特性,讓我們可以將它覆蓋在其他元件上實現一些交互的需求,也可以用來做頁面滾動的定位。?
?? ??? ?(5)內聯框架?
?? ??? ?內聯框架用于向頁面中嵌入內容,包括:?
?? ??? ??? ? 項目中的其他頁面?
?? ??? ??? ? URL 指向的外部頁面?
?? ??? ??? ? 瀏覽器支持播放的多媒體文件(mp3、mp4、avi、pdf 等類型的文件)。
?? ??? ?(6)動態面板?
?? ??? ?動態面板是一個允許添加多狀態(層)的容器元件。?
?? ??? ?動態面板默認只有一個狀態(層),可以根據需求添加多個狀態(層)。?
?? ??? ?并且,在每一個狀態(層)中都可以放入一個或多個元件(包括其他動態面板)。?
?? ??? ?(7)中繼器?
?? ??? ?中繼器是一個模擬列表的元件,例如商品列表、郵件列表、用戶列表和標簽列表等。并且,中繼器可以通過添加交互模擬對列表項的添加、刪除、更新、排序以及篩選的操作
?? ?2、表單元件?
?? ?表單是需要用戶填寫的,所以表單元件都是用于獲取用戶輸入數據的元件。
?? ??? ?(1)文本框
?? ??? ?用于輸入一行文字內容。 比較常見的使用場景是用戶登錄功能中用戶名與密碼的輸入框。
?? ??? ??
?? ??? ?(2)文本域?
?? ??? ?文本域,也叫多行文本框,用于大量文字段落的輸入。
?? ??? ?(3)下拉列表?
?? ??? ?用于多個選項的單項選擇,往往也會有多個下拉
?? ??? ?列表聯合選擇的出現。?
?? ??? ??
?? ??? ?(4)列表框
?? ??? ?直接呈現選項的選擇框,可以支持單選或多選。
?? ??? ?注意:列表框元件與文本域元件在畫布中外觀一樣,就像女裝大佬,雖然長得像女人,但是功能不一樣。在交互功能面板中會顯示元件的類型,注意分辨
?? ??? ?(5)單選按鈕?
?? ??? ?用于多個選項的單項選擇,有些時候可以用下拉列表替代。?
?? ??? ?(6)復選框?
?? ??? ?用于一個或多個選項的選擇,可以選中和取消選中狀態。?
?? ?3、菜單表格元件?
?? ?菜單和表格元件都是繪制線框圖的元件,方便易用。但是,因為樣式編輯受限,所以高保真原型中很少使用。這些元件在畫布中的很多操作基本通過右鍵菜單中完成,例如:行、列、節點、菜單項的添加、刪除、移動等操作。?
?? ?4、標記元件?
?? ?快照元件可以通過雙擊設置引用頁面,呈現被引用頁面的圖像。 它結合連線和其他標記元件非常適合進行項目、頁面以及模塊的注釋
?? ?說明。除了快照元件以外的標記元件都是預設了樣式的形狀元件。 【提示】關于標記元件的詳細介紹與示例在產品原型應用部分有具體
?? ?的介紹與示例。?
總結
以上是生活随笔為你收集整理的学习【AxureRP9萌新修炼手册V2.2】笔记的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 华为p30的android版本,华为P3
- 下一篇: python实现scrapy爬虫每天定时