c# - 在 WPF 中创建 'wipe' 动画

Question

我希望使用 WPF 在 Microsoft PowerPoint 中创建类似于“删除”动画的动画。

简单地说，我希望图像在 1 秒内从左到右淡入。

这是我目前使用的 XAML，它可以同时淡化所有图像:

<Window x:Class="WpfApplication2.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfApplication2"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525" Background="Purple" Loaded="Window_Loaded">
    <Window.Resources>
        <Storyboard x:Key="fade">
            <DoubleAnimation From="0" To="1" Duration="0:0:1"
                             Storyboard.TargetName="logo"
                             Storyboard.TargetProperty="Opacity"/>

        </Storyboard>
    </Window.Resources>
    <Grid>
        <Image Source="image.png" x:Name="logo"/>
    </Grid>
</Window>

在后面的代码中，我只是在窗口加载时播放动画:

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    BeginStoryboard((Storyboard)FindResource("fade"));
}

为了使图像淡入类似于 PowerPoint 上的删除动画，我需要在 Storyboard 标签中添加什么？

Answer 1

自己从 this 找到了答案博客文章。我需要实现我需要的效果的代码与帖子中的代码相同，但我不需要第一张图片。 (不明飞行物.jpg)

    <Window x:Class="LearnWPF.WipeEffect.Window1"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      Title="LearnWPF.WipeEffect" Height="500" Width="700" Name="mainWindow">
    <Grid>
      <!--First image not needed.-->
      <!--<Image Source="Images/UFO.jpg" />-->
      <Image Source="Images/ladder.jpg">
        <Image.OpacityMask>
          <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
              <GradientStop Offset="0" Color="Black" x:Name="BlackStop"/>
              <GradientStop Offset="0" Color="Transparent" x:Name="TransparentStop"/>
          </LinearGradientBrush>
        </Image.OpacityMask>
      </Image> 
    </Grid>
  <Window.Triggers>
    <EventTrigger RoutedEvent="Window.Loaded">
      <EventTrigger.Actions>
        <BeginStoryboard>
          <Storyboard>
            <!--Duration changed to half a second as this is what I need. -->
            <DoubleAnimation Storyboard.TargetName="TransparentStop"
                             Storyboard.TargetProperty="Offset" By="1"  Duration="0:0:0.5"   />
            <DoubleAnimation Storyboard.TargetName="BlackStop"
                             Storyboard.TargetProperty="Offset" By="1" Duration="0:0:0.5"
                             BeginTime="0:0:0.05" />
          </Storyboard>
        </BeginStoryboard>
      </EventTrigger.Actions>
    </EventTrigger>
  </Window.Triggers>
  </Window>