Windows Phone: showing images built in to your app

This isn’t too tricky, but for some reason I always mess it up. If you have images that you ship with your app and want to display them in XAML, here’s how to do it.

The images in your app can be set in Visual Studio to Content or Resource. Generally you’ll want to use Content (for performance), but I’ll cover both.

In XAML:

<Image Source="images/yellow.jpg"/>

This works whether the image is Content or Resource.

In C#:
If the image is Content:

CSharpContentImage.Source =
new BitmapImage(new Uri("images/cyan.jpg", UriKind.RelativeOrAbsolute));

If the image is Resource:

CSharpResourceImage.Source =
new BitmapImage(new Uri("/ImageSources;component/images/grey.jpg", UriKind.Relative));

Note that in this case “ImageSources” is the name of the .xap file.

I’ve put together a small sample WP project with all four of these images.

If you want to display images in a WebBrowser control, it appears that you have to copy the images to IsolatedStorage. There is a hint that there might be a direct way to do this in WP8 but I couldn’t find any more documentation on it.

See all my Windows Phone development posts.

I’m planning on writing more posts about Windows Phone development – what would you like to hear about? Reply here, on twitter at @gregstoll, or by email at greg@gregstoll.com.

Leave a Reply

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

WordPress.com Logo

You are commenting using your WordPress.com 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 )

Google+ photo

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

Connecting to %s