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

Knox 26 Reputation points
2020-08-05T18:41:23.643+00:00

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!

Windows Presentation Foundation
Windows Presentation Foundation
A part of the .NET Framework that provides a unified programming model for building line-of-business desktop applications on Windows.
2,716 questions
{count} votes

3 answers

Sort by: Most helpful
  1. Peter Fleischer (former MVP) 19,316 Reputation points
    2020-08-05T19:32:17.947+00:00

    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>  
    

    15886-x.png

    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; }  
      }  
    
    0 comments No comments

  2. DaisyTian-1203 11,621 Reputation points
    2020-08-06T03:45:39.217+00:00

    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));

    0 comments No comments

  3. Deleted

    This answer has been deleted due to a violation of our Code of Conduct. The answer was manually reported or identified through automated detection before action was taken. Please refer to our Code of Conduct for more information.


    Comments have been turned off. Learn more