A Simple WPF Loading Animation

Category:UncategorizedTag: , , , :

Okay, so I needed a very simple and clean loading animation for a multi threaded application I was working on to notify the user that something was in the process of being loaded.  So of course the first place I looked was Google, because I figured someone else has already written one and I could save myself some time by just using theirs.  Well, after almost an hour searching, I found nothing.  So much for being a timesaver.  Now, don?t get me wrong, I found a couple of WPF animations out there, but none of them really fit what I needed.  So I just decided to bite the bullet and create my own.  After creating the animation I decided to share the fruits of my labor so that anyone else who is looking for the same thing I was, or something similar, wouldn?t have as much trouble as I did.

Here is what it looks like.

loadingAnimation

Here is the source: Download the Loading Animation Source

I hope it is useful to someone besides me.

18 thoughts on “A Simple WPF Loading Animation

  1. now 2011, I found other examples, but still, I like yours better
    thanks for sharing

  2. Thanks for your animation. Though we found it consumes lots of CPU once u load it. CPU usages doesn’t go back to zero even if you hide it ( collapsed ) .

  3. Great, this looks very professional and that it’s 100% XAML without relying on any hand-coded timer stuff is a nice bonus.

    I have cleaned the code up slightly for my own use, replacing the “Block” control with a Path referencing a static resource, replacing the TransformGroups with just a single RotateTransform and using LinearColorKeyFrames instead of SplineColorKeyFrames (there is a very small hickup when the animation loops that I attribute to the spline).

    Here’s my cleaned-up version as a single Xaml file:
    http://pastebin.com/HtVyNpxc

  4. If you take Markus’ code and replace the color in the Fill (Path) with Fill=”{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}” then u can directly set the color from the User Control Foreground.

Comments are closed.

Find me

RSS
Facebook
Twitter
LinkedIn

Disclaimer

The opinions and content expressed here are my own and not those of my employer.