WPF - 动画用户控件

Question

你好

我正在制作一个WPF应用程序，由于我对WPF相当陌生，所以遇到了一些困难。我已经在Google上搜索了我的问题，但没有太大的成功。当前情况如下，主窗口的XAML如下：

<Grid Height="279" HorizontalAlignment="Left" Margin="166,0,0,0" Name="gridScoreboard" VerticalAlignment="Top" Width="808">
    <!--Scoreboard Image-->
    <Image Source="pack://application:,,,/Images/Style/Scoreboard.png" Width="517" Height="91" HorizontalAlignment="Left" Margin="138,1,0,0" Name="image1" Stretch="Fill" VerticalAlignment="Top" />

    <Canvas Name="canvasRacePlayer1" Width="14" Height="14" Canvas.Left="33" Canvas.Top="66" Background="Transparent" MouseLeftButtonDown="canvasRacePlayer1_MouseLeftButtonDown" Margin="171,70,623,195" />
    <local:ucRaces HorizontalAlignment="Center" Margin="93,62,632,187" Width="78" Visibility="Hidden" x:Name="ucRacesP1" Height="33" />
</Grid>

用户控件（ucRaces）从一开始就被隐藏，一旦小画布（canvasRacePlayer1）被单击，用户控件将被显示。然而，我希望这个用户控件可以从某个点“滑动”从右到左。就像它会逐渐变得可见一样。我已经找到了关于矩形和按钮动画的信息，但对于用户控件来说并没有真正成功的方法。

提前感谢你

- user525192

Answer 1

如果您要为WPF项目创建动画，我建议您使用Expression Blend。您可以使用EB设计程序，并使用Visual Studio实现其功能。编写XAML语法或C#代码会很难制作动画。

如何使用EB对用户控件进行动画处理呢？实际上非常简单。首先打开现有的WPF项目。然后，转到文件->新建项目->用户控件，并创建用户控件。然后，如果您想将其添加到项目中，请切换回在EB中打开的WPF项目，并单击位于屏幕左侧工具栏上的右箭头（>>），然后转到项目->[您的用户控件名称]。现在您已将其添加到项目中。

如果您要对用户控件进行动画处理，则必须向时间轴添加StoryBoard。当您在EB中的WPF项目上时，在对象和时间轴下，单击加号（+）符号并添加一个新的StoryBoard。现在，您拥有一个时间轴，您需要使用它来对用户控件进行动画处理。您可以在时间轴上放置KeyTime属性，并定义用户控件从位置A到位置B的路径，以及如果您希望用户控件逐渐变得可见，则可以定义其不透明度级别。

您可以添加另一个用户控件，并为第二个用户实现其逻辑。Expression Blend将使您的生活更加轻松。

- user1234567

Answer 2

将您的UserControl进行动画处理与对任何其他WPF对象进行动画处理的方式没有太大的区别：您可以使用ThicknessAnimation来动画化边距，或者将您的用户控制放入其自己的画布中，然后对用户控件的Canvas.Left属性进行动画处理。在后一种情况下，请注意将属性名称括在括号中：Storyboard.TargetProperty="(Canvas.Left)"。

- Heinzi