1

我想创建一个故事板,通过在屏幕中心左右滑动两个 TextBlock 来为它们设置动画。我已经尝试在Blend for Visual Studio中旋转 TextBlocks 和使用Global OffsetLocal Offset属性,还手动使用at specific的 Translate X 和 Translate Y 属性。ProjectionRenderTransformKeyrames

故事板确实开始并在 Blend 中看起来很完美,但是在实际设备上运行时,TextBlocks 不会出现在屏幕的中心 - 有时它们在左上角,有时在左下角,有时我几乎看不到 TextBlocks 的末端。

如何让我的 TextBlocks 保留它们的位置?

动画看起来像这样-> http://share.bannersnack.com/F9C55FD9E8C/bxt5w58pg

我希望他们看起来像这样

在此处输入图像描述

4

1 回答 1

0

请记住定义您的RenderTranformCompositeTransform

然后你可以乱用动画键值来实现你想要的。

我使用 Rotation 来实现 diag,使用 2 easing 动画来实现幻灯片,并使用颜色动画来实现淡入淡出。您所要做的就是更改动画的持续时间和结束值以实现您想要的。

<TextBlock x:Name="textbox1" Text="Super Awesome Diag Text" RenderTransformOrigin="0.5,0.5" UseLayoutRounding="False" d:LayoutRounding="Auto" Margin="0,200,0,0" >
    <TextBlock.RenderTransform>
        <CompositeTransform Rotation="330"/>                    
    </TextBlock.RenderTransform>         
    <TextBlock.Triggers>
        <EventTrigger RoutedEvent="TextBlock.Loaded">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="textbox1">
                        <EasingDoubleKeyFrame KeyTime="0" Value="200"/>
                        <EasingDoubleKeyFrame KeyTime="0:0:1" Value="0" />
                    </DoubleAnimationUsingKeyFrames>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="textbox1">
                        <EasingDoubleKeyFrame KeyTime="0" Value="-200"/>
                        <EasingDoubleKeyFrame KeyTime="0:0:1" Value="100" />
                    </DoubleAnimationUsingKeyFrames>
                    <ColorAnimation Storyboard.TargetName="textbox1" Storyboard.TargetProperty="(TextBlock.Foreground).Color" From="Transparent" To="Red" Duration="0:0:1" />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>                    
    </TextBlock.Triggers>               
</TextBlock>
于 2014-11-11T21:31:48.877 回答