DirectX表單
DirectXForm為所有駐留在其表面上的控件啟用DirectX硬件加速,并支持DirectX渲染模式。
與啟用DirectX的控件駐留在常規表單上的標準技術相比,DirectX表單具有以下優點:
- 所有啟用DirectX的控件都在單個設備上下文中呈現,當表單承載大量子控件時,這種技術提供了明顯更好的性能。
- 啟用DirectX的控件消耗更少的內存。
- DirectX表單和他們的子控件可以有任何形狀和不透明度,由本地DirectX繪制方法。

- 表單大小調整計算更快,大小調整動畫更平滑。
- 專用的HTML和CSS模板允許您創建自定義表單設計。
局限性
支持子控件
DirectX表單無法呈現不支持DirectX的子控件,當前不支持的DevExpress WinForms控件列表:
- 電子表格
不支持的控件列表與DirectX硬件加速文章中的DirectX兼容控件列表不同。例如,SimpleButton、RadioGroup和TokenEdit不是DirectX-ready控件:它們沒有啟用DirectX渲染的屬性,并且在調用全局WindowsFormsSettings.ForceDirectXPaint()方法時不能切換到DirectX模式,然而,當放置在DirectX表單中時,這些控件開始使用DirectX API。
下面的自定義方法允許您識別放置在表單上的控件是否使用DirectX呈現:
C#:
bool CheckDirectXEnabled(Control testedControl) { if (!testedControl.IsHandleCreated) return false; var dxClient = testedControl as DevExpress.Utils.DirectXPaint.IDirectXClient; if (dxClient == null) { var dxProvider = testedControl as DevExpress.Utils.DirectXPaint.IDirectXClientProvider; dxClient = dxProvider?.DirectXClient; } if (dxClient == null) return false; return dxClient.DirectXProvider.Enabled; }
VB.NET :
Private Function CheckDirectXEnabled(ByVal testedControl As Control) As Boolean If Not testedControl.IsHandleCreated Then Return False End If Dim dxClient = TryCast(testedControl, DevExpress.Utils.DirectXPaint.IDirectXClient) If dxClient Is Nothing Then Dim dxProvider = TryCast(testedControl, DevExpress.Utils.DirectXPaint.IDirectXClientProvider) dxClient = dxProvider?.DirectXClient End If If dxClient Is Nothing Then Return False End If Return dxClient.DirectXProvider.Enabled End Function
我們不斷擴展可以在DirectX Forms中托管的控件的數量,并期望在DirectX Form退出CTP階段時支持整套DevExpress WinForms控件。
多文檔接口
DirectX表單不支持MDI布局,因此,不能將現有的MDI表單轉換為DirectX表單。
HTML模板
與其他支持HTML和CSS模板的控件類似,DirectX Form實例暴露了HtmlTemplate屬性,允許您設計自定義模板,每個DirectX表單都從下默認模板開始:
<dx-form-frame id="frame"> <dx-form-titlebar id="titlebar"> <dx-form-icon id="icon"></dx-form-icon> <dx-form-text id="text"></dx-form-text> <dx-form-minimizebutton id="minimizebutton"></dx-form-minimizebutton> <dx-form-maximizebutton id="maximizebutton"></dx-form-maximizebutton> <dx-form-closebutton id="closebutton"></dx-form-closebutton> </dx-form-titlebar> <dx-form-content id="content"></dx-form-content> </dx-form-frame>
這個默認模板的CSS部分是空的,標準元素的外觀和行為存儲在內部,元素的外觀取決于標記(例如,<dx-form-icon>或<dx-form-maximizebutton>),而元素的行為取決于標記ID。例如,下面的標記創建了一個看起來像關閉按鈕,但行為像最小化按鈕的按鈕:
<dx-form-closebutton id="minimizebutton"></dx-form-closebutton>
您可以使用這些標準元素和 IDs 來避免編寫額外的代碼。下面的標記創建一個具有自定義外觀的按鈕,由于“closebutton”ID,該按鈕充當關閉按鈕,則不需要指定自定義方法并將其分配給按鈕的onclick屬性。
<div id="closebutton" class="button"> <img src="Close" class="button-glyph" /> </div>
提示:標簽IDs是唯一的值,不能添加具有相同IDs的多個元素。
“frame”和“content”IDs 為必選項,沒有這些IDs 元素的模板被認為是無效的。
- 帶有“frame”ID的元素指定了表單的大小調整區域。
- 帶有“content”ID的元素指定表單的客戶端區域(子控件駐留的區域)。
因此,自定義模板所需的最小標記如下:
HTML:
<div id="frame" class="frame"> <div id="content"> </div> </div>
CSS:
.frame { height: 100%; }
然后可以向這個基本模板添加元素和CSS樣式,下面的示例模板可以在DevExpress WinForms演示中心(HTML演示模塊)中找到:

HTML:
<div class="root"> <div class="frame" id="frame"> <div class="caption"> <div class="title">DirectX Form</div> <div id="closebutton" class="button"> <img src="Close" class="button-glyph" /> </div> </div> <div class="content" id="content"></div> </div> </div>
點擊復制
CSS :
body { padding: 12px; } .root { border: 1px solid rgba(0,0,0,0.1); } .frame { height: 100%; display: flex; flex-direction: column; box-shadow: 2px 2px 8px @DisabledText; } .caption { background-color: @Control; height: 32px; display: flex; flex-direction: row; align-content: center; padding: 8px 8px 8px 16px; } .content { background-color: @Control; flex-grow: 1; } .button { width: 32px; height: 32px; min-width: 32px; min-height: 32px; align-self: center; border-radius: 4px; } .button:hover { background-color: @DisabledText/0.3; } .button:active { background-color: @DisabledText/0.7; } .button-glyph { width: 16px; height: 16px; min-width: 16px; min-height: 16px; margin: 8px; opacity: 0.5; } .title { color: @ControlText; flex-grow: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; align-self: center; font-size: 18px; } body { padding: 12px; } .root { border: 1px solid rgba(0,0,0,0.1); } .frame { height: 100%; display: flex; flex-direction: column; box-shadow: 2px 2px 8px @DisabledText; } .caption { background-color: @Control; height: 32px; display: flex; flex-direction: row; align-content: center; padding: 8px 8px 8px 16px; } .content { background-color: @Control; flex-grow: 1; } .button { width: 32px; height: 32px; min-width: 32px; min-height: 32px; align-self: center; border-radius: 4px; } .button:hover { background-color: @DisabledText/0.3; } .button:active { background-color: @DisabledText/0.7; } .button-glyph { width: 16px; height: 16px; min-width: 16px; min-height: 16px; margin: 8px; opacity: 0.5; } .title { color: @ControlText; flex-grow: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; align-self: center; font-size: 18px; }
點擊復制
在上面的示例中,沒有使用body樣式的HTML元素,它作為一個全局樣式,為<frame>元素設置12px填充,這個空白區域允許<frame>元素繪制它的陰影(.frame style的box-shadow屬性)。
標題欄中元素的Mouse 事件
位于DirectX表單標題欄中的元素不會引發HtmlElementMouseClick事件,只有標準的最小化、最大化和關閉按鈕在單擊時觸發此事件。
以下來自DirectX Form演示的標記向標題欄添加了五個元素,在這五個元素中,只有Close按鈕可以觸發HtmlElementMouseClick事件。
<div class="shadowframe"> <div class="frame" id="frame"> <div class="titlebar"> <img class="logo" src="Logo" /> <!--No Click event--> <div class="searchbox"> <!--No Click event--> <img class="searchimage" src="Search" /> </div> <div class="addbutton"> <!--No Click event--> <div class="addbuttoncontainer"> <img class="addimage" src="Add" /> <div class="addbuttontext">Add New</div> </div> </div> <img class="button" src="User" id="loginbutton" /> <!--No Click event--> <img class="button" src="Close" id="closebutton"/> <!--Raises the Click event--> </div> <!--...--> </div> </div>
這是因為父標題欄攔截了所有mouse事件,當指針位于標題欄上并且用戶按下鼠標按鈕時,表單將此操作視為拖放(移動)操作的開始。要使header元素具有交互性(允許它們引發onclick方法并觸發HtmlElementMouseClick事件),您需要將它們的HtmlElementMouseDown事件設置為已處理。
例如,下面的代碼檢查元素ID,如果ID用“button”開頭,則為該元素啟用Handled屬性。
C#:
this.HtmlElementMouseDown += (s, e) => { var args = e.MouseArgs as DXMouseEventArgs; if (e.ElementId.StartsWith("button")) args.Handled = true; };
VB.NET :
AddHandler Me.HtmlElementMouseDown, Sub(s, e) Dim args = TryCast(e.MouseArgs, DXMouseEventArgs) If e.ElementId.StartsWith("button") Then args.Handled = True End If End Sub