ControlStoryboardAction Behavior (Compact 2013)

3/26/2014

A storyboard is one way to create animations in XAML for Windows Embedded applications. After you create a storyboard, this behavior specifies what you want the storyboard to do. The following storyboard actions are supported:

  • Play causes the target storyboard to begin playing.
  • Stop causes the target storyboard to stop playing.
  • TogglePlayPause toggles between playing and pausing the target storyboard.
  • Pause causes the target storyboard to pause.
  • Resume causes the target storyboard to resume playing from the current position.
  • SkipToFill advances the current time of the target storyboard’s clock to the end of its active period.

For example, in the following XAML example, a storyboard has been defined with a simple animation of a Button control. The Click event of the button is associated with a ControlStoryboardAction behavior that will toggle between playing and pausing the storyboard animation each time the button is clicked.

<UserControl.Resources>
   <Storyboard x:Name="Storyboard1">
      <DoubleAnimation Duration="0:0:2.2" To="225.51"
         Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)"
         Storyboard.TargetName="button" d:IsOptimized="True"/>
      <DoubleAnimation Duration="0:0:2.2" To="155.102"
         Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)"
         Storyboard.TargetName="button" d:IsOptimized="True"/>
   </Storyboard>
</UserControl.Resources>

<Grid x:Name="LayoutRoot" Background="White" Margin="0,0,108,111">
   <Button x:Name="button" Content="Button" HorizontalAlignment="Left" Margin="96,71,0,0"
      VerticalAlignment="Top" Width="159" Height="83" RenderTransformOrigin="0.5,0.5">
      <i:Interaction.Triggers>
         <i:EventTrigger EventName="Click">
            <ei:ControlStoryboardAction Storyboard="{StaticResource Storyboard1}"
               ControlStoryboardOption="TogglePlayPause"/>
         </i:EventTrigger>
      </i:Interaction.Triggers>
      <Button.RenderTransform>
         <CompositeTransform/>
      </Button.RenderTransform>
   </Button>
</Grid>

See Also

Concepts

Expression Blend Behaviors in XAML for Windows Embedded
Behaviors, Actions, and Triggers