Squeeze Ball Animation in XAML

By Mahesh Chand May 07, 2008
This XAML code creates a ball that gives an impression of squeezing a sponge ball.

This animation start with ball in Image 1 and ends with ball in Image 2 and continues indefinitely.
 

Image 1.

Image 2.

Providing this animation in XAML is simply Stodyboard DoubleAnimation with changing TargetProperty Height from 100 to 200 and repeat it forever.

Here is the sample XAML code:

<Window
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 x:Class="AnimationXAML.Window1"
 x:Name="Window"
 Title="Window1"
 Width="640" Height="480">
 <Grid x:Name="LayoutRoot" Margin="10" >
 
 
 <Ellipse
   Name="RedBall"
   Width="200"
   Height="200"
   Fill="Red"> 
   <Ellipse.Triggers>
     <EventTrigger RoutedEvent="Ellipse.Loaded">
       <BeginStoryboard>
         <Storyboard>
           <DoubleAnimation
             Storyboard.TargetName="RedBall"
             Storyboard.TargetProperty="Height"
             From="100" To="200" Duration="0:0:5"
    AutoReverse="True"  RepeatBehavior="Forever"/>   
      </Storyboard>
       </BeginStoryboard>
     </EventTrigger>
   </Ellipse.Triggers>
 </Ellipse>
 
  </Grid>
</Window>

Mahesh Chand

Mahesh Chand is founder of C# Corner. C# Corner founded in 1999 is a FREE member contributions based open platform for developers to solve problems, learn new technology and hang out.  Mahesh has been awar... Read more

COMMENT USING

PREMIUM SPONSORS

Hire Mobile & Web Developer on demand. 100% satisfaction. Try for 1 week or Money Back. Local and remote developers available all over USA.

Latest Blogs