界面控件DevExpress WPF入门级教程 - 类型样式 DevExpressWPFUI.net 6.0
类型样式允许您以简化的方式定义元素样式。
从v.17.2开始,DevExpress WPF套件提供了DevExpress.Xpf.TypedStyles程序集,其中包含以下控件的类型样式:
- 用于基础WPF程序集(WindowsBase、PresentationCore、PresentationFramework)中的控件;
- DevExpress WPF 控件。
类型样式 VS 常规样式
下图演示了常规样式和类型样式之间的区别。
要为多个按钮设置常规样式,您应该实现一个带有TargetType=Button的 Style,并在单独的Setter中指定每个属性。
类型样式允许您通过以下方式为所有按钮定义样式:
- 创建一个名为{ElementName}Style的新资源,其中c是目标类型。
示例:ButtonStyle用于标准Button控件,GridControlStyle用于DevExpress GridControl。
- 不使用setter直接定义属性值,定义类型样式的x:Name属性。
- 分配类型样式来控制与常规样式相同的样式。
支持的功能
类型样式支持所有常规样式功能。
附加属性
附加属性收集在 MergedStyles 属性中:
XAML
<BorderStyle x:Key="styleWithAttachedProperties"> <KeyboardNavigationStyle IsTabStop="False" /> <FocusManagerStyle IsFocusScope="False" /> <TextBlockStyle FontSize="13" FontWeight="Bold"/> </BorderStyle>
事件
您可以在没有EventSetter的情况下指定事件处理程序:
XAML
<BorderStyle x:Key="styleWithEvents" Loaded="BorderStyle_Loaded"/>
标记扩展
立即返回其值的标记扩展(除了 BindingBase 和 DynamicResoureExtension)可以以常规方式在类型样式中使用:
XAML
<SolidColorBrush x:Key="greenBrush">Green</SolidColorBrush> <ButtonStyle x:Key="styleWithMarkupExtensions" BorderBrush="{StaticResource greenBrush}" Foreground="{x:Null}" />
使用 BindingBase 和 DynamicResourceExtension 标记扩展的“*_Source”属性:
XAML
<ButtonStyle x:Key="styleWithExpressionExtensions" Content_Source="{Binding FirstName}" Tag_Source="{DynamicResource tag}" />
DevExpress 扩展(DXBinding/DXEvent/DXCommand)
XAML
<ButtonStyle x:Key="styleWithDXBinding" Content_Source="{DXBinding 'FirstName + @Self.Tag + $Button.TemplateProperty.Name'}" Tag="tag" Command_Source="{DXCommand 'Click()'}"/>
注意:DXEvent 不适用于类型化样式。
基本样式
您可以通过以下方式定义基本样式:
XAML
<ButtonBaseStyle x:Key="baseStyle" Background="Red" /> <ButtonStyle x:Key="styleWithBaseStyle" BasedOn="{StaticResource baseStyle}" ClickMode="Hover"/>
Setters
您可以通过填充 *Style.Setters 集合来使用常规 setter。
XAML
<ButtonStyle x:Key="styleWithStandardSetters"> <ButtonStyle.Setters> <Setter Property="DockPanel.Dock" Value="Bottom" /> </ButtonStyle.Setters> </ButtonStyle>
隐式样式
要定义隐式样式,请使用x:Key替代TargetType:
XAML
<ToggleButtonStyle x:Key="{x:Type ToggleButton}" Width="153" />
目标类型在内部设置为 typed 样式,因此您不应手动设置它。 例如,要为ListBox 定义VirtualizingPanelStyle,您需要先定义ListBoxStyle。
XAML
<ListBoxStyle x:Key="virtualizingStyle"> <VirtualizingPanelStyle IsVirtualizing="True" /> </ListBoxStyle>
触发器
除了类型化样式之外,DevExpress.Xpf.TypedStyles 程序集还包含每个受支持控件的类型化触发器:
XAML
<ButtonStyle x:Key="styleWithTriggers" Margin="1,2,3,4"> <ButtonStyle.Triggers> <ButtonTrigger Visibility="Hidden" IsMouseOver="True"> <TextBlockStyle FontSize="13" /> </ButtonTrigger> </ButtonStyle.Triggers> </ButtonStyle>
您可以在模板中使用类型化触发器。 为此,请指定类型化触发器的 SourceName 或 TemplateName 属性:
XAML
<ControlTemplate x:Key="templateWithTriggers" TargetType="Button"> <TextBlock x:Name="textBlock" /> <ControlTemplate.Triggers> <TextBlockTrigger FontWeight="Black" SourceName="textBlock"> <TextBlockStyle TargetName="textBlock" FontStyle="Oblique"/> </TextBlockTrigger> </ControlTemplate.Triggers> </ControlTemplate>
如果为多个源对象创建触发器,则可以定义多个触发器:
XAML
<ControlTemplate x:Key="templateWithDifferentSourceNamesTriggers" TargetType="Button"> <StackPanel> <TextBlock x:Name="textBlock1" /> <TextBlock x:Name="textBlock2" /> </StackPanel> <ControlTemplate.Triggers> <ButtonTrigger> <ButtonTrigger.Triggers> <MultiTriggerCollection> <TextBlockTrigger IsMouseOver="True" SourceName="textBlock1"/> <TextBlockTrigger IsKeyboardFocusWithin="True" SourceName="textBlock2"/> </MultiTriggerCollection> </ButtonTrigger.Triggers> <TextBlockStyle FontWeight="Bold"/> </ButtonTrigger> </ControlTemplate.Triggers> </ControlTemplate>
数据触发器
使用 TypedDataTrigger 将类型样式与数据触发器一起使用。
XAML
<ButtonStyle x:Key="styleWithDataTriggers" Margin="1,2,3,4"> <ButtonStyle.Triggers> <TypedDataTrigger Binding="{Binding FirstName}" Value="Jon"> <TextBlockStyle FontSize="13" /> </TypedDataTrigger> </ButtonStyle.Triggers> </ButtonStyle>
在您的代码中使用
引用和命名空间
所有类型化的样式和触发器都在 {Corresponding control namespace}.TypedStyles 命名空间中实现。
示例:ButtonStyle - System.Windows.Controls.TypedStyles.
类型化样式的 XAML 命名空间与相应控件的命名空间相同——您不需要添加任何额外的命名空间引用。 要使用类型化样式,请在您的项目中引用 DevExpress.Xpf.TypedStyles 程序集。
限制
- Visual Studio 和 Blend 不支持类型化样式,编辑 XAML 时使用类型化样式。
- 不能将类型化样式应用于泛型类型元素或其后代(例如,应用于 DXTabControl 或 Wizard 类),使用带有此元素的常规样式作为 TargetType。
性能
类型样式的性能与常规样式相当,以下常规样式在测试机上应用 200 毫秒:
XAML
<Style x:Key="style00" TargetType="Button"> <Setter Property="FontFamily" Value="CourierNew"/> <Setter Property="FontSize" Value="12"/> <Setter Property="FocusVisualStyle" Value="{x:Null}"/> <Setter Property="Focusable" Value="False"/> <Setter Property="Content" Value="test"/> <Setter Property="Background" Value="Red"/> <Setter Property="BorderThickness" Value="1"/> <Setter Property="Margin" Value="1,2,3,4"/> <Setter Property="Cursor" Value="Hand"/> </Style>
以下通过类型样式实现的模拟在测试机上应用了 130 毫秒:
XAML
<ButtonStyle x:Key="style00" FontFamily="CourierNew" FontSize="12" FocusVisualStyle="{x:Null}" Focusable="False" Content="test" Background="Red" BorderThickness="1" Margin="1,2,3,4" Cursor="Hand" />
DevExpress WPF拥有120+个控件和库,将帮助您交付满足甚至超出企业需求的高性能业务应用程序。通过DevExpress WPF能创建有着强大互动功能的XAML基础应用程序,这些应用程序专注于当代客户的需求和构建未来新一代支持触摸的解决方案。 无论是Office办公软件的衍伸产品,还是以数据为中心的商业智能产品,都能通过DevExpress WPF控件来实现。
DevExpress技术交流群5:742234706 欢迎一起进群讨论
更多DevExpress线上公开课、中文教程资讯请上中文网获取
上一篇: Visual Studio插件CodeRush 全新发布v21.2.5——支持智能导航 Visual StudioCodeRushc#
下一篇: UI组件库Kendo UI for Angular入门指南教程 - 图表功能 AngularKendo UItelerik
推荐阅读
-
界面控件DevExpress WPF入门级教程 - 调用表达式编辑器 DevExpressWPF.NET 6.0编辑器
-
界面控件DevExpress WPF入门级教程 - 表达式编辑器模式 DevExpressWPFc#编辑器
-
界面控件DevExpress WPF入门级教程 - 类型样式 DevExpressWPFUI.net 6.0
-
界面控件DevExpress WPF入门级教程 - 自定义表达式编辑器 DevExpressWPF界面控件UI
-
界面控件DevExpress WPF入门级教程 - 触摸滚动条 DevExpressWPF界面控件UI
-
界面控件DevExpress WPF入门级教程 - 类型样式 DevExpressWPFUI.net 6.0
-
界面控件DevExpress WPF中文入门级教程 - 未绑定数据源 DevExpress界面控件WPF数据源
-
WPF界面工具Telerik UI for WPF入门级教程 - 样式控件 TelerikWPFUI控件C#.net
-
界面控件DevExpress WPF入门级教程 - 过滤功能 DevExpressWPF.net 6.0c#
-
界面控件DevExpress WPF入门级教程 - 调用表达式编辑器 DevExpressWPF.NET 6.0编辑器