A new library to display animated GIFs in XAML apps

A few years ago, I wrote an article that showed how to display an animated GIF in WPF. The article included the full code, and was quite successful, since WPF had no built-in support for animated GIFs. Based on the issues reported in the comments, I made many edits to the code in the article. At some point I realized it was very impractical, so I published the code on CodePlex (it has now moved to GitHub) under the name WpfAnimatedGif, and started maintaining it there. It was my first serious open-source project, and it was quite popular.

As bug reports started coming in, a serious issue was quickly identified: the library was using a huge amount of memory. There were a few leaks that I fixed, but ultimately the problem was inherent to the way the library worked: it prepared all frames in advance, keeped them in memory, and displayed them in turn using an WPF animation. Having all the frames pre-rendered in memory was reasonable for small images with few frames, but totally impractical for large GIF animations with many frames.

Changing the core of the library to use another approach might have been possible, but there were other issues I wanted to address. For instance, it relied heavily on WPF imaging features, which made it impossible to port it to Windows Phone or Windows Store apps. Also, some parts of the code were quite complex and inefficient, partly because of my initial choice to specify the image as an ImageSource, and changing that would have broken compatibility with previous versions.

WpfAnimatedGif is dead, long live XamlAnimatedGif!

So I decided to restart from scratch to address these issues, and created a new project: XamlAnimatedGif (as you can see, I’m not very imaginative when it comes to names).

On the surface, it seems very similar to WpfAnimatedGif, but at its core it uses a completely different approach. Instead of preparing the frames in advance, they are rendered on the fly using a WriteableBitmap. This approach uses more CPU, but much less RAM. Also, in order to be portable, I couldn’t rely on WPF’s built-in image decoding, so I had to implement a full GIF decoder, including LZW decompression of the pixel data. Matthew Flickinger’s article “What’s In A GIF” was a big help.

The basic usage is roughly the same: just set an attached property on an Image control to specify the GIF animation source.

<Image gif:AnimationBehavior.SourceUri="/images/working.gif" />

Here’s the result in the Windows Phone emulator (yes, it’s a animated GIF representing an animated GIF… I guess it could be called a meta-GIF Winking smile):


Unlike WpfAnimatedGif, the source is specified as an URI or as a stream, rather than an ImageSource. It makes the internal implementation much simpler and more robust.

XamlAnimatedGif currently works on WPF 4.5, Windows 8.1 store apps, and Windows Phone 8.1. It could be extended to support other platforms (WPF 4.0, Windows 8.0, Windows Phone 8.0, Windows Phone Silverlight 8.1, perhaps Silverlight 5), but so far I just focused on making it work on the most recent XAML platforms. I’m not sure if it’s possible to support iOS and Android as well, as I haven’t looked into Xamarin yet. If you want to give it a try, I’ll be glad to accept contributions.

The library is still labeled alpha because it’s new, but it seems reasonably stable so far. You can install it from NuGet:

PM> Install-Package XamlAnimatedGif -Pre 

53 thoughts on “A new library to display animated GIFs in XAML apps”

  1. Hi Thomas

    i have used ur gif in our app and it was helpful. however your old nuget, i was able to dynamically load gifs from the code.
    In the new nuget if i try to load the gifs dynamically at runtime i am not able to
    can you pls help?

    1. Hi Harish,
      You can just set the SourceUri attached property to the URI of the image:

      AnimationBehavior.SetSourceUri(imageControl, imageUri);
  2. Hi Thomas, The XamlAnimatedGif is fine only for displaying 1 gif or may be 2. I tried loading a list of gif’s and the app hanged. Seems like there is a huge performance set back.

  3. Will there be a version of this that works in Windows 7 to replace the WPFAnimatedgif as when using this to loads lots of gifs in quick succession I am getting an HRESULT: 0x88980003 exception. I was wondering if the new XamlAnimatedGif would solve this problem.


      1. Hi

        Thanks for getting back to me I must have been doing something wrong. I will try again and let you know how I get on. I am using your WPFAnimatedGif at the moment in code and am hoping to try and replace it using your new XamlAnimatedGif.

        1. *Edit*

          I have managed to get it working thanks for giving us a way to use Gifs in our projects. I really appreciate all the time and hard work you put into this library.

          This version does seem to be a kinder on memory usage than your original WPFAnimatedGif.

  4. I’m getting an error when i am trying to run the code:

    Unknown attachable member ‘AnimationBehavior.SourceUri’ on element ‘Image’

    This is how my code looks like:

    And i added this at the top:

    1. What kind of app is it? WPF, Windows Phone, UWP?

      Are you sure it’s not just a designer error? Did you install the package via Nuget, or download it manually?

        1. The syntax you used for the XML namespace mapping is for WPF, not WinRT/UWP. You should use xmlns:gif="using:XamlAnimatedGif" instead.

  5. Have same problem.
    WPF, installed via Nuget. Namespace:

    The property ‘AnimationBehavior.SourceUri’ does not exist in XML namespace ‘clr-namespace:XamlAnimatedGif;assembly=XamlAnimatedGif’.

  6. Sorry one important detail – its wpf usercontrol insisde windows forms application:) But i must add that WpfAnimatedGif works good

    1. Hi Martin,

      I can’t reproduce the problem the problem on my side. Which version of .NET are you targeting? With which version of Visual Studio?

      Does the project actually fail to build, or is it just a designer error?

      1. It is .NET 4.0 vs 2013.
        When I create simple WPF project and use your solution on UserControl all is fine.

        When I create WinForms project (my app is old and started from WinForms) and use your solution on WPF UserControl i got this error:
        The property ‘AnimationBehavior.SourceUri’ does not exist in XML namespace ‘clr-namespace:XamlAnimatedGif;assembly=XamlAnimatedGif’

        1. OK, I can reproduce the problem when targeting .NET 4.0. Looking into it now. I probably broke the 4.0 version when I updated the NuGet package to support NuGet 3.0

          Could you please open an issue on GitHub?

        2. OK, fixed it. I had updated a dependency in the project, but forgotten to update it in the NuGet package, so it was using the wrong version.

          I just published a fix (1.0.6), it’s available on NuGet.

  7. ok thx but one another question how to do this in XamlAnimatedGif

    var controller = ImageBehavior.GetAnimationController(GifControl);

    1. You can use AnimationBehavior.GetAnimator() instead of ImageBehavior.GetAnimationController(). However it is more limited, you can only Play/Pause the animation. GotoFrame is not supported.

        1. At this point, yes. Jumping to a specific frame is much more problematic with XamlAnimatedGif’s approach than it was for WpfAnimatedGif. However, for the special case of going to the first frame, there are plans to support it; see issue #33 on GitHub.

  8. Hi!
    I have used XamlAnimatedGif in one of my projects to play a transparent gif. It works great so good job. 🙂
    However, I do have a problem…when the animation finishes I want to dispose of my AnimationBehaviour (release it from memory) and I can’t find a way to do so. I have set the behavior using AnimationBehavior.SetSourceUri(); in the code…i can ofc make the image playing the gif non visible but I can not release the AnimationBehaviour from memory…is there any way to do this? It would really help me. Thank you in advance.

    1. Hi Marino,

      You can just set the SourceUri to null, it will dispose the associated Animator and stop the rendering loop.

      1. Hi! Thank you for your fast reply 🙂
        Do you mean AnimationBehavior.SetSourceUri(image, null) this? Cause I have tried that but the memory does not free up. Or did you mean something else?

        1. Hi Marino,

          Yes, that’s what I meant. It will stop the animation and close the source stream. As for memory, it’s managed by the garbage collector, which runs when it needs to. The managed resources used by the animator will become eligible for garbage collection, and should be freed at some point by the GC. You can force immediate garbage collection by calling `GC.Collect()`, but it’s usually better to let the GC do its job without interfering, unless you have a very good reason.

          1. Hi! Once again thank you for your fast reply. Actually I was wrong…i used memory profiler which didnt show results correctly. I just ran the diagnostic session without debugging and took snapshots and everything works as it should…my mistake. Still, thank you very much for the reply. I do have one more question. In the WpfAnimatedGif there was a AddAnimationCompletedHandler. Will this also be added to the XamlAnimatedGif? Once again thank you very much 🙂

          2. Hi Marino,

            There is a way to be notified when the animation completes, but it’s a bit more convoluted than it was in WpfAnimatedGif. Basically, when the animation is loaded, you can get the Animator object and subscribe to its AnimationCompleted event. I’m aware that it’s not very convenient, and I created an issue to improve it: https://github.com/XamlAnimatedGif/XamlAnimatedGif/issues/68

  9. Hi! Thank you for your reply 🙂
    I have tried what you suggested and was able to make it work, unfortunately I had to use a timer to wait for the gif to be loaded. Is there a better way to know when loading is complete?Thank you in advance 🙂

  10. Hi! I get this error: [Unknown attachable member ‘AnimationBehavior.SourceUri’ on element ‘image’].\

    I am kind of new to programming so please help me out here. Thanks.

  11. So I’m having a few issues with error handling with this library… I was using WpfAnimatedGif before (and eventually left it for this one because of the memory problems), and I was able to get by there because adding the Image’s Source was done more or less manually, so I was able to check out the Uri myself/create a stream from it/etc, and try/catch accordingly.

    However… you seem to have wrapped up all that stuff now. Are we just supposed to attach to the Error event now? Because I’m doing that, but there are still a few cases that slip through: for example, just typing in a SourceUri of “http://”. The Error event never gets fired, though I see a bunch of exceptions get printed out in the log. This results in a useless blank Image getting added to the UI. Another way to achieve this same result is if you type in a valid URL path, but there is something other than an image located there. How are we meant to handle these situations?

    1. Hi Andrey,

      Thanks for your comment. Errors being silently swallowed sound like a bug. Could you please open an issue on Github?

      Anyway, even though the library tries to do most of the work for you when you set a remote URI as the source, you always have the option to manually download the image and set it as the source (either via a file URI, or via a stream).

      1. All right… I have two more issues though that I was hoping you could also help me out with:

        1.) So I have a ListView that is bound to some observable collection in my view model, and in the xaml I have this ListView set up to show some Image objects based on the file paths that my observable collection contains. Now, when I add a new image to the ListView, both the CPU usage of my app and the memory consumption goes up (as expected). …However, I notice that the memory increase seems to be permanent. If I then later go back and remove some of the Images from my ListView, the CPU usage goes down accordingly, but the memory stays. Of course it’s not nearly as bad as WpfAnimatedGif’s was, but still, I’d rather not have it just keep building up over time (obviously!). Do you have any ideas why this might be? Is there some special way I’m supposed to dispose of the Images to ensure this doesn’t happen or something? I’m just setting the Image’s SourceUri property through a xaml binding, so it’s not like I have the actual handles to the streams to dispose or anything…

        2.) If I add a gif that happens to be quite large, it lags very noticeably while playing. Either the frame rate goes down, or my computer literally can’t handle it and just doesn’t render as fast as it should… I can’t tell which. This is still using the same ListView from my previous question, by the way. I see all the other (smaller) gifs playing side-by-side just fine, but the big ones experience pretty terrible slowdown. Interestingly, using WpfAnimatedGif to play the same gif in question didn’t cause this problem. Do you have any idea what I could do to ameliorate this issue..? If there were some way to reduce the detail and/or customize the frame rate so the computer doesn’t have to work so hard, that would honestly be fine with me, but as it stands, your library doesn’t exactly expose a lot of properties to work with, so I can’t exactly change settings like that very easily…

        1. Hi Andrey,

          This is getting a bit long for discussing it in blog comments… Could you please open an issue on GitHub? And please include some code to illustrate what you’re doing.

  12. trying install this by NuGet get this error –
    Could not install package ‘XamlAnimatedGif 1.1.4’. You are trying to install this package into a project that targets ‘.NETPortable,Version=v4.5,Profile=Profile111’, but the package does not contain any assembly references or content files that are compatible with that framework. For more information, contact the package author.
    there are any ways to fix it?

    1. Hi Andrey,

      What kind of app is it? Currently the package has the following supported targets:


      Which means it doesn’t support win80, which is included in Profile111.

      1. Thank for fast answer!
        portable-win81+wpa81 mean os? i use win7…
        can i ask you how can i make framed animation or run gif?
        i try this https://developer.xamarin.com/recipes/android/other_ux/animation/frame_animation/ recipe, but i get problem with
        ImageView imageView = FindViewById(Resource.Id.animated_android);
        AnimationDrawable animation = (AnimationDrawable) imageView.Drawable;

        in Blank XAML App (Xamarin.Forms Portable) i can only MainPage.FindByName ( public App()
        MainPage = new TestFrameAnim_XAML.MainPage();
        Image img = MainPage.FindByName(“name”);
        } ) ,
        but that don’t allow me bind .xml with animation to imageView. and i can`t create imageView in this ptoject… only image.

      2. I don’t ask you give concrete code. Some idea or algorithm, some themes which should i googling to get necessary ifnormation.
        p.s. sorry my english…

        1. Ah, it’s a Xamarin app… Sorry, the library doesn’t support Xamarin. And I don’t know anything about Xamarin, so I can’t help you there…

  13. I added successfully Nuget Package and I had no errors at design time, but at runtime:

    Could not load file or assembly ‘XamlAnimatedGif, PublicKeyToken=null’ or one of its dependencies. The system cannot find the file specified

    I am using it inside a usercontrol. Your help would be appreciated.


    1. Hi Santiago, what kind of app is it? Could you give more details (some code)?

      Also, please open an issue on Github, it will be more convenient to discuss your problem.

      1. Thanks for your reply Thomas, it is a WPF app targeting .NET 4.5, and it is strange because if I add Nuget Package and try to use it in my app, it launches that error at runtime. Same happens if I compile the your source code and add reference to XamlAnimatedGif.dll, but if I add your source code to be part of my app, it works.

        Do you have any idea?

        1. Sorry, no idea… But anyway, there’s nothing I can do without seeing your code. But please, post it on Github, not here.

          1. Thanks again, but I figured it out, it was a converter that I added altogether with the source. Once I remove it, everything was working fine.

Leave a Reply

Your email address will not be published. Required fields are marked *