天天看點

Axure RP 入門 - 下士聞道

Axure RP 入門

Axure RP Pro是畫原型的工具,以着WinForm的方式搭建頁面,可以生成HTML,而且支援事件相應。

1. Wireframe

線框,我們打開一個RP,建立一個Page後,其實就是建立了一個WireFrame,他是一個容器,裡面可以承載各種控件。

2. Grid

網格,網格其實定義的是控件拖拽過程中所能移動的最小單元大小。設定:wireframe-> Grid…

3. Dynamic Panel Manager

動态面闆管理,View菜單下即可見。

4. Location and Size

用于設定widgets的位置和大小(一種比手工拖拽更精細的操作方式)。

Axure RP 入門 - 下士聞道

5. Button Shape

Axure RP 入門 - 下士聞道

一個非常靈活的Button控件,初始拖拽一個shape後,可以指定懸停的時候(右鍵->Edit Button Shape->Edit RollOverStyle),滑鼠按下的時候的樣式等。

6. 通過工具欄的位置(對齊)工具調整widget位置

Axure RP 入門 - 下士聞道

倒數第二個是“Distribute Horizontally”,這個位置工具是根據水準線上面的左右兩邊控件的距離作為總長度來計算期間所有控件的水準間距。

7. Master

Master是一個MasterPage以及UserControl的作用,可以将一組控件進行重用,包括你可以指定Master所在頁面的位置,還可以定義他們的動作(行為),比如跳轉連結。這裡我做的Demo是四個按鈕,作為頁頭的跳轉連結,定位到各個指定頁面。

a. Master的類型:預設master分派給了頁面後,他的類型就是“Place in background”,這種行為類似于ASP.NET中的Master Page,所定義的控件位置都是不可變的,不可拖拽的,另外一種類型就是userControl的類型,在配置設定了頁面中,右鍵Master控件->Master->Remove from background,即實作了Master空間組可以被拖拽到其他位置,如果想要在恢複到Master Page類型,右鍵Master控件->Master->Place in background。

b. 指定位置:選中了四個按鈕,然後在Selected Widgets中設定left和top屬性,實作定位。首先注意需要在View菜單中打開Location and Size面闆,其次是注意要設定的是Selected Widgets,而不是“Each Selected Widget”,最後,為了防止控件被意外拖到,可以将選中控件Group并且鎖住。選中->右鍵->Grouping/Locing->…
Axure RP 入門 - 下士聞道

c. 配置設定頁面

建立了Master之後就是配置設定到指定的頁面中去顯示。在Master面闆中右鍵指定的Master->Add to Pages…

Axure RP 入門 - 下士聞道
Axure RP 入門 - 下士聞道

8. 綁定事件

Axure RP 入門 - 下士聞道

比如拖拽一個Button Shape控件,Button中定義了事件OnClick,(所有的)事件中有RP預先定義的一下動作(Action),動作是指定對某個控件/變量的特定操作,比如隐藏(顯示)控件,禁用(可用)控件,指派控件等等,選擇一個或多個動作和OnClick綁定,選擇的動作,下一個就是綁定動作對象,就此完成了一個事件相應的動作綁定。

Axure RP 入門 - 下士聞道