共用方式為


對話方塊和彈出視窗

對話框和飛出視窗是暫時性的 UI 元素,當發生需要使用者通知、核准或其他資訊的事件時會出現。

對話框

對話框的範例

對話方塊是模態 UI 覆蓋層,提供與應用程式相關的資訊。 對話方塊會封鎖與應用程式視窗的互動,直到手動關閉為止。 他們經常要求使用者執行某種動作。

快顯功能表

彈出選單的範例

飛出視窗是輕量型內容快顯視窗,可顯示與使用者正在執行的動作相關的 UI。 它包括放置和大小調整邏輯,可用來顯示次要控制項或顯示有關項目的更多詳細資訊。

與對話框不同,可以通過點擊或單擊彈出窗口外部的某個位置、按 Escape 鍵或返回按鈕、調整應用程序窗口大小或更改設備方向來快速關閉彈出窗口。

這是正確的控制嗎?

對話框和飛出視窗可確保使用者知道重要資訊,但也會中斷使用者體驗。 由於對話框是模態(阻擋),從而中斷使用者的操作,防止他們執行任何其他動作,直到使用者與之互動。 彈出視窗提供不那麼刺耳的體驗,但顯示太多彈出視窗可能會分散注意力。

一旦您確定要使用對話框或飛出視窗,就需要選擇要使用的對話框或飛出視窗。

鑑於對話方塊會封鎖互動,而飛出視窗則不會,因此您應該保留對話方塊,以供您想要使用者捨棄所有內容,以專注於特定資訊或回答問題的情況。 另一方面,當您想要引起對某事的注意時,可以使用彈出窗口,但如果用戶想要忽略它,也可以。

使用對話框來...

  • 表達用戶在繼續之前 必須 閱讀和確認的重要信息。 範例包括:
    • 當使用者的安全性可能受到威脅時
    • 當使用者即將永久變更有價值的資產時
    • 當使用者即將刪除有價值的資產時
    • 若要確認應用程式內購買
  • 套用至整體應用程式內容的錯誤訊息,例如連線錯誤。
  • 問題,當應用程式需要向使用者詢問封鎖問題時,例如當應用程式無法代表使用者選擇時。 封鎖問題無法忽略或延後,而且應該為使用者提供明確定義的選擇。

使用彈出視窗...

  • 收集完成動作之前所需的其他資訊。
  • 顯示僅在某些時候相關的信息。 例如,在相片庫應用程式中,當使用者按一下影像縮圖時,您可以使用飛出視窗來顯示影像的大型版本。
  • 顯示更多資訊,例如頁面上項目的詳細資料或較長的描述。

避免使用對話框和彈出視窗的方法

考慮您要分享的資訊的重要性:它是否重要到足以打斷使用者? 還要考慮需要顯示資訊的頻率;如果您每隔幾分鐘顯示一次對話框或通知,您可能想要改為在主要 UI 中為這項資訊配置空間。 例如,在聊天用戶端中,與其每次朋友登入時都顯示飛出視窗,不如顯示目前在線上的朋友清單,並在朋友登入時對其進行醒目提示。

對話框經常用於在執行操作之前確認操作(例如刪除文件)。 如果您預期使用者會經常執行特定動作,請考慮提供一種方法,讓使用者在錯誤時復原動作,而不是強制使用者每次都確認動作。

範例

  • 如果您已安裝 WinUI 3 資源庫 應用程式,請按兩下此處開啟應用程式,並查看 ContentDialog飛出視窗 的運作方式。 從 Microsoft Store 取得應用程式,或在 GitHub 上取得原始程式碼。

如何建立對話方塊

請參閱 對話方塊一文

如何建立飛出視窗

請參閱 展開視窗文章