DevExpress WPF使用技巧教程:WPF外觀自定義
下載DevExpress v20.1完整版 DevExpress v20.1漢化資源獲取
通過DevExpress WPF Controls,您能創建有著強大互動功能的XAML基礎應用程序,這些應用程序專注于當代客戶的需求和構建未來新一代支持觸摸的解決方案。
v20.1版本包含外觀屬性的擴展列表,這篇文章將為大家介紹外觀定制的增強功能,您現在可以將它們集成到基于DevExpress-powered WPF應用程序中。
DateNavigator控件
現在,您可以為以下單元狀態指定單元外觀:
- MouseOverState
- DisabledState
- InactiveState
- FocusedState
- SelectedState
- TodayState
- SpecialDateState
- HolidayState
- NormalState
下面的代碼示例指定一個特殊的日期前景,并禁用當前日期的突出顯示:
<dxe:DateNavigator> <dxe:DateNavigator.Appearance> <dxe:DateNavigatorCellAppearance> <dxe:DateNavigatorCellAppearance.SpecialDateState> <dxe:DateNavigatorStateAppearance Foreground="#FF7200" BorderThickness="0"/> </dxe:DateNavigatorCellAppearance.SpecialDateState> <dxe:DateNavigatorCellAppearance.TodayState> <dxe:DateNavigatorStateAppearance BorderBrush="White"/> </dxe:DateNavigatorCellAppearance.TodayState> </dxe:DateNavigatorCellAppearance> </dxe:DateNavigator.Appearance> </dxe:DateNavigator>

支持標準屬性
v20.1擴展了支持以下標準自定義屬性的控件列表:
- Background / Foreground
- BorderBrush
- BorderThickness
- CornerRadius
- Margin / Padding
最近的主題(Office 2016 SE,Office 2019,VS 2017,VS 2019)現在為以下控件提供增強的模板:
- Ribbon項目、頁面、類別和組
- 工具欄和工具欄項
- 上下文菜單和上下文菜單項
- SimpleButton,DropDownButton和SplitButton
受支持的外觀設置使您可以在整個應用程序中快速自定義外觀,或創建與眾不同的單獨UI元素。 例如,下面的代碼段創建了一個橙色的操作按鈕,您的用戶將不會錯過。
<dx:SimpleButton Content="Simple button" Background="#FF7200" Foreground="White" Padding="10" CornerRadius="5" BorderBrush="#505050" BorderThickness="3" …/>

Bar Triggers
DevExpress Ribbon中使用的工具欄項和工具欄是非可視化元素,它們在UI中生成可視副本,同一項目可以同時顯示在多個位置。例如,下面的圖像在功能區頁面和快速訪問工具欄區域中顯示相同的項目:

由于工具欄項是非可視化元素,因此很難使用常規WPF觸發器自定義關聯的可視化狀態。在v20.1中,我們為工具欄項目引入自定義觸發器,這些觸發器提供與常規WPF觸發器相同的功能,但可以直接為工具欄項定義。
以下是根據檢查狀態來自定義BarCheckItems外觀的方法:
<dxb:BarCheckItem Content="Private" …> <dxb:BarCheckItem.Triggers> <dxb:ItemTrigger Property="IsChecked" Value="True"> <dxb:ItemSetter Property="Background" Value="#ffeb3b"/> </dxb:ItemTrigger> </dxb:BarCheckItem.Triggers> </dxb:BarCheckItem> <dxb:BarCheckItem Content="High Importance" …> <dxb:BarCheckItem.Triggers> <dxb:ItemTrigger Property="IsChecked" Value="True"> <dxb:ItemSetter Property="Background" Value="#d20f38"/> <dxb:ItemSetter Property="Foreground" Value="White"/> </dxb:ItemTrigger> </dxb:BarCheckItem.Triggers> </dxb:BarCheckItem>

DevExpress技術交流群2:775869749 歡迎一起進群討論