WPF模板触发器Demo

1、界面设计如图：

2、xaml代码如下：

<Window x:Class="WpfAppDemo.TemplateDemo"
        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:WpfAppDemo"
        mc:Ignorable="d"
        Title="模板窗体" Height="466.046" Width="652.49">
    <Window.Resources>
        <ControlTemplate x:Key="RoundBtnTemplte" TargetType="Button">
            <!--定义视觉树-->
            <Grid>
                <Ellipse Name="roundBtn" Width="80" Height="80" >
                    <Ellipse.Fill>
                        <!--渐变色-->
                        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                            <GradientStop Offset="0" Color="Blue"/>
                            <GradientStop Offset="1" Color="LightSkyBlue"/>
                        </LinearGradientBrush>

                    </Ellipse.Fill>
                </Ellipse>
                <Ellipse Width="60" Height="60">
                    <Ellipse.Fill>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                            <GradientStop Offset="0" Color="GreenYellow"/>
                            <GradientStop Offset="1" Color="LightPink"/>
                        </LinearGradientBrush>
                    </Ellipse.Fill>
                </Ellipse>

                <ContentPresenter Content="{TemplateBinding Button.Content}" HorizontalAlignment="Center" VerticalAlignment="Center">
                </ContentPresenter>
            </Grid>
            <!--定义视觉树__end-->
            <!--定义触发器-->
            <ControlTemplate.Triggers>
                <Trigger Property="IsMouseOver" Value="true">
                    <Setter TargetName="roundBtn" Property="Fill" Value="Red">
                    </Setter>
                </Trigger>
                <Trigger Property="IsFocused" Value="true">
                    <Setter TargetName="roundBtn" Property="Fill" Value="Yellow">
                    </Setter>
                </Trigger>

            </ControlTemplate.Triggers>
            <!--定义触发器_End-->
        </ControlTemplate>
    </Window.Resources>
    <Grid Margin="0,0,0,5">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*">

            </ColumnDefinition>
            <ColumnDefinition Width="1*"></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <StackPanel Margin="10,10,110,10" Grid.Column="0" Orientation="Horizontal">
            <CheckBox Name="TestCheckBox" Content=""/>
            <TextBlock>
                <TextBlock.Style>
                    <Style TargetType="TextBlock">
                        <Setter Property="Text" Value="Hello,这是测试！"></Setter>
                        <Setter Property="FontSize" Value="16"></Setter>
                        <Setter Property="Foreground" Value="Green"></Setter>
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding ElementName=TestCheckBox,Path=IsChecked}" Value="True">
                                <Setter Property="Text" Value="触发器测试"></Setter>
                                <Setter Property="Foreground" Value="Red"></Setter>
                                <Setter Property="FontSize" Value="26"></Setter>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                    
                </TextBlock.Style>
            </TextBlock>

        </StackPanel>
        <StackPanel Margin="10" Grid.Column="1" Orientation="Horizontal">
            <Button Padding="5" Margin="5,5,5,312" Content="确定" FontSize="16" Template="{StaticResource RoundBtnTemplte}" RenderTransformOrigin="-0.849,0.498"/>
            <Button Padding="5" Margin="10,20,5,312" Width="83" Content="nomal button"/>
        </StackPanel>
        <StackPanel Margin="10" Grid.Column="1" Orientation="Horizontal"/>
    </Grid>
</Window>

 

3、运行效果：

说明：

1、使用DataTrigger  当TestCheckBox为选中状态时，修改控件的显示字体大小和颜色。

2、资源定义了RoundBtnTemplte模板，应用类型是Button，样式是椭圆形的渐变色。ContentPresenter呈现内容可以根据自定义

Content="{TemplateBinding Button.Content}"