第17章 控件模版(4)——事件触发器

一、自定义按钮模版xaml代码

<Window        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:ButtonTemplate"        xmlns:Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero" x:Class="ButtonTemplate.MainWindow"        mc:Ignorable="d"        Title="MainWindow" Height="350" Width="525">    <Window.Resources>        <ControlTemplate x:Key="ButtonTemplate" TargetType="{x:Type Button}">            <Border BorderBrush="Orange" BorderThickness="3" CornerRadius="2" Background="Red" TextBlock.Foreground="White" Name="Border">                <Grid>                    <Rectangle Name="FocusCue" Visibility="Hidden" Stroke="Black" StrokeThickness="1" StrokeDashArray="1 2" SnapsToDevicePixels="True" ></Rectangle>                    <ContentPresenter RecognizesAccessKey="True" Margin="{TemplateBinding Padding}"></ContentPresenter>                </Grid>            </Border>            <ControlTemplate.Triggers>                <EventTrigger RoutedEvent="MouseEnter">                    <BeginStoryboard>                        <Storyboard>                            <ColorAnimation Storyboard.TargetName="Border" Storyboard.TargetProperty="Background.Color"                                            To="Blue" Duration="0:0:1" AutoReverse="True" RepeatBehavior="Forever"></ColorAnimation>                        </Storyboard>                    </BeginStoryboard>                </EventTrigger>                <EventTrigger RoutedEvent="MouseLeave">                    <BeginStoryboard>                        <Storyboard>                            <ColorAnimation Storyboard.TargetName="Border" Storyboard.TargetProperty="Background.Color" Duration="0:0:0.5"></ColorAnimation>                        </Storyboard>                    </BeginStoryboard>                </EventTrigger>                <Trigger Property="IsPressed" Value="True">                    <Setter TargetName="Border" Property="Background" Value="IndianRed" />                    <Setter TargetName="Border" Property="BorderBrush" Value="DarkKhaki" />                </Trigger>                <Trigger Property="IsKeyboardFocused" Value="True">                    <Setter TargetName="FocusCue" Property="Visibility" Value="Visible" />                </Trigger>            </ControlTemplate.Triggers>        </ControlTemplate>    </Window.Resources>    <StackPanel Margin="10">        <Button  Margin="10" Padding="5" Template="{StaticResource ButtonTemplate}" Name="cmdOne">A Simple Button with a Custom Template</Button>        <Button Margin="10" Padding="5" Template="{StaticResource ButtonTemplate}" Name="cmdTwo">Another Button with a Custom Template</Button>    </StackPanel></Window>

二、效果显示

三、特殊说明

①属性触发器和事件触发器都可以添加动画，但一般用事件触发器设置动画

②动画还可实现以下效果：

1)显示与隐藏元素。为此，需要改变控件模版中元素的Opacity属性。

2)改变形状或位置。使用Translateform对象调整元素位置。使用ScaleTransform或RotateTransform旋转元素。

3)改变光照或着色。为此，需使用改变绘制背景的画刷的动画。