带有 TranslateTransform 的 WPF 故事板答案

【问题标题】：WPF Storyboard with TranslateTransform带有 TranslateTransform 的 WPF 故事板
【发布时间】：2015-01-22 08:17:41
【问题描述】：

我有一个故事板，例如

<Storyboard x:Key="NewsFlow">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" 
                                       Storyboard.TargetName="TextBlock" 
                                       RepeatBehavior="Forever" AutoReverse="True">
            <EasingDoubleKeyFrame KeyTime="0:0:0" Value="-80"/>
            <EasingDoubleKeyFrame KeyTime="0:0:2" Value="80"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>

和网格

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="1*" />
        <RowDefinition Height="100" />
        <RowDefinition Height="1*" />
    </Grid.RowDefinitions>
    <Border Grid.Row="1" Background="BlanchedAlmond"></Border>
    <TextBlock Grid.Row="1" Text="News" FontSize="40" HorizontalAlignment="Center" ></TextBlock>

</Grid>

Grid.Row="1" 是新闻查看区（黄线）

但是 Storyboard 忽略了像图片一样的 Grid.RowDefinitions

我想要这个

如果您创建故事板应该像这样工作：

    <Storyboard x:Key="NewsFlow">
        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" 
                                       Storyboard.TargetName="TextBlock" 
                                       RepeatBehavior="Forever" AutoReverse="True">
            <EasingThicknessKeyFrame KeyTime="0:0:0" Value="0,0,0,150"/>
            <EasingThicknessKeyFrame KeyTime="0:0:1" Value="0,0,0,0"/>
            <EasingThicknessKeyFrame KeyTime="0:0:2" Value="0, 150,0,0"/>
        </ThicknessAnimationUsingKeyFrames>
    </Storyboard>

但 Margin 落后于 TranslateTransform。而Textblock在动画播放过程中另一边坏掉了

谢谢你，问候

【问题讨论】：

标签： c# wpf

【解决方案1】：

<Window.Resources>
    <Storyboard x:Key="NewsFlow">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" 
                                       Storyboard.TargetName="News" 
                                       RepeatBehavior="Forever" AutoReverse="True">
            <EasingDoubleKeyFrame KeyTime="0:0:00" Value="-80"/>
            <EasingDoubleKeyFrame KeyTime="0:0:02" Value="80"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>
</Window.Resources>
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="100" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Border Grid.Row="1" Background="BlanchedAlmond"/>
    <TextBlock Grid.Row="1" x:Name="News" Text="News" FontSize="40" HorizontalAlignment="Center">
        <TextBlock.Triggers>
            <EventTrigger RoutedEvent="Loaded">
                <BeginStoryboard Storyboard="{StaticResource NewsFlow}"/>
            </EventTrigger>                              
        </TextBlock.Triggers>
    </TextBlock>
</Grid>

【讨论】：