XAML image source binding

Question

I am trying to link an image source with my XAML via C #

it works

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

this does not work

 <Image Source="images/{Binding imagesource}"></Image> 

where the image source is a string variable in the C # file of this xaml and is set to "man.jpg"

Answer 1

here's how to do it in XAML:

add this to the namespace:

 xmlns:System="clr-namespace:System;assembly=mscorlib" 

then add image paths

 <System:String x:Key="ImageRefresh">/Theme;component/Images/icon_refresh.png</System:String> <System:String x:Key="ImageSearch">/Theme;component/Images/icon_search.png</System:String> 

This is how you use it

 <Image Height="16" Source="{StaticResource ImageSearch}" Stretch="Uniform" Width="16"/> 

This works fine, but if you load your xaml style into Blend, it will become dummy.

An object of type System.String cannot be applied to a property that expects type of System.Windows.Media.ImageSource.

I have not figured out how to replace System: String with this Media.ImageSource ... but hey .. it works for me in Visual Studio.

Answer 2

You cannot bind a binding in the middle of the path to such a value. This is either a binding or not. Assuming the image source is publicly available through your DataContext , you can do this:

 <Image Source="{Binding imagesource}"/> 

However, if it is set to "man.jpg", it will not find the image. Either set the image source to the full path ("images / man.jpg"), or use the converter:

 <Image Source="{Binding imagesource, Converter={StaticResource RelativePathConverter}}"/> 

The converter will add "images /" to its value. However, the converter may need to return an ImageSource , not a string .

Answer 3

Images have bitten me in the past. There is a specific search order.

When you use "image / man.jpg", it may refer to a file inside your xlight silverlight or relative to the location of the XAP file. For example, it could be in the file YourProject.Web / ClientBin / image / man.jpg.

You must troubleshoot using the full URLs first and find out if this works.

Answer 4

imagesource should be the actual Image object, not a string .

Here is the method that will create the new Image object specified along the path:

 public BitmapImage Load(string path) { var uri = new Uri(path); return new BitmapImage(uri); }