原型設計工具Axure RP參考（十三）：動態面板小部件（上）

---

Axure RP是一套專門為網站或應用程序所設計的快速原型設計工具， 可以讓應用網站策劃人員或網站功能界面設計師更加快速方便的建立Web AP和Website的線框圖、流程圖、原型和規格。

免費下載Axure RP 優惠購買Axure RP

---

 動態面板是一個容器，用于將其他小部件保存在稱為“狀態”的集合中。動態面板可以具有一個或多個狀態，并且一次只能顯示其中一種狀態。可以使用“設置面板狀態”操作來動態設置可見狀態，這使動態面板非常適合創建輪播和幻燈片顯示。

動態面板是唯一的，因為它們是唯一可以在Web瀏覽器中拖動或滑動的窗口小部件類型。 它們也是唯一可以固定在瀏覽器窗口中固定位置的窗口小部件類型，使其成為始終可見的導航標題和側邊欄的理想選擇。（此為動態小部件的上部分，點擊此處查看下部分）

創建動態面板

從庫窗格中拖動

默認窗口小部件庫中有一個空的動態面板窗口小部件。 從“庫”窗格拖到畫布上的動態面板將以一個可以添加小部件的空狀態開始。

注意：該動態面板的尺寸默認情況下是固定的，因此，如果要自動調整其大小以適合其包含的小部件，請確保在其上啟用“適合內容”。

使用現有小部件創建

您可以使用畫布上已有的小部件創建新的動態面板。 選擇一個或多個窗口小部件，單擊鼠標右鍵，然后在上下文菜單中選擇“創建動態面板”。 這將創建一個新的適合內容的動態面板，其單個狀態包含所選小部件。

動態面板蒙版

動態面板默認情況下覆蓋有藍色蒙版，以使它們更容易在畫布上發現。 您可以在應用程序菜單的“視圖”→“蒙版”中切換蒙版。

注意：Web瀏覽器中未應用窗口小部件掩碼，包括動態面板掩碼。

管理狀態

在畫布上

雙擊畫布上的動態面板以進入狀態編輯模式，該狀態由藍綠色邊框和畫布周圍的工具欄指示。

在此模式下，您可以在動態面板的狀態下添加，刪除和編輯窗口小部件。 您還可以通過單擊畫布右上方的“隔離”來切換動態面板外部小部件的可見性。

要編輯動態面板狀態本身，請單擊畫布頂部的當前狀態名稱。 在顯示的下拉菜單中，您可以執行以下操作：

• 單擊州名以在畫布上查看其小部件
• 單擊州名稱右側的Duplicate State圖標，以復制該州名稱
• 單擊州名稱右側的Delete State圖標將其刪除
• 單擊下拉列表底部的添加狀態以創建新狀態
• 上下拖動狀態名稱以對其進行重新排序（最上面的狀態是默認情況下可見的狀態）

在大綱窗格中

在“概述”窗格中選擇一個動態面板狀態或其包含的小部件之一，以打開狀態以在畫布上進行編輯。要快速將現有窗口小部件移入或移出動態面板狀態，請將其拖動到“輪廓”窗格中。

要將新狀態添加到動態面板，請將鼠標懸停在其名稱上，然后單擊右側的“添加狀態”圖標。同樣，您可以通過將鼠標懸停在名稱上并單擊右側的“復制狀態”圖標來復制狀態。選擇一個狀態，然后按DELETE將其刪除，或者右鍵單擊并在上下文菜單中選擇“刪除”。

要重新排列動態面板的狀態，請上下拖動它們或右鍵單擊它們，然后使用上下文菜單中的選項。最高狀態是默認情況下可見的狀態。

提示：如果動態面板妨礙您與畫布上的其他小部件進行交互，則可以通過在“輪廓”窗格中單擊其名稱右側的“從視圖隱藏”圖標來暫時將其隱藏。這將在畫布上隱藏面板，但在Web瀏覽器中仍將可見。要再次顯示面板，請再次單擊該圖標。

第一個脫離

Break Away First State選項允許您刪除動態面板的第一個狀態，并將其包含的所有小部件放置在面板外部的畫布上。要訪問此選項，請在動態面板上單擊鼠標右鍵，然后在上下文菜單中選擇“第一個脫離”。

注意：如果動態面板只有一個狀態，則中斷該狀態也會刪除該面板。

本文是動態面板小部件的上部分，后面會持續更新下部分，希望持續關注本教程。

推薦閱讀：

原型設計工具Axure RP入門教程

原型設計工具Axure RP新手教程

關注慧聚IT微信公眾號???，了解產品的最新動態及最新資訊。