Fluent Design UI（流暢設(shè)計UI）

---

立即下載DevExpress WinForms

 “Fluent Design ”是微軟開發(fā)的一種UI類型，與2017年Windows 10的“秋季創(chuàng)作者更新”一起發(fā)布。這種設(shè)計類型混合了類似塑料的半透明與3D效果，先進(jìn)的照明，以及不同應(yīng)用狀態(tài)之間的新過渡。

在DevExpress演示中心運行“Fluent Mail Client”演示，來實現(xiàn)這個設(shè)計概念。

可視化效果

 Fluent Design 概念引入了兩種獨特的視覺效果：Acrylic Material and Reveal Highlight。

Acrylic Material

Acrylic 是一種半透明材料，允許用戶through應(yīng)用程序。此效果需要五個具有單獨不透明度和視覺效果的獨立層才能實現(xiàn)。

Microsoft 文檔建議您將 Acrylic 用于：

“supporting UI”，例如滾動或交互時與主窗口內(nèi)容重疊的表面。

瞬態(tài) UI 元素的背景：上下文菜單、彈出窗口等。

展示亮點

這個效果模仿了跟隨鼠標(biāo)指針的聚光燈。

構(gòu)建流暢的設(shè)計啟發(fā)型應(yīng)用程序

 請按照以下步驟構(gòu)建滿足 Microsoft Fluent Design UI 要求和標(biāo)準(zhǔn)的應(yīng)用程序。

• Fluent Design 是一種獨特的 UI 類型，需要對其基本概念有基本的了解，因此，請查看 Microsoft 的指南并了解 Fluent 設(shè)計的“ “do’s” 和“dont’s”。例如，本文解釋了如何在表單中正確分布丙烯酸材料。
• 啟用：傳統(tǒng)的 GDI+ 引擎無法渲染復(fù)雜的 Fluent Design 視覺效果，啟用 DirectX 加速的最簡單方法是在“頁面中檢查相應(yīng)的設(shè)置。

• 使用相同的項目設(shè)置頁面來選擇矢量皮膚和它的調(diào)色板之一。
• 如果您需要帶有側(cè)面導(dǎo)航控件的表單，請使用嵌入的。對于其他申請表，請使用。兩種形式都支持 Acrylic Material 效果，并允許您將 Bar 項目（按鈕、編輯器、靜態(tài)文本項目等）添加到其標(biāo)題欄區(qū)域。
• 如果布局控件直接位于具有 Acrylic 背景的表單上，則該控件的背景也會使用此效果。否則，如果有另一個容器托管布局控件，則需要在代碼中調(diào)用方法為布局控件啟用 Acrylic 效果。

C#：

InitializeComponent();
//. . .
this.ApplyAcrylicAccent(layoutControl1);

VB.NET：

InitializeComponent()
'. . .
Me.ApplyAcrylicAccent(layoutControl1)

• 將靜態(tài)WindowsFormsSettings.ScrollUIMode屬性設(shè)置為“Fluent”用來提供針對 Fluent UI 優(yōu)化的滾動條。