除了定义控件的默认外观外，也许我们想还定义当外界刺激我们的控件时，控件外观做出相应的变化，这是我们需要触发器。参考以下代码：
</Button>在上面的代码中注意到<ControlTemplate.Triggers>... </ControlTemplate.Triggers>之间的部分，我们定义了触发器 <Trigger Property="Button.IsMouseOver" Value="True">，其表示当我们Button的IsMouseIOver属性变成True时，将使用设置器<Setter Property="Button.Foreground" Value="Red" /> 来将Button的Foreground属性设置为Red。这里有一个隐含的意思是：当Button的IsMouseIOver属性变成False时，设置器中设置的属性将回复原值。<Button Content="test btn" Grid.Column="1" Grid.ColumnSpan="1" Grid.Row="1" Grid.RowSpan="1" > <Button.Template> <ControlTemplate> <!--定义视觉树--> <Grid> <Ellipse Name="faceEllipse" Width="{TemplateBinding Button.Width}" Height="{TemplateBinding Control.Height}" Fill="{TemplateBinding Button.Background}"/> <TextBlock Name="txtBlock" Margin="{TemplateBinding Button.Padding}" VerticalAlignment="Center" HorizontalAlignment="Center" Text="{TemplateBinding Button.Content}" /> </Grid> <!--定义视觉树_end--> <!--定义触发器--> <ControlTemplate.Triggers> <Trigger Property="Button.IsMouseOver" Value="True"> <Setter Property="Button.Foreground" Value="Red" /> </Trigger> </ControlTemplate.Triggers> <!--定义触发器_End--> </ControlTemplate> </Button.Template>
你可以粘贴以下代码到XamlPad查看效果：
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="ControlTemplateTest" Height="300" Width="300" > <Grid ShowGridLines="True"> <Grid.ColumnDefinitions> <ColumnDefinition Width="0.2*"/> <ColumnDefinition Width="0.6*"/> <ColumnDefinition Width="0.2*"/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="0.3*"/> <RowDefinition Height="0.3*"/> <RowDefinition Height="0.4*"/> </Grid.RowDefinitions> <Button Content="test btn" Grid.Column="1" Grid.ColumnSpan="1" Grid.Row="1" Grid.RowSpan="1" > <Button.Template> <ControlTemplate> <!--定义视觉树--> <Grid> <Ellipse Name="faceEllipse" Width="{TemplateBinding Button.Width}" Height="{TemplateBinding Control.Height}" Fill="{TemplateBinding Button.Background}"/> <TextBlock Name="txtBlock" Margin="{TemplateBinding Button.Padding}" VerticalAlignment="Center" HorizontalAlignment="Center" Text="{TemplateBinding Button.Content}" /> </Grid> <!--定义视觉树_end--> <!--定义触发器--> <ControlTemplate.Triggers> <Trigger Property="Button.IsMouseOver" Value="True"> <Setter Property="Button.Foreground" Value="Red" /> </Trigger> </ControlTemplate.Triggers> <!--定义触发器_End--> </ControlTemplate> </Button.Template> </Button> </Grid> </Window>
