How can I use a DataTrigger to start a storyboard?

animation, mvvm, storyboard, wpf, xaml

Solution

I'm not actually sure if you can, but if you can, then you'd need to use the `DataTrigger.EnterActions` Property, which is applied when the trigger object becomes active:

<UserControl.Style>
   <Style>
      <Style.Triggers>
         <DataTrigger Binding="{Binding StandbyViewModel.LeavingStandbyView}" Value="true">
             <DataTrigger.EnterActions>
                <BeginStoryboard>
                   <Storyboard>
                      <DoubleAnimationUsingKeyFrames ...>

Problem

it's my first time asking a question here and it is on a subject I'm a total newbie with so please bear with me here... I'm developing a WPF GUI application with the MVVM architecture, and the approach my team and I are taking is to have multiple views that will have to 'fly on and off' the screen as the UI goes through it's motions. The problem we're facing is how to have animations run while the UI is transitioning from one view to another. I have a button on my main view that when pressed will change a property letting one view know it needs to leave, which I have been trying to bind to the beginning of my animation. I have timers set up that will delay the view change for the duration of my storyboard animation, but I can't get my animation to run! In XAML I have my set my storyboard (generated in Blend) up within the DataTrigger like this: ``` <UserControl.Style> <Style> <Style.Triggers> <DataTrigger Binding="{Binding StandbyViewModel.LeavingStandbyView}" Value="true"> <BeginStoryboard> <Storyboard> <DoubleAnimationUsingKeyFrames ...> // I've got 22 of these statements in my storyboard ``` I am getting problems on the DoubleAnimationUsingKeyFrames lines with the Storyboard.TargetName="label" property that Blend generated that addresses each part of the UI that I am animating. The error I'm getting is: ``` TargetName property cannot be set on a Style Setter ``` It seems like I am not allowed to use the TargetName property here, but how else would I specify which animation maps to which UI component? I've got 7 UI elements that I am moving and changing opacity on during the 0.5 second animation I created, so I'm imagining I have to have some way to identify each one of them. Is my method here no good, or am I just doing something wrong? I've been reading lots of different posts about this and I'm uncertain on what to do. It seems like there are strict rules on what types of triggers and UserControls can do, but I do not know any of them. Any help or advice would be greatly appreciated.

Original source