Windows Phone 8 - 创建"淡入和滑入"动画

Question

我在这里看过有关如何创建图像滑入效果的帖子,但是我正在尝试将Windows Phone 8项目中的TextBlock动画设置为同时"滑入和淡入",只是给我的应用程序"时髦"的感觉.我当前的代码针对不透明度的StoryBoard.Target属性而且有效,我只是对如何设置不透明度的动画感到困惑而且我猜测"滑入"效果它将是"X"属性的TextBlock,两者同时出现.我目前对Opacity的代码如下:

<phone:PhoneApplicationPage.Resources>
    <Storyboard x:Name="StoryBoard1">
        <DoubleAnimation Storyboard.TargetName="Txt2"
                         Storyboard.TargetProperty="Opacity"
                         From="0" To="1" Duration="0:0:1"
                         Completed="DoubleAnimation_Completed_1"/>
    </Storyboard>

很好很简单,现在我如何将它与"幻灯片"动画动画相结合,任何人都可以指导我对代码进行哪些更改以达到前面所述的预期效果？任何书面样本都将是一个很大的好处.

提前致谢.

Answer 1

根据布局来设置"滑入"动画可能会很棘手 - 问题是你真的需要从"容器宽度"动画X,这可能比听起来更难.但通常只需硬编码一个值就足够了.

所以,如果你有一个Canvas,那么你可以简单地制作动画Canvas.X.否则,您必须向TranslateTransform目标元素添加a ,并为其X属性设置动画.

<Grid>
    <TextBlock x:Name="Txt2" Text="foo">
        <TextBlock.RenderTransform>
            <TranslateTransform x:Name="translateTransform" X="500" />
        </TextBlock.RenderTransform>
    </TextBlock>
</Grid>

然后将第二个动画添加到Storyboard:

<Storyboard x:Name="StoryBoard1">
    <DoubleAnimation Storyboard.TargetName="Txt2"
                     Storyboard.TargetProperty="Opacity"
                     From="0" To="1" Duration="0:0:1"
                     Completed="DoubleAnimation_Completed_1"/>
    <DoubleAnimation Storyboard.TargetName="translateTransform"
                     Storyboard.TargetProperty="X"
                     From="500" To="0" Duration="0:0:1"/>
</Storyboard>