Wpf 如何在ViewModel中播放情节提要？

我在看一个故事

  <Storyboard x:Key="ExpandAdd" >
            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="AddUsers" Storyboard.TargetProperty="(UIElement.Visibility)">
                <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Collapsed}"/>
                <DiscreteObjectKeyFrame KeyTime="00:00:00.3000000" Value="{x:Static Visibility.Visible}"/>
            </ObjectAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="DetailBorder" Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                <SplineDoubleKeyFrame KeyTime="00:00:00.3000000" Value="0.4"/>
            </DoubleAnimationUsingKeyFrames>
            <BooleanAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="DetailBorder" Storyboard.TargetProperty="(UIElement.IsEnabled)">
                <DiscreteBooleanKeyFrame KeyTime="00:00:00" Value="False"/>
            </BooleanAnimationUsingKeyFrames>
        </Storyboard>

我有一个按钮并绑定到一个relaycommand

<Button x:Name="AddUserButton"  Content="اضافه">
   <i:Interaction.Triggers>
      <i:EventTrigger EventName="Click">
        <cmd:EventToCommand Command="{Binding AddUsers}"/>
      </i:EventTrigger>
   </i:Interaction.Triggers>
</Button>

---

我想在执行RelayCommand（AddUsers）时播放情节提要。

请不要从viewmodel触发情节提要。如果这样做，则没有必要使用viewmodel

在视图的代码隐藏中实现中继命令的任何代码，然后如果需要，可以调用viewmodel来执行任何操作

---

这是视图模型特有的。当您从视图的代码隐藏中引用情节提要时，您可以通过名称来引用它。

您可以从代码隐藏中调用情节提要，只要您为它指定了x:name。但是，您需要实现一个按钮单击事件处理程序，而不是ViewModel的命令

---

如果您使用的是MVVM，那么您应该真正遵守ViewModel不应该“知道”视图的细节的原则。

您不应该从您的

ViewModel

访问

情节提要。它完全违背了
MVVM
的目的

您可以在
按钮上应用情节提要。LostMouseCapture
事件，该事件在
单击
事件-

<Button x:Name="AddUserButton"  Content="اضافه">
   <i:Interaction.Triggers>
      <i:EventTrigger EventName="Click">
        <cmd:EventToCommand Command="{Binding AddUsers}"/>
      </i:EventTrigger>
   </i:Interaction.Triggers>
   <Button.Triggers>
       <EventTrigger RoutedEvent="Button.LostMouseCapture">
            <BeginStoryboard Storyboard="{StaticResource ExpandAdd}">
       </EventTrigger>
   </Button.Triggers>
</Button>

实际上，通过使用绑定到ViewModel中的属性的DataTrigger，可以相对容易地做到这一点，从而在保持关注点分离的同时从MV触发情节提要。下面是一个非常简单的示例，故事板会根据VM中的bool变为True而增大图像的大小

<Image
    Grid.Row="0" 
    x:Name="LockImage"
    Source="/StoryboardManagerExample;component/Resources/LockedPadlock.png" 
    Width="50"
    RenderTransformOrigin="0.5,0.5">

    <Image.RenderTransform>
        <TransformGroup>
            <ScaleTransform x:Name="ptScale" ScaleX="1" ScaleY="1"/>
            <SkewTransform />
            <RotateTransform />
            <TranslateTransform />
        </TransformGroup>
    </Image.RenderTransform>

    <Image.Style>
        <Style>
            <Style.Triggers>
                <DataTrigger
                    Binding="{Binding RunStoryboard}" Value="True">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation
                                Storyboard.TargetProperty="Width"
                                From="50"
                                To="100"
                                Duration="0:0:1"
                                RepeatBehavior="1x"
                                AutoReverse="True"
                                />

                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Image.Style>
</Image>


对于UWP：您可以在
VisualStates
中定义情节提要，并通过更改ViewModel中的属性来运行它。如果将
IsRefreshWorking
属性更改为
true
动画开始

使用IsTrueTrigger定义VisualState：



带有动画的AppBarButton：

<AppBarButton>
  <AppBarButton.Icon>
     <SymbolIcon x:Name="RefreshIcon"  Symbol="Refresh" RenderTransformOrigin="0.5,0.5" >
         <SymbolIcon.RenderTransform>
            <CompositeTransform/>
         </SymbolIcon.RenderTransform>
      </SymbolIcon>
  </AppBarButton.Icon>
</AppBarButton>


您不需要使用行为-
按钮
控件在本机上支持
命令
，因此您可以这样做：
谢谢，但我想在
添加用户
执行时使用它，我可以在
事件命令
执行时使用行为来运行故事板吗？