Windows UI 程式庫 2.6

  • 發行項

WinUI 2.6 是適用於 UWP 應用程式 (以及使用 XAML Islands 的桌面應用程式) 的 Windows UI 程式庫 (WinUI) 的 2021 年 6 月版本。

注意

如需使用最新版的 WinUI 3 來建置 Windows 桌面和 UWP 應用程式的詳細資訊，請參閱 Windows UI 程式庫 3。

Windows UI 程式庫 (WinUI) 裝載於 GitHub，我們建議您在此提交 Bug 報告、功能要求和社群代碼貢獻。

所有穩定版本 (和發行前版本) 都可從我們的 GitHub 發行頁面或從我們的 NuGet 頁面下載。

您可以透過 NuGet 套件管理員，將 WinUI 套件新增至 Visual Studio 專案。 如需詳細資訊，請參閱開始使用 Windows UI 2 程式庫。

WinUI 2.6 的新功能或更新功能包括：

Mica

Mica 是一種新材料，其中包含主題和桌面桌布，以繪製長時間執行視窗的背景，例如應用程式和設定。 您可以將 Mica 套用至應用程式背景，藉由提高焦點，讓使用者滿意並建立視覺階層、協助生產力。 Mica 專為應用程式效能而設計，因為只取樣桌面桌布一次，以建立其視覺效果。

Mica in light theme

使用方針

API 參考

展開工具

展開器控制項是由一律可見的主要內容標頭所組成，與用來顯示或隱藏包含標頭相關次要內容之可擴充內容區域的切換按鈕配對。

當使用者展開或摺疊內容區域時，相鄰 UI 元素會移位並調整以容納內容區域。 展開器的內容區域不會重疊這些元素。

這個動畫範例會以預設狀態顯示展開器，內容區域中只有基本文字。

Expander in the default state with basic text in the content area.

您可以在展開器的內容區域中使用複雜的互動式 UI，包括巢狀展開器控制項，如下所示。

Expander with complex, interactive UI in the content area.

使用方針

API 參考

BreadcrumbBar 是階層式導覽元素，可提供引領至使用者目前位置之頁面或資料夾連結的直接路徑。 在使用者瀏覽軌跡 (在檔案系統或功能表系統中) 需要持續顯示，並讓使用者能夠快速返回先前的位置時，通常會在頁面頂端附近使用。

這個動畫範例顯示具有八個瀏覽深度層級的預設狀態 BreadcrumbBar。

BreadcrumbBar in default state with eight levels of navigation depth.

如果應用程式調整大小，因此沒有足夠的空間顯示 BreadcrumbBar 中的所有層級，控制項會自動摺疊，並取代最左邊節點的省略符號。 按一下省略符號會開啟飛出視窗功能表，以階層式順序顯示摺疊的節點，如下所示。

BreadcrumbBar condensed with flyout menu.

使用方針

API 參考

ImageIcon

ImageIcon 新增使用 Image 控制項作為應用程式 UI 圖示的支援。

支援下列的影像檔案格式：

  • 點陣圖 (BMP)
  • 圖形交換格式 (GIF)
  • Joint Photographic Experts Group (JPEG)
  • Portable Network Graphics (PNG)
  • JPEG XR (WDP)
  • 標記的影像檔案格式 (TIFF)

API 參考

AnimatedIcon

AnimatedIcon 控制項會播放動畫影像，以回應使用者互動和視覺狀態變更，例如當使用者將滑鼠停留在按鈕上方或按一下按鈕時。

這個動畫範例顯示已新增至 NavigationViewItem 控制項的 AnimatedIcon。

AnimatedIcon added to a NavigationViewItem control.

定義動畫需要您建立或取得想要新增圖示的 Lottie 檔案 (您可以使用 Adobe AfterEffects 建立自訂動畫，並使用 Lottie-Windows 程式庫轉譯)，並透過 LottieGen 執行該檔案。 LottieGen 會為 C++/WinRT 類別產生程式碼，然後您可以具現化並搭配 AnimatedIcon 使用。

使用方針

API 參考

PipsPager

PipsPager 控制項可協助使用者使用可設定的圖像集合，在線性分頁的內容中瀏覽，每個圖像都代表可能無限範圍內的單一「頁面」。 圖像會醒目提示目前頁面，並指出先前和後續頁面的可用性。 控制項依賴目前的內容，不支援明確的頁碼或非線性組織。

此範例顯示預設狀態的 PipsPager，其中包含五個可見的 pip，水平方向，並且已選取第一個 pip。

A default PipsPager with five horizontal dots, and the first selected.

如果內容是由大量的頁面所組成，您可以設定可見的互動式 pip 數目。 如果頁面數目超過可見的 pip 數目，pip 會自動捲動以將控制項中選取的頁面置中。

這個動畫範例顯示具有大型項目集合水平捲動 pip 的 PipsPager。

PipsPager with horizontally scrolling pips for a large item collection.

使用方針

API 參考

視覺化樣式更新

大部分的 WinUI 控制項現在都支援最新的 Windows 11 樣式。

也引進了新的版本控制系統，可讓您還原為先前的控制項樣式。 不過，我們強烈建議盡可能使用新的樣式，因為它們符合 Windows 目前的設計方向。

XAML 樣式

CommandBar 的 SplitButton 樣式

新的 SplitButtonCommandBarStyle 可讓您將 AppBarButton 的外觀和風格套用至 SplitButton 控制項。

範例

提示

如需詳細資訊、設計指引和程式碼範例，請參閱設計和程式碼 Windows 應用程式。

WinUI 3 資源庫和 WinUI 2 資源庫應用程式包含大部分 WinUI 3 和 WinUI 2 控制項、特性和功能的互動式範例。

如果已安裝，請按一下下列連結加以開啟：WinUI 3 資源庫或 WinUI 2 資源庫。

如果未安裝，您可以從 Microsoft Store 下載 WinUI 3 資源庫和 WinUI 2 資源庫。

您也可以從 GitHub 取得這兩者的原始程式碼 (使用 WinUI 3 的主要 分支和 WinUI 2 的 winui2 分支)。

其他更新

  • 如需此版本中所解決的許多 GitHub 問題，請參閱我們的重大變更清單。
  • 請參閱 Figma 設計工具組以取得 WinUI 2.6 控制項和版面配置範本。