触发器系列（2） DataTrigger

标签：datatrigger   动画   wpf触发器   xaml   控件   

触发条件：

DataTrigger是以控件DataContext的属性作为触发条件

本例效果说明：

<!--当值为1时将外边框的背景色改为黑色-->

<!--当值为2时 改变透明度达到闪动的效果-->

代码如下：

    <Window.Resources>
        <Style TargetType="Button" x:Key="newTemplate">
            <Setter Property="Background" Value="Green"/>
            <Setter Property="Foreground" Value="Blue"/>
            <Setter Property="Content" Value="Content"/>
            <!-- Button 模板-->
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border x:Name="RootElement">
                            <!--边框背景-->
                            <Border.Background>
                                <SolidColorBrush x:Name="BorderBrush" Color="Red"/>
                            </Border.Background>
                            <!--背景取值Setter里的Background /Margin 改变外边框的大小-->
                            <Grid Background="{TemplateBinding Background}" Margin="6">
                                <Border x:Name="FocusVisual" Background="{TemplateBinding Foreground}" 
                                        Opacity="0">
                                </Border>
                                <TextBlock x:Name="texb" Height="24" Text="{TemplateBinding Content}" ></TextBlock>
                            </Grid>
                        </Border>
                        <!--以下是触发器-->
                        <ControlTemplate.Triggers>
                            <!--当值为1时将外边框的背景色改为黑色-->
                            <DataTrigger Binding="{Binding ElementName=texb, Path=Text}" Value="1">
                                <Setter TargetName="RootElement" Property="Background" Value="Black"></Setter>
                            </DataTrigger>
                            <!--当值为2时 改变透明度达到闪动的效果-->
                            <DataTrigger Binding="{Binding ElementName=texb, Path=Text}" Value="2">
                                <DataTrigger.EnterActions>
                                    <BeginStoryboard x:Name="playAnimation">
                                        <Storyboard  
                                            Storyboard.TargetName="FocusVisual"
                                            Storyboard.TargetProperty="Opacity"
                                            >
                                            <DoubleAnimation
                                                AutoReverse="True"
                                                RepeatBehavior="Forever"
                                                To="1" Duration="0:0:1" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </DataTrigger.EnterActions>
                                <!--停止闪动动画-->
                                <DataTrigger.ExitActions>
                                    <StopStoryboard BeginStoryboardName="playAnimation">
                                    </StopStoryboard>
                                </DataTrigger.ExitActions>
                            </DataTrigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <Grid>
        <Button x:Name="btn1" Width="100" Height="100" 
                Content="1"
                ClickMode="Press" Style="{StaticResource newTemplate}" Click="btn1_Click">
        </Button>
        <Button Height="20" Margin="6,35,211,245" RenderTransformOrigin="0.325,-1.2" Click="Button_Click_1">常规高亮显示</Button>
        <Button Height="20" Margin="162,40,55,240" RenderTransformOrigin="0.325,-1.2" Click="Button_Click_2">高亮闪烁显示</Button>
    </Grid>
</Window>

触发器系列（2） DataTrigger,布布扣,bubuko.com

触发器系列（2） DataTrigger

标签：datatrigger   动画   wpf触发器   xaml   控件   

原文地址：http://blog.csdn.net/coolfeiweb/article/details/25594953