How to display image in row , from bytearray or 64base string

Question

i Have saved image in bytearray format to database , and when trying to display in sfdatagrid it not converting byte array to image , its simple display System Byte [] like message ,

Vijayarasan Sivanandham · Answer

Hi Rinku Gupta,

Solution 1:

To display an image in a row of SfDataGrid, you need to perform a few
steps. First, you will need to convert the image details that you receive as a
base64 string into a byte array. Next, create an image using the MemoryStream
class and assign it to the Image property in the QueryImageCellStyle event. Refer
to the below code snippet,

//Event subscription
  sfDataGrid1.QueryImageCellStyle +=
  OnQueryImageCellStyle;
   
  //Event customization
  private void OnQueryImageCellStyle(object sender, QueryImageCellStyleEventArgs e)
  {
      //Solution 1: 
      //Here convert the string into a byte array
      byte[] data =
  StringToByteArray((e.Record as
  DataRowView).Row["ByteArrayString"].ToString());
      //Here convert the byte array into MemoryStream
      MemoryStream memoryStream = new MemoryStream(data);
      //Here load the Image from stream
      e.Image =
  Image.FromStream(memoryStream);
  }
   
  //Helper method to convert the 64String into byte array
  public byte[] StringToByteArray(string imagestring)
  {
      //Here convert the 64String into byte array
      var convertedData =
  Convert.FromBase64String(imagestring);
   
      return convertedData;
  }

Solution 2:

Your
requirement can be achieved by customizing the SfDataGrid.QueryImageCellStyle
event by using GridImageColumn in SfDatGrid. Please refer the below code
snippet,

//Event subscription
  sfDataGrid1.QueryImageCellStyle += OnQueryImageCellStyle;
  
  //Event customization
  private void OnQueryImageCellStyle(object sender, QueryImageCellStyleEventArgs e)
  {
      //Solution 2: directly assign the image by passing the Image
  location
      //get the TextColumn Value 
      var cellValue = (e.Record as DataRowView).Row["Status"].ToString();
   
      //Check the value and shows the image for NOVO value
      if (cellValue == "NOVO")
          e.Image = (Image.FromFile(@"..\..\Images\Sufficient.png"));
      else
          //if Cell value and image names are sampe 
          //you can add image by using below code snippet
          e.Image = (Image.FromFile(@"..\..\Images\" + cellValue + ".png"));
  }

For more information related to GridImageColumn, please refer to the
knowledge base guide documentation,

UG Link: https://help.syncfusion.com/windowsforms/datagrid/columntypes#gridimagecolumn
Find the sample demo in the attachment.

Regards,
Vijayarasan S

If this post is helpful, please consider Accepting it as the solution so that
other members can locate it more quickly.Attachment: Sample_5d5cbe8d.zip