Loading an external image via XAML code in WPF?

Question

I have an image lock.png beside of my WPF exe file in the images folder. Now, I'm gonna load it into the WPF Project as an image, I've used the following XAML code:

<Image Stretch="Fill" Source="pack://siteoforigin:,,,/images/lock.png" />

It works, but Expression Blend or Visual Studio doesn't show it when I'm working on the project.
How can we show external images in these situations?

Answer 1

Is your primary IDE Visual Studio? If yes, why do this manualy? In Propeties window you can just browse way to image you want to use with your Image component

Answer 2

Try to load your image dynamically. This should be on xaml:

<Image Stretch="Fill" Name="MyImage" />

And this in code behind. On Window_Loaded or in Window constructor:

if (File.Exists(AppDomain.CurrentDomain.BaseDirectory + "images/lock.png"))
            {
                Uri uri = new Uri(AppDomain.CurrentDomain.BaseDirectory + "images/lock.png", UriKind.RelativeOrAbsolute);
                MyImage.Source = BitmapFrame.Create(uri);
            }

Answer 3

If the image is relative to your EXE location just do

<Image Source="Images\lock.png" />

If the image isn't relative then you have a larger problem. pack syntax only useful if you are actually "packing" the resource into your assembly.

The problem with loose images and Blend is that Blend hosts your exe in a temp directory that it controls and looks for images relative to that temp directory, which will screw any pathing you are depending on.