How to display an image in Silverlight?

Question

This should be simple, but...

I created a folder in my solution called Images. I dragged an image into it. How do I now display this image on a Page or View?

Answer 1

Make sure the image is set as a Resource. It can be in any folder in any of your projects in your solution.

You can then reference this as [assembly];component/[path]/[imagename.extension]

For example:

<Image Source="/mynamespace.myassembly;component/ResourcesFolder/image.png" Width="16" Height="16" />

Answer 2

There are a couple of ways to get at it--here's the way that involves setting the image as a Resource in the Visual Studio file properties:

using (var stream = Application.GetResourceStream(
    new Uri("SilverlightAssemblyName;component/Images/myImage.png", 
            UriKind.Relative)))
{
    // read from stream
}

Where SilverlightAssemblyName is replaced by the Assembly Name you specified in the Silverlight tab of your Silverlight project.

If you want to use the image in code:

var bitmap = new BitmapImage();
bitmap.SetSource(stream);
myImageControl.ImageSource = bitmap;

Or, if you want to use the resource in XAML, you don't need any of the code:

<Image Source="/Images/myImage.png" Width="16" Height="16" />