creating animated rolling balls WPF in VB.NET
This article shows you how to create animated rolling balls in WPF.
In this article, I will create animated rolling bolls in WPF.
The below code project shows four animated rolling balls in same direction.
<Window x:Class="WpfApplication1.RollingBall"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Rolling Balls" Height="350" Width="518">
<Border BorderBrush="Gray" BorderThickness="1" Margin="4">
<Canvas>
<Rectangle Fill="Gray" Width="500" Height="5"
Canvas.Top="60" />
<Ellipse x:Name="ellipse1" Width="50" Height="50"
Stroke="green" Canvas.Top="10" Canvas.Left="0">
<Ellipse.Fill>
<LinearGradientBrush>
<GradientStop Color="green" Offset="0.2" />
<GradientStop Color="white" Offset="0.8" />
</LinearGradientBrush>
</Ellipse.Fill>
<Ellipse.RenderTransform>
<RotateTransform x:Name="ellipse1Rotate"
CenterX="25" CenterY="25" />
</Ellipse.RenderTransform>
</Ellipse>
<Rectangle Fill="Gray" Width="500" Height="5"
Canvas.Top="130" />
<Ellipse x:Name="ellipse2" Width="50" Height="50"
Stroke="blue" Canvas.Top="80" Canvas.Left="0">
<Ellipse.Fill>
<LinearGradientBrush>
<GradientStop Color="blue" Offset="0.8" />
<GradientStop Color="Lightblue" Offset="0.2" />
</LinearGradientBrush>
</Ellipse.Fill>
<Ellipse.RenderTransform>
<RotateTransform x:Name="ellipse2Rotate"
CenterX="25" CenterY="25" />\
</Ellipse.RenderTransform>
</Ellipse>
<Rectangle Fill="Gray" Width="500" Height="5"
Canvas.Top="200" />
<Ellipse x:Name="ellipse3" Width="50" Height="50"
Stroke="red" Canvas.Top="150" Canvas.Left="0">
<Ellipse.Fill>
<LinearGradientBrush>
<GradientStop Color="red" Offset="0.8" />
<GradientStop Color="pink" Offset="0.2" />
</LinearGradientBrush>
</Ellipse.Fill>
<Ellipse.RenderTransform>
<RotateTransform x:Name="ellipse3Rotate"
CenterX="25" CenterY="25" />
</Ellipse.RenderTransform>
</Ellipse>
<Rectangle Fill="Gray" Width="500" Height="5" Canvas.Top="270" />
<Ellipse x:Name="ellipse4" Width="50" Height="50" Stroke="yellow" Canvas.Top="220" Canvas.Left="0">
<Ellipse.Fill>
<LinearGradientBrush>
<GradientStop Color="yellow" Offset="0.5" />
<GradientStop Color="orange" Offset="0.2" />
</LinearGradientBrush>
</Ellipse.Fill>
<RotateTransform x:Name="ellipse4Rotate" CenterX="25" CenterY="25" />
</Ellipse.RenderTransform>
</Ellipse>
</Canvas>
</Border>
</Window>
Animated Rolling Ball
SUMMARY
I hope you will enjoy and learn a interesting animation in WPF.