WPF模板

模板能够更加灵活的控制控件的外观

1. 示例：通过模板更改控件Button的外观

效果：

<Window x:Class="模板.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:模板"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.Resources>
            <ControlTemplate x:Key="ButtonTemplate">
                <Grid Height="100" Width="100">
                    <Ellipse x:Name="outerCircle" Width="100" Height="100">
                        <Ellipse.Fill>
                            <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                <GradientStop Offset="0" Color="Blue"/>
                                <GradientStop Offset="1" Color="Red"/>
                            </LinearGradientBrush>
                        </Ellipse.Fill>
                    </Ellipse>

                    <Ellipse Width="80" Height="80">
                        <Ellipse.Fill>
                            <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                <GradientStop Offset="0" Color="White"/>
                                <GradientStop Offset="1" Color="Transparent"/>
                            </LinearGradientBrush>
                        </Ellipse.Fill>
                    </Ellipse>
                </Grid>
                <ControlTemplate.Triggers >
                    <Trigger Property="Button.IsMouseOver" Value="true">
                        <Setter TargetName="outerCircle" Property="Fill" Value="Orange"/>
                    </Trigger>

                    <Trigger Property="Button.IsPressed" Value="true">
                        <Setter Property="RenderTransform">
                            <Setter.Value>
                                <ScaleTransform ScaleX="0.9" ScaleY="0.9"/>
                            </Setter.Value>
                        </Setter>
                        <Setter Property="RenderTransformOrigin" Value=".5,.5"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Grid.Resources>
        <Button Template="{StaticResource ButtonTemplate}"/>
    </Grid>
</Window>

 

2. 样式的触发器和模板触发器的区别：

（1）样式的触发器无法应用于模板的某个子元素，而模板的触发器可以。样式中只能设置某个控件的某个属性，而且Setter的TargetName和Trigger的SourceName属性均用来指定模板中的某个子元素，该子元素必须有一个名字。

（2）样式的触发器的优先级高于模板的触发器

3. 样式和模板的混合使用

（1）模板可以作为资源放在窗口或应用程序的资源标签中

（2）模板可以嵌入样式中，能够实现模板的复用（模板中的某些属性可以在样式中更改）

  <Style x:Key="GreenButton" TargetType="Button">
                <Setter Property="Template" Value="{StaticResource ButtonTemplate}"/>
                <Setter Property="Background" Value="Green"/>
  </Style>
   <Style x:Key="RedButton" TargetType="Button">
                <Setter Property="Template" Value="{StaticResource ButtonTemplate}"/>
                <Setter Property="Background" Value="Red"/>
   </Style>