“Fluent Design”是一種由Microsoft在2017年 Windows 10秋季發(fā)布會發(fā)布的UI類型，這種設(shè)計(jì)類型類似塑料的半透明，并與3D 效果、高級明亮效果和不同應(yīng)用程序狀態(tài)之間的過渡混合到一起。

在 DevExpress Demo Center中運(yùn)行“Fluent Mail Client”演示來實(shí)現(xiàn)我們這個(gè)設(shè)計(jì)理念。

獲取工具下載 - DevExpress WinForm v21.1

可視化效果

Fluent Design概念引入了兩種獨(dú)特的可視化效果：Acrylic Material和Reveal Highlight。

Acrylic Material

Acrylic是一種半透明材料，允許用戶“透視”應(yīng)用程序。 此效果需要五個(gè)單獨(dú)的圖層，具有單獨(dú)的不透明度和可視化效果才能正確實(shí)現(xiàn)。

Microsoft 文檔建議您將Acrylic用于：

• “支持 UI”，例如滾動或交互時(shí)與主窗口內(nèi)容重疊的表面；
• transient UI元素的背景：上下文菜單、浮出控件等。

Reveal Hightlight

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

構(gòu)建Fluent Design應(yīng)用程序

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

• Fluent Design是一種獨(dú)特的 UI 類型，需要對其底層概念有基本的了解。 因此請查看Microsoft 的指南并了解Fluent design，
• 啟用 DirectX 硬件加速：使用傳統(tǒng) GDI+ 引擎無法渲染復(fù)雜的 Fluent Design可視化效果，啟用 DirectX 加速的最簡單方法是檢查中的相應(yīng)設(shè)置。

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

C#

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

VB.NET

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

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

DevExpress WinForm | 下載試用

DevExpress WinForm擁有180+組件和UI庫，能為Windows Forms平臺創(chuàng)建具有影響力的業(yè)務(wù)解決方案。DevExpress WinForms能完美構(gòu)建流暢、美觀且易于使用的應(yīng)用程序，無論是Office風(fēng)格的界面，還是分析處理大批量的業(yè)務(wù)數(shù)據(jù)，它都能輕松勝任！

更多產(chǎn)品正版授權(quán)詳情及優(yōu)惠，歡迎咨詢

DevExpress技術(shù)交流群4：715863792      歡迎一起進(jìn)群討論