动画结束后运行代码

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是窗口的视图模型类.它包含:

• bool MyControlVisible其被绑定到属性MyUserControl的Visibility 属性
• 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是用户控件的视图模型类.它包含:

• string MyUserControlText其被绑定到属性TextBlock的Text 属性
• bool Fading 绑定到边框数据模板的属性,用于使边框淡入或淡出
• 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>

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

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

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

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

或者

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

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