question

RezaJaferi1992 avatar image
0 Votes"
RezaJaferi1992 asked RezaJaferi1992 edited

Retrieving image from binary data (OLE Object, Access database) and display it in Datagrid column in WPF (by C#)

First and foremost, I apologize for my grammatical errors; my first language is Persian (Iran).
I want to display the images in the Datagrid column where the binary are stored in Access.
The following method converts the image to binary:

     private static byte[] ImageToBytes(BitmapImage image)
     {
         byte[] Data;
         JpegBitmapEncoder JpegEncoder = new JpegBitmapEncoder();
         JpegEncoder.Frames.Add(BitmapFrame.Create(image));
         using (System.IO.MemoryStream MS = new System.IO.MemoryStream())
         {
             JpegEncoder.Save(MS);
             Data = MS.ToArray();
         }
         return Data;
     }

I receive the Bitmap image from the method below and then display it in the Image control:

     private BitmapImage GetImageFromBytes(byte[] bytes)
     {
         System.IO.MemoryStream Stream = new System.IO.MemoryStream();
         Stream.Write(bytes, 0, bytes.Length);
         Stream.Position = 0;
         System.Drawing.Image img = System.Drawing.Image.FromStream(Stream);
         BitmapImage bitImage = new BitmapImage();
         bitImage.BeginInit();
         System.IO.MemoryStream MS = new System.IO.MemoryStream();
         img.Save(MS, System.Drawing.Imaging.ImageFormat.Jpeg);
         MS.Seek(0, System.IO.SeekOrigin.Begin);
         bitImage.StreamSource = MS;
         bitImage.EndInit();
         return bitImage;
     }

114240-first-image.jpg

But the above method for displaying the image in the datagrid does not work properly:

114351-second-image.jpg

Thanks

dotnet-wpf-xaml
first-image.jpg (85.9 KiB)
second-image.jpg (28.0 KiB)
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

1 Answer

HuiLiu-MSFT avatar image
0 Votes"
HuiLiu-MSFT answered

For retrieving data from the database (including binary images) and binding it to the DataGrid, you could try to refer to the following code. (The data type of Image in my database is Image). For the image column, you could try to set the DataTemplate to Image.

Xaml code:

 <StackPanel>
         <DataGrid Name="dataGrid" AutoGenerateColumns="False" Height="380">
             <DataGrid.Columns>
                 <DataGridTextColumn Header="Id" Width="80" Binding="{Binding Id}"></DataGridTextColumn>
                 <DataGridTextColumn Header="Name" Width="80" Binding="{Binding Name}"></DataGridTextColumn>
                 <DataGridTemplateColumn Header="Image " Width="300" IsReadOnly="True">

                     <DataGridTemplateColumn.CellTemplate>
                         <DataTemplate>
                             <Image Source="{Binding Image}"/>
                         </DataTemplate>
                     </DataGridTemplateColumn.CellTemplate>

                 </DataGridTemplateColumn>
             </DataGrid.Columns>
         </DataGrid>
         <Button Click="Button_Click" > Load </Button>
   </StackPanel>

Xaml.cs code:

 using System.Data;
 using System.Data.SqlClient;
 using System.Windows;
    
 namespace RetriveImage
 {
   public partial class MainWindow : Window
   {
     public MainWindow()
     {
       InitializeComponent();
     }
     private void Button_Click(object sender, RoutedEventArgs e)
     {
       string constr = @"constr ";
       OleDbConnection con = new OleDbConnection(constr);
       con.Open();
       OleDbCommand cmd = new OleDbCommand ("Select * From [dbo].[Image]", con);
       OleDbDataAdapter da = new OleDbDataAdapter(cmd);
       var dt = new DataTable();
       da.Fill(dt);
       dataGrid.ItemsSource = dt.DefaultView;
       con.Close();
     }
   }
 } 

The result is shown in the figure:
114565-2.gif



2.gif (85.0 KiB)
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.