更改背景图像时的动画(C#winrt)

时间:2013-05-05 02:33:00

标签: windows xaml microsoft-metro winrt-xaml

我正在使用Windows 8音乐应用。我正在用当前歌曲/专辑的图像改变页面的背景。我想在更改图像时添加fadeIn / dafeOut动画,但无法弄清楚我该怎么做。

    <Grid  x:Name="LayoutRoot" Background="{StaticResource  ApplicationPageBackgroundThemeBrush}">
        <Grid.Resources>
            <Storyboard x:Name="fadeOutStoryBoard">
                <DoubleAnimation
                    Storyboard.TargetName="LayoutRoot"
                    Storyboard.TargetProperty="(LayoutRoot.Background).(ImageBrush.Opacity)"
                    From="1.0" To="0.0" Duration="0:0:10"/>
            </Storyboard>
            <Storyboard x:Name="fadeInStoryBoard">
                <DoubleAnimation
                    Storyboard.TargetName="LayoutRoot"
                    Storyboard.TargetProperty="(LayoutRoot.Background).(ImageBrush.Opacity)"
                    From="0" To="1.0" Duration="0:0:10"/>
            </Storyboard>
        </Grid.Resources>
    </Grid>

    In C# code: 
    ImageBrush image = new ImageBrush();
    image.ImageSource = new BitmapImage(imageUri);
    fadeOutStoryBoard.Begin();
    MainPage.Current.LayoutRoot.Background = image;
    fadeInStoryBoard.Begin();

图像变化很好但我看不到动画。我尝试将TargetProperty更改为(LayoutRoot.Background).Opacity或(LayoutRoot.Background)。(SolidColorBrush.Opacity)但没有运气。如果我将TargetProperty设置为“Opacity”,则动画可以工作,但适用于整个页面而不仅仅是背景。

1 个答案:

答案 0 :(得分:3)

不要将图像作为页面的背景,添加另一个将保留背景的网格/边框。在动画中使用Opacity作为TargetProperty

原因是当前动画正在处理旧图像画笔而不是您创建的新画面。