How to: Seek a Storyboard

How to: Seek a Storyboard

The following example shows how to use the Seek method of a Storyboard to jump to any position in a storyboard animation.

Below is the XAML markup for the sample.

<Page xmlns="" 
  <StackPanel Margin="20" >

    <Rectangle Name="myRectangle"
      Width="10" Height="20" Fill="#AA3333FF" HorizontalAlignment="Left" >
        <EventTrigger RoutedEvent="Rectangle.Loaded">
          <BeginStoryboard Name="myBeginStoryboard">
            <Storyboard Name="myStoryboard" Duration="0:0:4">
                Duration="0:0:4" From="10" To="500"/>


    <!-- Use this slider to seek to different points of the Storyboard Duration 
         (in milliseconds). -->
    <Slider Name="SeekSlider" ValueChanged="OnSliderValueChanged" Height="Auto" 
    Width="500" Minimum="0" Maximum="4000" HorizontalAlignment="Left" />


Below is the code used with the XAML code above.

using System;
using System.Media;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media.Animation;

namespace SDKSample

    public partial class SeekStoryboardExample : Page
        private void OnSliderValueChanged(object sender, RoutedEventArgs e)
            int sliderValue = (int)SeekSlider.Value;

            // Use the value of the slider to seek to a duration value of the Storyboard (in milliseconds).
            myStoryboard.Seek(myRectangle, new TimeSpan(0, 0, 0, 0, sliderValue), TimeSeekOrigin.BeginTime);


© 2015 Microsoft