Ball moves following spline key frames : Ball « Animations « Silverlight

1. Silverlight
2. Animations
3. Ball

Ball moves following spline key frames

    

<UserControl x:Class='SilverlightApplication3.MainPage'
    xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation' 
    xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'
    xmlns:d='http://schemas.microsoft.com/expression/blend/2008' 
    xmlns:mc='http://schemas.openxmlformats.org/markup-compatibility/2006' 
    mc:Ignorable='d' 
    d:DesignWidth='640' 
    d:DesignHeight='480'>
  <Canvas Margin="5">
    <Ellipse Name="ball2" Canvas.Left="10" Canvas.Top="160" Width="20" Height="20">
      <Ellipse.Fill>
        <RadialGradientBrush>
          <GradientStop Color="Gold" Offset="0" />
          <GradientStop Color="Red" Offset="1" />
        </RadialGradientBrush>
      </Ellipse.Fill>
    </Ellipse>
    <Canvas.Triggers>
      <EventTrigger RoutedEvent="StackPanel.Loaded">
        <EventTrigger.Actions>
          <BeginStoryboard>
            <Storyboard>
              <DoubleAnimationUsingKeyFrames
                Storyboard.TargetName="ball2"
                Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:10"
                RepeatBehavior="Forever">
                <SplineDoubleKeyFrame Value="160"
                  KeyTime="0:0:1" KeySpline="0.25,0.5,0.75,1" />
                <SplineDoubleKeyFrame Value="310"
                  KeyTime="0:0:40" KeySpline="0.25,0.0 0.75,0.5" />
              </DoubleAnimationUsingKeyFrames>
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger.Actions>
      </EventTrigger>
    </Canvas.Triggers>
  </Canvas>
</UserControl>

   
    
    
    
  

Related examples in the same category

1.	Bouncing Ball with DoubleAnimationUsingKeyFrames
2.	Bouncing Ball with DoubleAnimation
3.	Ball moves in a constant speed
4.	Bounding ball