Question

我有一个Textblock，当绑定的Text发生变化时，它会动画显示：

<EventTrigger RoutedEvent="Binding.TargetUpdated">
    <BeginStoryboard>
        <Storyboard>
            <DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="0:0:0" To="0.0"/>
            <DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="0:0:1" From="0.0" To="1.0" BeginTime="0:0:0"/>
        </Storyboard>
    </BeginStoryboard>
</EventTrigger>

目前整个Textblock正在逐渐消失，但我希望淡入淡出从左到右。这可能吗？

修改

我用下面的评论解决了我的问题。这是我的解决方案：

<Style x:Key="FadeLeftRightLabel" TargetType="Label">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Label">
                <ContentPresenter>
                    <ContentPresenter.OpacityMask>
                        <LinearGradientBrush StartPoint="0.0,0.5" EndPoint="1.0,0.5">
                            <LinearGradientBrush.GradientStops>
                                <GradientStop x:Name="GradientStop1" Offset="0" Color="Black"/>
                                <GradientStop x:Name="GradientStop2" Offset="0" Color="Transparent"/>
                            </LinearGradientBrush.GradientStops>
                        </LinearGradientBrush>
                    </ContentPresenter.OpacityMask>
                </ContentPresenter>
                <ControlTemplate.Triggers>
                    <EventTrigger RoutedEvent="Binding.TargetUpdated">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="GradientStop1" Storyboard.TargetProperty="Offset" Duration="0:0:1" From="0.0" To="1.0" BeginTime="0:0:0"/>
                                <DoubleAnimation Storyboard.TargetName="GradientStop2" Storyboard.TargetProperty="Offset" Duration="0:0:1" From="0.0" To="1.0" BeginTime="0:0:0"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>                
</Style>

Answer 1

你想要使用＆＃34;不透明面膜＆＃34;由线性渐变画笔制成，在初始/结束颜色中使用alpha。

http://msdn.microsoft.com/en-us/library/ms743320(v=vs.110).aspx#creatingopacitymaskswithgradients

然后为渐变停止点设置动画

http://msdn.microsoft.com/en-us/library/ms748815(v=vs.110).aspx

Answer 2

试试这个，拥有这样的资源，

  <Window.Resources>
        <Storyboard x:Key="Storyboard1" >
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="txttest">
                <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                <EasingDoubleKeyFrame KeyTime="0:0:3" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </Window.Resources>

<强>的TextBlock：

 <Grid x:Name="LayoutRoot" Background="White" Margin="0,0,0,-45">     
       <TextBlock Text="this is to test" FontSize="45" x:Name="txttest" Background="Black" Foreground="White" Margin="0,175,0,114"/>
 </Grid>

在构造函数中，

  var anim = this.Resources["Storyboard1"] as Storyboard;
  if (anim  != null) anim .Begin();

WPF TextBlock从左到右淡入淡出

2 个答案: