50

In WinForms it is possible to import an image as a resource, and the image would still work when compiled in the /bin/Debug folder.

I can't figure out how to get this working in WPF, when I run the application the image doesn't load, because the image is saved in /Projects/AppName/images/, and the application is compiled into /Projects/AppName/bin/Debug when I run it in Debug mode.

Do I simply need to make a copy of my Images folder and put it where the application is compiled? Or is there another way. Here is my code which displays my image:

<Image Width="300">
    <Image.Source>
        <BitmapImage DecodePixelWidth="300" UriSource="/images/jamsnaps-dark.png" />
    </Image.Source>
</Image>
ASh
  • 34,632
  • 9
  • 60
  • 82
Martyn Ball
  • 4,679
  • 8
  • 56
  • 126

3 Answers3

101
  • Create a folder (e.g. images) in your Visual Studio Project.
  • Add the image file(s) to that folder.
  • Set their Build Action to Resource (in the Properties window, see second image in this answer).

Then write the UriSource property like you already did:

UriSource="/images/jamsnaps-dark.png"

That URI is effectively a Resource File Pack URI, where the prefix is automatically added by the XAML Parser.

In code behind, you would write

bitmap.UriSource = new Uri("pack://application:,,,/images/jamsnaps-dark.png");
Clemens
  • 123,504
  • 12
  • 155
  • 268
4

Two options :

1) Go out from bin/Debug and in to your application folder by ../../ and then to your image.

  <Image>
      <Image.Source>
           <BitmapImage  UriSource="../../images/jamsnaps-dark.png" />
      </Image.Source>
   </Image>

2) Compile your images as Content from properties in the context menu on the image file , and then when compiled they would be placed in been debug. I don't remember if you also need to tell them to copy local also in properties ( i'm not near a computer at the moment so i can't check .

eran otzap
  • 12,293
  • 20
  • 84
  • 139
  • Cheers, also worked but other answered explained a bit better :) – Martyn Ball Sep 07 '14 at 20:25
  • He did something else . which is also good . The point of this is to know where you are locating your files , may they be complied as resources / contents or just placed in your solution . i don't remember the pros and cons of each method.. – eran otzap Sep 07 '14 at 20:36
3
  1. Add the image to your project directory
  2. In the solutions explorer, right click the image and select Include in Project

Build Action should be set to Resource by default.

You can then start to use the image path relative to the root e.g. images/text.jpg if you put it in a folder called images.

naturaljoin
  • 475
  • 2
  • 7