wpf - 动画完成后运行代码

Question

我正在使用 MVVM Light。我创建了一个如下所示的窗口:

<Window Name="MainWindow" ...>
  <Window.Resources>
    ...
    <viewModels:MainViewModel x:Key="mainVM" />
    ...
    <BooleanToVisibilityConverter x:Key="visConv" />
    ...
  </Window.Resources>

  <Grid DataContext="{StaticResource mainVM}>
    ...
    <Button Command="{Binding RaiseMyControl}" />
    ...
    <my:MyUserControl Visibility="{Binding MyControlVisible, 
        Converter={StaticResource visConv}}" />
  </Grid>

</Window>

基本上，MainViewModel 是窗口的 View 模型类。它包含:

• bool MyControlVisible 属性，绑定(bind)到 MyUserControl 的 Visibility属性(property)
• RelayCommand RaiseMyControl 命令，其目的是设置将 MyControlVisible 属性设置为 true(默认为 false)。

单击窗口中的按钮会出现 MyUserControl - 简单。

MyUserControl 用户控件如下所示:

<UserControl ...>
  <UserControl.Resources>
    ...
    <viewModels:MyUserControlViewModel x:Key="userControlVM" />
    ...
  </UserControl.Resources>

  <Grid DataContext="{StaticResource userControlVM}>
    ...
    <Border Width="200" Height="100" Background="Red">
      <TextBlock Text="{Binding MyUserControlText}" />
    </Border>
    <!-- This border has a DataTrigger bound to "bool Fading" property of 
         the view model. When Fading is true, the border fades in through 
         an animation. When it is false, the border fades out. -->
    ...
    <Button Command="{Binding CloseMyControl}" />
  </Grid>

</UserControl>

同样，非常简单。 MyUserControlViewModel 是用户控件的 View 模型类。它包含:

• string MyUserControlText 属性，绑定(bind)到 TextBlock 的 Text属性(property)
• bool Fading 属性，绑定(bind)到边框的数据模板，用于制作边框淡入或淡出
• RelayCommand CloseMyControl 命令执行两件事: 1. 它设置 Fading属性设置为 false 以使边框淡出，并且 2. 设置 Visibility将用户控件的属性设置为 Collapsed。

问题是:一旦Visibility 设置为Collapsed，用户控件就会消失。我需要它先淡出，然后再消失。我怎样才能实现它？谢谢。

Answer 1

由于可见性属于淡出，我会同时运行两个动画。除了淡入淡出动画(无论何种类型或复合)之外，您还可以创建一个ObjectAnimationUsingKeyFrames，它在淡入淡出结束的关键时间设置可见性。

XAML 示例:

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility">
    <DiscreteObjectKeyFrame KeyTime="0:0:0.5">
        <DiscreteObjectKeyFrame.Value>
            <Visibility>Collapsed</Visibility>
        </DiscreteObjectKeyFrame.Value>
    </DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>

此外，所有 Storyboard和动画都有一个 Completed 事件，您可以订阅该事件并立即设置值。

<小时/>

要将动画定向到另一个控件，请使用 Storyboard.Target 进行复杂引用，或使用 Storyboard.TargetName 进行名称引用。

要为 UserControl 设置动画，您可以尝试:

Storyboard.Target="{Binding RelativeSource={RelativeSource AncestorType=UserControl}}"

或

Storyboard.Target="{Binding RelativeSource={RelativeSource AncestorType=my:MyUserControl}}"

如果逻辑树完好无损，两者都应该有效。