更改背景图像时的动画（C# winrt）答案

【问题标题】：Animation while changing background image (C# winrt)更改背景图像时的动画（C# winrt）
【发布时间】：2013-05-05 02:33:00
【问题描述】：

我正在开发 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 设置为“不透明度”，则动画可以工作，但适用于整个页面而不仅仅是背景。

【问题讨论】：

标签： windows xaml microsoft-metro winrt-xaml

【解决方案1】：

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

原因是当前动画正在使用旧的图像画笔，而不是您创建的新画笔。

【讨论】：