WPF控件模板
前言
WPF中每个控件都被设计为无外观的,这意味着我们可以通过一定的方式,完全重定义其可视化外观,而WPF也提供了这种改变外观的方式之一,我们称为模板。wpf的模板有多种方式,可以分为控件模板(ControlTemplate),控件列表模板(ItemsPanelTemplate)和数据模板(DataTemplate)。其中ControlTemplate和ItemsPanelTemplate都属于控件模板,但又有不同的表示。
控件模板使用示例
假设现在需要一个如下要求的按钮:
实现的方式可能有很多种,这里使用控件模板演示一下
<Button
Width="100"
Height="35"
Margin="0,10"
Background="#557BF6"
BorderThickness="0"
Foreground="White">
<Button.Template>
<ControlTemplate>
<Border Background="#557BF6" CornerRadius="5">
<StackPanel
HorizontalAlignment="Center"
VerticalAlignment="Center"
Orientation="Horizontal">
<TextBlock Text="❤ " />
<TextBlock Text="按钮2" />
</StackPanel>
</Border>
</ControlTemplate>
</Button.Template>
</Button>
如果把样式和模板全部写在单个控件里面,看起来会让人很抓狂,则可以使用前面提到的自定义样式,把这些公共的东西抽出来,改造后的代码如下:
<ControlTemplate x:Key="btnTempleteStyle" TargetType="{x:Type Button}">
<Border Background="#557BF6" CornerRadius="5">
<StackPanel
HorizontalAlignment="Center"
VerticalAlignment="Center"
Orientation="Horizontal">
<TextBlock Foreground="White" Text="❤ " />
<ContentPresenter />
</StackPanel>
</Border>
</ControlTemplate>
<Button
Width="100"
Height="35"
Content="按钮1"
Foreground="White"
Template="{StaticResource btnTempleteStyle}" />
如果遇到复杂一点的控件,或者我们对某个控件属性不熟悉时,则可以通过实时可视化树去生成副本,然后在此基础上改
找到需要修改的控件,右键点击编辑模板
随后就会自动生成一大段代码
可以把不相关或你不想要的全部去掉,也可在此基础上修改
示例源代码
源代码:https://github.com/luchong0813/WPFSeriesJobs/tree/master/3-ControlTemplete