WPF动画并按顺序更改图像的不透明度答案

【问题标题】：WPF Animate and change Opacity of Image in sequenceWPF动画并按顺序更改图像的不透明度
【发布时间】：2012-06-24 04:11:13
【问题描述】：

我有三张图片，其中两张的动画如下，第三张应该闪烁：

<Window.Resources>
    <Storyboard x:Key="AnimateTarget" RepeatBehavior="Forever">

        <DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Duration="0:00:03" Storyboard.TargetName="img1" Storyboard.TargetProperty="Y">
            <EasingDoubleKeyFrame KeyTime="0:0:0" Value="0" />
            <EasingDoubleKeyFrame KeyTime="0:0:1" Value="200" />
            <EasingDoubleKeyFrame KeyTime="0:0:2" Value="0" />
        </DoubleAnimationUsingKeyFrames>

        <DoubleAnimationUsingKeyFrames BeginTime="0:0:2" Duration="0:00:03" Storyboard.TargetName="img2" Storyboard.TargetProperty="x">
            <EasingDoubleKeyFrame KeyTime="0:0:0" Value="0" />
            <EasingDoubleKeyFrame KeyTime="0:0:1" Value="200" />
            <EasingDoubleKeyFrame KeyTime="0:0:2" Value="0" />
        </DoubleAnimationUsingKeyFrames>

        <DoubleAnimation BeginTime="0:0:4" Duration="0:0:0.5" Storyboard.TargetProperty="(Image.Opacity)" Storyboard.TargetName="img3"  From="1.0" To="0.0" RepeatBehavior="Forever" AutoReverse="True" />

    </Storyboard>
</Window.Resources>

前两个图像的动画效果很好，但第三个图像没有闪烁，它什么也不做，就呆在那里，如您所见，我使用以下代码使第三个图像闪烁：

<DoubleAnimation BeginTime="0:0:4" Duration="0:0:0.5" Storyboard.TargetProperty="(Image.Opacity)" Storyboard.TargetName="img3"  From="1.0" To="0.0" RepeatBehavior="Forever" AutoReverse="True" />

这也是第三张图片的代码：

<Image Height="65" Name="image1" Stretch="Fill" Width="67" Source="/PicTakeWPF;component/Images/422505_110594629067212_100003500265268_37406_1212153553_n.jpg">
    <Image.RenderTransform>
         <TranslateTransform x:Name="img3"></TranslateTransform>
    </Image.RenderTransform>
</Image>

如果有人在这方面帮助我，我将不胜感激谢谢，

【问题讨论】：

标签： c# wpf xaml animation opacity

【解决方案1】：

尝试使用图像对象的名称 (image1) 作为不透明动画的 Storyboard.TargetName

<DoubleAnimation BeginTime="0:0:4" Duration="0:0:0.5" Storyboard.TargetProperty="(Image.Opacity)" Storyboard.TargetName="image1"  From="1.0" To="0.0" RepeatBehavior="Forever" AutoReverse="True" />

因为不透明度是图像本身的一个属性，所以其他 2 个动画会影响图像对象的平移，这就是您为这些动画使用 TranslateTransform 名称的原因。

你甚至不需要添加

<Image.RenderTransform>
    <TranslateTransform x:Name="img3"></TranslateTransform>
</Image.RenderTransform>

第三张图片（如果您不打算为翻译制作动画）。

【讨论】：