微軟UWP設計規範

時間 2019-11-07

原文原文鏈接

什麼是uwp應用

通用Windows平臺（Universal Windows Platform，簡稱UWP）是微軟公司建立並在Windows 10中首次引入的一個同質應用架構平臺。此軟件平臺的目的是幫助發展Metro樣式的應用，便於軟件能夠在Windows 10和Windows 10 Mobile上運行而無需重寫。
uwp不一樣於傳統pc上的exe應用也跟只適用於手機端的app有本質區別。它並非爲某一個終端而設計，而是能夠在全部windows10設備上運行。

UWP應用程序，又稱「Windows 10通用應用程序」，其最大的特性莫過於它能夠實現真正的「全設備通用」，也就是說，它並非爲某一個確切的設備終端所設計的，而是面向於全部的Windows 10設備。開發者們只須要編寫一次UWP程序，就能夠在全部的Win10設備上面運行，不管是電腦、手機、平板電腦、Surface Hub大屏設備，仍是全息眼鏡Hololens，都可以完美地運行起來。這不只爲UWP的開發者們提升了工做效率，還爲咱們這些普通用戶們提供了史無前例的便利。算法

UWP應用程序能夠在Win10操做系統中的「應用商店」程序中進行統一的下載。應用商店裏全部的程序都是UWP應用，這些已經上架了的程序都是通過了微軟公司嚴格的檢查後才被放到應用商店上去的，因此說裏面的UWP應用都絕對安全、絕對可靠。不只如此，由於UWP具備全設備通用的性質，因此在應用商店中不須要考慮單獨下載某一設備的版本，就能夠直接快速、方便地根據你正在使用的設備來斷定要安裝的版本，就能夠安裝了。這是UWP應用程序的優點之一。

隨着時代的發展，觸控也成爲了一項潮流。爲了能在Windows 10中更好地支持觸控操做，微軟公司就在UWP應用程序中提供了對觸控的良好支持，同時也更好地兼容高分辨率的顯示屏。頗具特點的是，UWP程序裏面的內容會隨着用戶們調整窗口的大小來進行適當的更改，以適應窗口大小（這項技術一般被稱之爲「自適應窗口」），用戶們在使用時就會產生愉悅的體驗。

UWP 應用設計

有效像素和縮放

在全部上運行 UWP 應用Windows 10 設備，從您的平板電腦或 PC 到電視。那麼，如何設計 UI 看起來在各類設備和屏幕尺寸上很好？windows

各類設備上的同一應用安全

UWP 幫助經過自動調整 UI 元素，以便它們能夠清晰且易於與全部設備和屏幕大小進行都交互。架構

當你的應用在設備上運行時，系統將使用算法來使 UI 元素在屏幕上的顯示方式規範化。
此縮放算法考慮了觀看距離和屏幕密度（每英寸像素），以針對感知大小（而不是物理大小）進行優化。該縮放算法確保用戶可從 10 英尺遠處識別 Surface Hub 上高 24 像素的字體，正如從幾英寸遠處識別 5 英寸手機上高 24 像素的字體。app

不一樣設備的觀看距離框架

基於縮放系統的工做原理，在設計 UWP 應用時，要以有效像素而不是實際物理像素爲單位進行設計。有效像素 (epx) 是一個虛擬度量單位，用於表示佈局尺寸和間距（獨立於屏幕密度）。（在咱們的指南中，epx、ep 和 px 能夠互換使用。）在設計時，你能夠忽略像素密度和實際屏幕分辨率。
而是針對同一大小級別的有效分辨率（以有效像素爲單位的分辨率）進行設計佈局

四的倍數

在UWP應用程序中，UI元素的大小、邊距和位置應始終爲4 epx的倍數。性能

UWP可在各類設備上進行縮放，縮放平臺分別爲100%、125%、150%、175%、200%、225%、250%、300%、350%和400%。基單位是4，由於它是惟一能夠用非整數（例如4*1.5=6）縮放的整數。使用4的倍數能夠將全部UI元素與整個像素對齊，並確保UI元素具備清晰、銳利的邊緣。字體

佈局

窗口、框架和頁面
當在任何Windows10設備上啓動uwp應用程序時，它將在具備框架的窗口中啓動，該框架能夠在頁面實例之間導航。優化

你能夠把你的應用程序的用戶界面看做是頁面的集合。這取決於你決定每頁應該作什麼，以及頁之間的關係。
要了解如何組織頁面，請參閱導航基礎知識。
頁面佈局應如何顯示頁面？大多數頁面遵循一種公用結構來提供一致性，以便用戶可以輕鬆地在應用的頁面之間和頁面內導航。頁面一般包含三種類型的 UI 元素：
1.導航元素幫助用戶選擇他們但願顯示的內容。
2.命令元素啓動操做，例如處理、保存或共享內容。
3.內容元素顯示應用內容。

常見佈局模式

Controls（控件）

UWP 的設計平臺提供了一系列保證在全部支持 Windows 的設備上都能正常工做的經常使用控件，它們遵循 Fluent Design 系統原則。這些控件包括從簡單控件（如按鈕和文本元素）到複雜控件（可從一組數據和一個模板生成列表）的一切控件。

UWP 控件

樣式

經常使用控件自動反映系統主題和主題色，使用全部輸入類型並擴展到全部設備。它們經過這種方式體現 Fluent Design 系統的特色 - 自適應、共鳴和美觀。經常使用控件的默認樣式使用了燈光、運動和深度，所以一旦使用它們，就等於將 Fluent Design 系統集成到了你的應用之中。
經常使用控件是可高度自定義的，你能夠更改控件的前景色或徹底自定義其外觀。要覆蓋控件中的默認樣式，請使用輕型樣式設置或在 XAML 中建立自定義控件。

主題色 gif

殼體

您的uwp應用程序將與更普遍的Windows體驗交互，並在Windows Shell中顯示平鋪和通知。

互動程序會顯示在「開始」菜單和應用程序啓動時，它們會提供應用程序中正在發生的事情的一瞥。他們的力量來自他們背後的內容，以及他們被提供的智慧和工藝。

uwp應用程序有四種尺寸（小、中、寬和大），能夠經過應用程序的圖標和標識進行定製。

輸入

UWP應用程序依賴於智能交互。您能夠圍繞單擊交互進行設計，而沒必要知道或定義單擊是來自鼠標、觸筆仍是手指的輕敲。可是，您也能夠爲特定的輸入模式設計應用程序。

設備

一樣，雖然 UWP 會自動將應用擴展到不一樣的設備，但你也能夠針對特定設備優化 UWP 應用。

可用性

最後但並不是最不重要的是，可用性是對全部用戶開放你的應用體驗。每一個人均可從真正非獨佔的用戶體驗中受益應用中的可用性以瞭解如何使你的應用可供每一個人輕鬆使用。
若是是面向全球用戶設計，你可能須要瞭解全球化和本地化。
你還可能須要考慮面向在視覺、聽覺和行動方面受限的用戶的輔助功能。若是輔助功能從一開始便內置於設計中，則使你的應用可供訪問應只需花費極少的額外時間和精力。