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

DevExpress WinForm組件允許開發(fā)人員輕松地引入受Windows 11啟發(fā)的UI元素。

獲取DevExpress v22.2正式版下載

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

WXI皮膚

基于矢量的DevExpress WXI皮膚為DevExpress的WinForms應(yīng)用程序復(fù)制了Windows 11的關(guān)鍵視覺元素，與其他基于矢量的DevExpress皮膚一樣，WXI利用了軟調(diào)色板、微妙對比和較大控件尺寸的可用性優(yōu)勢，同時WXI還增加了控件之間的填充來提高可讀性。

WXI Skin - 緊湊模式

DevExpress WXI皮膚允許開發(fā)者在運(yùn)行時選擇“WXI”或“WXI Compact”選項(xiàng)，WXI皮膚的緊湊模式是為數(shù)據(jù)編輯器密集型應(yīng)用程序而設(shè)計(jì)的。如果需要最大化表單空間的使用，則應(yīng)用WXI Compact選項(xiàng)(在Compact模式下，WXI皮膚會減少控件之間的空白)。

使用下面的代碼在運(yùn)行時指定WXI呈現(xiàn)選項(xiàng)(標(biāo)準(zhǔn)vs緊湊)：

C#

// Apply the WXI skin with its default palette.
DevExpress.LookAndFeel.UserLookAndFeel.Default.SetSkinStyle(SkinStyle.WXI);
// Or
DevExpress.LookAndFeel.UserLookAndFeel.Default.SetSkinStyle(SkinStyle.WXICompact);

// Apply the WXI skin and its "Sharpness" palette.
DevExpress.LookAndFeel.UserLookAndFeel.Default.SetSkinStyle(SkinSvgPalette.WXI.Sharpness);
// Or
DevExpress.LookAndFeel.UserLookAndFeel.Default.SetSkinStyle(SkinSvgPalette.WXICompact.Sharpness);

VB.NET

' Apply the WXI skin with its default palette.
DevExpress.LookAndFeel.UserLookAndFeel.Default.SetSkinStyle(SkinStyle.WXI)
' Or
DevExpress.LookAndFeel.UserLookAndFeel.Default.SetSkinStyle(SkinStyle.WXICompact)

' Apply the WXI skin and its "Sharpness" palette.
DevExpress.LookAndFeel.UserLookAndFeel.Default.SetSkinStyle(SkinSvgPalette.WXI.Sharpness)
' Or
DevExpress.LookAndFeel.UserLookAndFeel.Default.SetSkinStyle(SkinSvgPalette.WXICompact.Sharpness)

全局緊湊模式設(shè)置

切換到/從緊湊模式觸發(fā)相同的UI修改應(yīng)用全局屬性，因此只有當(dāng)此屬性設(shè)置為DefaultBoolean.Default時，皮膚選擇器才會顯示兩種皮膚變化。如果設(shè)置為不同的值，用戶只能在運(yùn)行時選擇一個“WXI”選項(xiàng)(基于CompactUIMode屬性)。

C#

// The global Compact Mode is off; the "WXI" runtime option applies the regular WXI variation.
WindowsFormsSettings.CompactUIMode = DevExpress.Utils.DefaultBoolean.False;

// The global Compact Mode is on; the "WXI" runtime option applies the compact WXI variation.
WindowsFormsSettings.CompactUIMode = DevExpress.Utils.DefaultBoolean.True;

VB.NET

// The global Compact Mode is off; the "WXI" runtime option applies the regular WXI variation.
WindowsFormsSettings.CompactUIMode = DevExpress.Utils.DefaultBoolean.False;

// The global Compact Mode is on; the "WXI" runtime option applies the compact WXI variation.
WindowsFormsSettings.CompactUIMode = DevExpress.Utils.DefaultBoolean.True;

如何獲取當(dāng)前模式

讀取UserLookAndFeel.Default.CompactUIModeForced屬性值，來確定常規(guī)皮膚選項(xiàng)還是緊湊型皮膚選項(xiàng)當(dāng)前是激活的。

C#

bool isCompact = UserLookAndFeel.Default.CompactUIModeForced;

VB.NET

Dim isCompact As Boolean = UserLookAndFeel.Default.CompactUIModeForced

Window角

WXI皮膚將圓角應(yīng)用于Windows 11中顯示的窗體，如果您更喜歡矩形角，或者如果您想將圓角應(yīng)用到其他DevExpress皮膚，請使用屬性。

Ribbon

WXI皮膚自動圓角Ribbon控件的項(xiàng)目面板，如果某個特定的UI控件不支持受Windows 11啟發(fā)的圓角，那么圓角可能會導(dǎo)致視覺上的不一致。如果一個帶有“矩形”角的UI控件被放置在功能區(qū)的正下方，這種不一致性就會很明顯。

根據(jù)您的表單布局，可以選擇以下選項(xiàng)當(dāng)中的一個來解決這種不一致：

使用經(jīng)典的Ribbon樣式

將屬性更改為Classic，要更改項(xiàng)目/應(yīng)用程序中的所有的Ribbon控件，請更改屬性為Classic。在此模式下，Ribbon使用標(biāo)準(zhǔn)矩形形狀呈現(xiàn)，與所有其他控件的矩形形狀匹配。

添加圓角面板

使用DevExpress.XtraEditors.RoundedSkinPanel封裝客戶端區(qū)域控件（圓形皮膚面板封裝客戶端控件的外角，并在Ribbon下面添加間距）。

DevExpress圓形皮膚面板正在積極開發(fā)中，在Visual Studio工具箱中不可用。要使用此面板，必須在代碼中創(chuàng)建它。

C#

this.rootPanel = new DevExpress.XtraEditors.RoundedSkinPanel();
// ...
this.rootPanel.Dock = System.Windows.Forms.DockStyle.Fill;
this.Controls.Add(this.gridControl1);
// ...
this.Controls.Add(this.rootPanel);
// ...
private DevExpress.XtraEditors.RoundedSkinPanel rootPanel;

VB.NET

Me.rootPanel = New DevExpress.XtraEditors.RoundedSkinPanel()
' ...
Me.rootPanel.Dock = System.Windows.Forms.DockStyle.Fill
Me.Controls.Add(Me.gridControl1)
' ...
Me.Controls.Add(Me.rootPanel)
' ...
private DevExpress.XtraEditors.RoundedSkinPanel rootPanel

重要提示：不要為每個窗體添加超過一個圓形皮膚面板。

注意：某些DevExpress WinForms控件(如MapControl)，即使放置在圓形皮膚面板內(nèi)，也不會不顯示圓角。

使用布局控件

如果您的應(yīng)用程序和/或應(yīng)用程序設(shè)計(jì)包含大量的數(shù)據(jù)編輯器或簡單的UI控件，請使用DevExpress Layout/Data Layout控件在表單中排列數(shù)據(jù)編輯器/簡單控件。DevExpress WXI皮膚中使用的默認(rèn)布局/數(shù)據(jù)布局控件填充確保子控件與Ribbon項(xiàng)目面板的兩側(cè)對齊。

Dock面板

要將Dock面板與Ribbon項(xiàng)目面板的邊緣對齊，您可以將Dock UI移動到一個單獨(dú)的用戶控件中，并且:1)設(shè)置單獨(dú)的UserControl填充或2)將UserControl放置在圓形皮膚面板內(nèi)(圓形皮膚面板自動添加必要的邊距)。

您也可以使用DockManager的“Light”樣式(參見屬性來獲取更多信息）來刪除不需要的邊界并增強(qiáng)界面內(nèi)的對齊。