設計 Windows 應用程式的工具組和範例

Fluent 設計/Windows 應用程式的設計與 UI 相關下載。 如需其他工具 (例如 Visual Studio),請參閱我們的主要下載頁面

工具組和程式庫

Figma 工具組圖示Figma Toolkit
WinAppSDK 1.1,2022 年 10 月的 WinUI 3
下載

WinUI 程式庫縮圖Windows UI 程式庫
用於 Windows 應用程式的控制項和其他 UI 元素。
安裝指示

Windows 社群縮圖 Windows社群工具組
Helper 函式、自訂控制項和應用程式服務。
安裝指示

Template Studio縮圖Template Studio
使用精靈型 UI 快速建構應用程式。
安裝指示

從 Microsoft Store 取得WinUI 資源庫應用程式,以查看 XAML 控制項和作用中的Fluent Design 系統。 WinUI 3 資源庫WinUI 2 資源庫應用程式包含大部分 WinUI 3 和 WinUI 2 控制項、功能和功能的互動式範例。 應用程式是此網站的互動式隨附專案。 當您安裝它們時,您可以使用個別控制項頁面上的連結來啟動應用程式,並查看控制項的運作情形。

字型

工具

下載磚與圖示產生器

適用於 Adobe Photoshop 的磚與圖示產生器:這組適用於 Adobe Photoshop 的巨集指令,只需 7 個檔案就能夠產生 68 個建議的磚和圖示資產。
下載磚與圖示產生器

範例

Fluent XAML 主題編輯器影像 FluentXAML 主題編輯器
Fluent XAML 佈景主題編輯器這項工具可為 Windows 應用程式中使用的 ResourceDictionary 架構產生 XAML 標記,而協助您展現 Fluent Design 系統的彈性及支援應用程式開發程序。 下載工具範例
查看 Github 上的工具

VanArsdel 影像 VanArsdel
Van Arsdel, Ltd. 端對端 Windows 範例應用程式可用來展示新一代的 Microsoft Fluent Design 系統。 它廣泛使用 Windows UI 程式庫中 的改良密度和新控制項,以及 UX 架構和組合的強大基礎功能。 此範例會示範如何建置豐富、具生產力的體驗來管理及購買 IoT 裝置 (在此範例中為燈光)。
下載 VanArsdel 範例
查看 GitHub 上的 VanArsdel 範例

組建轉換映射 BuildCast
BuildCast 是一個用來展示 Fluent Design 系統和 Windows 的端對端範例。 它允許流覽、下載及播放選取的視訊播客,包括一些 Windows 技術愛好者摘要。 它也具備 Ink Notes、書籤和遠端播放。 此範例最初呈現於 Build 2017 會議的運用 Fluent 設計建置令人驚豔的應用程式討論中。
下載 BuildCast 範例
查看 GitHub 上的 BuildCast 範例

午餐排程器午餐排程器
排程與朋友和同事共用午餐的 Windows 範例。 您建立午餐約會、邀請朋友前往感興趣的餐廳,接下來應用程式會負責所有受邀對象的午餐管理。 此應用程式在 Windows 應用程式中納入 Fluent 設計系統元素,包括壓克力風格、顯色和連接動畫。
下載午餐排程器範例
查看 GitHub 上的午餐排程器範例

想要更多程式碼嗎?

瀏覽 Windows 範本頁面取得所有我們的 Windows 應用程式範本的清單。 移至範本入口網站