Binding a System.Drawing.Image in a WPF Image element

Question

I have an object with a System.Drawing.Image property that I'm wanting to bind and display in an Image element in WPF. I feel this should be straightforward since they're both "Images" but I'm not seeing a clear way to do this.

What's the best way to go about doing this?

Thanks!

Answer 1

Hi Greg,
bind Source of Image to ImageSource property. The ImageSource property save the image from Image property in your object to MemoryStream and fill the ImageSource from memoryStream.

<Window x:Class="Window045"  
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"  
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"  
        xmlns:local="clr-namespace:WpfApp1.WpfApp045"  
        mc:Ignorable="d"  
        Title="Window045" Height="450" Width="800">  
  <Window.DataContext>  
    <local:ViewModel/>  
  </Window.DataContext>  
  <Grid>  
    <Image Source="{Binding Picture}"/>  
  </Grid>  
</Window>  

Code in CSharp:

    public ImageSource Picture  
    {  
      get  
      {  
        using (System.IO.MemoryStream ms = new System.IO.MemoryStream())  
        {  
          (new ClassWithImage()).MyPicture.Save(ms, System.Drawing.Imaging.ImageFormat.Bmp);  
          ms.Seek(0, SeekOrigin.Begin);  
          var bmi = new BitmapImage();  
          bmi.BeginInit();  
          bmi.CacheOption = BitmapCacheOption.OnLoad;  
          bmi.StreamSource = ms;  
          bmi.EndInit();  
          return bmi;  
        }  
      }  
    }  
  }  
  public class ClassWithImage  
  {  
    public ClassWithImage() => MyPicture = new System.Drawing.Bitmap("Window045Picture.png");  
    public System.Drawing.Image MyPicture { get; }  
  }  

Answer 2

There are two ways of binding the souce to image in the Microsoft document Image.Source.
Example 1:

Image myImage3 = new Image();  
BitmapImage bi3 = new BitmapImage();  
bi3.BeginInit();  
bi3.UriSource = new Uri("smiley_stackpanel.PNG", UriKind.Relative);  
bi3.EndInit();  
myImage3.Stretch = Stretch.Fill;  
myImage3.Source = bi3;  

Example 2:

<Image Source="smiley_stackpanel.png" Stretch="Fill"/>  

If you want to bind image in xaml from code, you can do like this:

img.Source = new BitmapImage(new Uri("smiley_stackpanel.PNG", UriKind.Relative));