Axure RP - 條件邏輯

本章將討論 Axure RP 中使用的條件邏輯。

Axure 中的 If-Then-Else

與其他任何程式設計工具一樣，Axure 也支援條件邏輯來建立原型中增強的互動。一旦您熟悉如何提供互動，為互動提供條件邏輯就是下一個層次。

以下是條件邏輯的簡單簡潔流程：

為了更好地理解這一點，讓我們從之前的示例繼續我們的流程。為此，我們需要熟悉條件構建器。

雙擊任何互動，例如 OnClick。您將能夠看到如下螢幕截圖所示的案例編輯器。

單擊“新增條件”按鈕（位於“案例名稱”附近）。它將顯示在下面的對話方塊中。

如“描述”下所示，條件構建器將根據在條件部分中選擇的條件建立 If-Then-Else 流程。

讓我們在這個按鈕上建立一個條件。

我們希望在動態面板可見後顯示隱藏影像按鈕。我們在前面的示例中單擊“顯示影像”按鈕使動態面板可見。現在，讓我們使另一個按鈕“隱藏影像”可見。

關閉條件構建器，返回設計區域。

從“常用庫”下的庫中插入“隱藏影像”按鈕。需要重申的是，最好在將 UI 元素插入設計區域後立即對其命名。

右鍵單擊“隱藏影像”按鈕，然後單擊“設定為隱藏”。該按鈕將從設計區域隱藏，如下面的螢幕截圖所示。

現在，讓我們回到“顯示影像”按鈕的互動。

首先，在“顯示影像”按鈕互動下，雙擊“案例 1”，您將能夠看到案例編輯器。使用“顯示/隱藏”操作，選擇 hideImageButton 並將其可見性設定為顯示。

同樣，使用“顯示/隱藏”操作，選擇 showImageButton 並將其可見性設定為隱藏。

我們已經管理了“隱藏影像”按鈕的可見性，以便當我們單擊“顯示影像”按鈕時，該按鈕將顯示。

完整的條件將如下面的螢幕截圖所示。

讓我們構建條件。

在設計區域下，單擊“隱藏影像”按鈕。在“檢查器”部分，單擊“新增案例”。

在“新增案例”下，單擊“新增條件”按鈕。根據前面提供的背景，使用條件構建器中的下拉值建立條件集。

簡單來說，透過上述條件，我們正在檢查動態面板 showImageDynamicPanel 是否可見。

現在，讓我們設計“隱藏影像”按鈕的互動，配置如下：

同樣，對顯示 showImageButton 和隱藏 hideImageButton 重複此操作。

完成後，單擊“確定”關閉案例編輯器。

然後，單擊“預覽”檢視所做的更改。

成功的結果將如下面的螢幕截圖所示。

單擊“顯示影像”按鈕時：

單擊“隱藏影像”按鈕時：

列印頁面