Image UriSource and Data Binding

Question

I m trying to bind a list of custom objects to a WPF Image like this    lt Image gt       lt Image Source gt           lt BitmapImage UriSource   Binding Path ImagePath     gt       lt  Image Source gt   lt  Image gt    But it doesn t work  This is the error I m getting    Property  UriSource  or property  StreamSource  must be set    What am I missing

User · Answer

This article by Atul Gupta has  sample code that covers several scenarios    Regular resource image binding to Source property in XAML Binding resource image  but from code behind Binding resource image in code behind by using Application GetResourceStream Loading image from file path via memory stream  same is applicable when loading blog image data from database  Loading image from file path  but by using binding to a file path Property Binding image data to a user control which internally has image control via dependency property Same as point 5  but also ensuring that the file doesn t get s locked on hard-disk

User · Answer

WPF has built-in converters for certain types  If you bind the Image s Source property to a string or Uri value  under the hood WPF will use an ImageSourceConverter to convert the value to an ImageSource   So   lt Image Source   Binding ImageSource    gt    would work if the ImageSource property was a string representation of a valid URI to an image   You can of course roll your own Binding converter   public class ImageConverter   IValueConverter       public object Convert          object value  Type targetType  object parameter  CultureInfo culture                return new BitmapImage new Uri value ToString                 public object ConvertBack          object value  Type targetType  object parameter  CultureInfo culture                throw new NotSupportedException              and use it like this    lt Image Source   Binding ImageSource  Converter  StaticResource ImageConverter     gt

User · Answer

You need to have an implementation of IValueConverter interface that converts the uri into an image   Your Convert implementation of IValueConverter will look something like this   BitmapImage image   new BitmapImage    image BeginInit    image UriSource   new Uri value as string   image EndInit     return image    Then you will need to use the converter in your binding    lt Image gt       lt Image Source gt           lt BitmapImage UriSource   Binding Path ImagePath  Converter         gt       lt  Image Source gt   lt  Image gt

User · Answer

you may use     ImageSourceConverter class   to get what you want      img1 Source    ImageSource new ImageSourceConverter   ConvertFromString   Assets check png

User · Answer

The problem with the answer that was chosen here is that when navigating back and forth  the converter will get triggered every time the page is shown   This causes new file handles to be created continuously and will block any attempt to delete the file because it is still in use  This can be verified by using Process Explorer   If the image file might be deleted at some point  a converter such as this might be used  using XAML to bind to a System Drawing Image into a System Windows Image control  The disadvantage with this memory stream method is that the image s  get loaded and decoded every time and no caching can take place   To prevent images from being decoded more than once  assign the Image Source property from an Uri rather than using memory streams  Source   Performance tips for Windows Store apps using XAML   To solve the performance issue  the repository pattern can be used to provide a caching layer  The caching could take place in memory  which may cause memory issues  or as thumbnail files that reside in a temp folder that can be cleared when the app exits

User · Answer

You can also simply set the Source attribute rather than using the child elements   To do this your class needs to return the image as a Bitmap Image   Here is an example of one way I ve done it   lt Image Width  90  Height  90          Source   Binding Path ImageSource          Margin  0 0 0 5    gt    And the class property is simply this  public object ImageSource       get           BitmapImage image   new BitmapImage             try               image BeginInit                image CacheOption   BitmapCacheOption OnLoad              image CreateOptions   BitmapCreateOptions IgnoreImageCache              image UriSource   new Uri  FullPath  UriKind Absolute                image EndInit                      catch              return DependencyProperty UnsetValue                     return image            I suppose it may be a little more work than the value converter  but it is another option

[.net] Image UriSource and Data Binding

Examples related to .net

Examples related to wpf

Examples related to data-binding

Examples related to xaml