Rotating an Image with WPF in XAML

13 11 2009

So… pasting code is still tricky. But I think this will work. This code is what I used when I wanted to rotate an Image object declared in XAML. To be clear, this allows me to create a rotating image without any C# or VB code. Personally I chose to rotate this picture:

Loading 2
The CenterX and CenterY property of RotateTransform should be half of the Image objects width and height. This can be found by using databindings but that’s another post completely.  

<Style x:Key="AnimationImage" TargetType="{x:Type Image}">

    <Setter Property="RenderTransform">


            <RotateTransform Angle="0" CenterX="20" CenterY="20" />





        <Trigger Property="IsEnabled" Value="true">




                       <DoubleAnimation Storyboard.TargetProperty="RenderTransform.Angle"

                        From="0" To="360" Duration="0:0:1.5" RepeatBehavior="Forever" />









8 responses

28 02 2010
How to post sourcecode to Wordpress « Fragile Development

[…] to WordPress 28 02 2010 Ok, so maybe I did a post like this before with a less than stellar result. At least it was better than my new solutions where I paste images and raw black text into the […]

12 02 2011

how to flip an image in wpf

8 10 2011


18 11 2011

exactly what i was looking for. thanks

17 12 2011
Eren Ersönmez

Thank you for this post. If you run this code above, it doesn’t look exactly like the gif animation above it. The visual trick in this image is that, the individual “ticks” (or “lines”) always occupy the same top-of-the-hour clock positions (12 o’clock, 1 o’clock, etc.) — and never appear in-between. When you run the code above, WPF renders frames at a high rate (60 fps by default) so the “ticks” smoothly move between clock positions, which undesirably changes the effect. To make it look exactly like the gif above, you need change the duration to 1s and make the frame rate 12 fps like this:

17 12 2011
Eren Ersönmez

Sorry, the XAML didn’t show up…
<Storyboard Timeline.DesiredFrameRate="12"> <DoubleAnimation Storyboard.TargetProperty="RenderTransform.Angle" From="0" To="360" Duration="0:0:1" RepeatBehavior="Forever"/></Storyboard>

29 08 2012
Rotate an Image in WPF Using Just XAML «

[…] solution is based on this post. Share this:EmailDiggFacebookTwitterLike this:LikeBe the first to like this. Posted by […]

9 04 2018

I was trying to use PlaneProjection in my XAML project but i get unknown member type .PlaneProjection

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: