Displaying an Image on a WPF page

Question

I am trying to display an image on a WPF page. The code is shown below:

<Grid>
  <TextBlock Margin="32,332,395,74" Cursor="None">
     Click to <Hyperlink NavigateUri="TestWindow.xaml">sign a document</Hyperlink>
  </TextBlock>
  <Image HorizontalAlignment="Left" Height="151" Margin="32,96,0,0" VerticalAlignment="Top" Width="179"
         Source="signature.png" Visibility="Visible" Name="signImage"/>

The problem is the image shows in WPF designer but when I run the program, the image does not display on the page.

Note the image is displayed on a PAGE not a WINDOW

Answer 1

Try this out PackURIs

Image finalImage = new Image();
finalImage.Width = 80;
...
BitmapImage logo = new BitmapImage();
logo.BeginInit();
logo.UriSource = new Uri("pack://application:,,,/AssemblyName;component/Resources/logo.png");
logo.EndInit();
...
finalImage.Source = logo;

The URI is broken out into parts:

• Authority: application:///

Path: The name of a resource file that is compiled into a referenced assembly. The path must conform to the following format: AssemblyShortName[;Version][;PublicKey];component/Path

• AssemblyShortName: the short name for the referenced assembly.
• ;Version [optional]: the version of the referenced assembly that contains the resource file. This is used when two or more referenced assemblies with the same short name are loaded.
• ;PublicKey [optional]: the public key that was used to sign the referenced assembly. This is used when two or more referenced assemblies with the same short name are loaded.
• ;component: specifies that the assembly being referred to is referenced from the local assembly.
• /Path: the name of the resource file, including its path, relative to the root of the referenced assembly's project folder.

The three slashes after application: have to be replaced with commas:

Note: The authority component of a pack URI is an embedded URI that points to a package and must conform to RFC 2396. Additionally, the "/" character must be replaced with the "," character, and reserved characters such as "%" and "?" must be escaped. See the OPC for details.

And of course, make sure you set the build action on your image to Resource.

Answer 2

Another option is to use a resource, eg in your app.xaml:

 <Application.Resources>
    <BitmapImage x:Key="signatureSrc" UriSource="/MyProject;component/ImageFolderIfThereIsOne/signature.png" />
</Application.Resources>

and use it like this

<Image Height="100" VerticalAlignment="Top" Width="100" Source="{StaticResource signatureSrc}" />

Answer 3

Frustrated with this myself, I just figured out the the page uses a relative location for the image. In my case, the image was in the folder "Graphics/logo.jpg", and the page was in the folder "View/Setting/About". I updated the Source of the image to ../../Graphics/logo.jpg and it worked.