WPF animated GIF using MediaElement

Question

I need to get a spinning loader to show when my application is busy.

I found a few posts suggesting the MediaElement is the best way to go. I have the following that displays the ajax-loader.gif on the designer. However, when I run the application, the MediaElement doesn't show anything.

<MediaElement Source="file:images/ajax-loader.gif" LoadedBehavior="Play" Visibility="Visible" />

And not sure if this is a related problem, but from the designer, the Source dropdown isn't picking up my images (Build Action = Resource for them). So I manually specified the file which allows it to show in the designer. However, at runtime, the image disappears.

If I specify the image in a static location it works in design and runtime.

C:\temp\ajax-loader.gif

<MediaElement Source="file:/temp/ajax-loader.gif" LoadedBehavior="Play" Visibility="Visible" />

So clearly, even thought I have the Build Action = Resource for my images, they are not getting picked up by the MediaElement. I even tried simply...

<MediaElement Source="ajax-loader.gif" LoadedBehavior="Play" Visibility="Visible" />

How can I use a MediaElement to show an animated GIF that is loaded as a Resource?

Answer 1

It turns out MediaElement Source property can't pull a Resource per this article...

https://msdn.microsoft.com/es-es/library/aa970915(v=vs.85).aspx

My solution is...

<MediaElement Source="Images/ajax-loader.gif" LoadedBehavior="Play" Visibility="Visible" />

And set the Build Action = Content...