How to export images which is loaded inside the GridTemplateColumn to PDF document in WPF DataGrid?

SfDataGrid control exports the data to PDF using Syncfusion PDF Component. Generally, you can export the images to PDF document when the images are loaded inside the GridImageColumn.

You can also load the image by using GridTemplateColumn. The following screenshot illustrates the GridTemplateColumn “Pass or Fail” loaded with the corresponding images that are defined as a DataTemplate of that column.

Figure 1: SfDataGrid with image loaded in GridTemplateColumn

You cannot export the images to PDF document when it is loaded inside the GridTemplateColumn.

In that case, you can achieve it by customizing and assigning the same images to the background of PDFGridCell while exporting, with the help of CellsExportingEventHandler delegate of PdfExportingOptions. Refer to the following code example.

C#

var options = new PdfExportingOptions();
//GridCellPdfExportingEvent is assinged to CellsExportingEventHandler delegate
options.CellsExportingEventHandler = GridCellPdfExportingEvent;
var document = this.grid.ExportToPdf(options);
private void GridCellPdfExportingEvent(object sender, GridCellPdfExportingEventArgs e)
{
}

In the above code example, GridCellPdfExporting event handler is assigned to the CellsExportingEventHandler delegate and it is invoked while exporting each cell to PDF. Here, you can handle and customize each PdfGridCell while exporting, and GridCellPdfExportingEvent contains the following argument as a parameter.

1. Sender: The sender is SfDataGrid.
2. GridCellPdfExportingEventArgs: It contains a set of properties that are used to customize the cell to PDF and some of them are as follows:

• CellType: You can use this property to check the type of the exported cell.
• CellValue: It contains the actual value that is to be exported to PDF.
• ColumnName: Specifies the column name of the exporting cell.
• PdfGridCell: Specifies the PdfGridCell to be exported and you can customize the style, background, foreground and alignment of a particular cell.

Here, you can access the images from the resource file and you can set them to the background of PdfGridCell style as illustrated in the following code example.

C#

private void GridCellPdfExportingEvent(object sender, GridCellPdfExportingEventArgs e)
{
    //Check whehter the CellType is RecordCell and the column name is IsCheck that is GridTemplateColumn contains the image.
    if (e.CellType == ExportCellType.RecordCell && e.ColumnName == "IsCheck")
    {
        //Create new PdfGridCellStyle 
        var style = new PdfGridCellStyle();
        PdfPen normalBorder = new PdfPen(PdfBrushes.DarkGray, 0.2f);
        //Images are exported based on the CellValue 
        if (e.CellValue.Equals("Pass"))
        {
            //Access the image from the specified path 
            System.Drawing.Image image = System.Drawing.Image.FromFile(@"..\..\Images\icon.png");
            //Create the PDFimage for the specified image and assigned to BackgroundImage of the PdfGridCellStyle(supports only PDFImage type)
            style.BackgroundImage = PdfImage.FromImage(image);
            //Customize the image position as Fit 
            e.PdfGridCell.ImagePosition = PdfGridImagePosition.Fit;
            //Apply the new style to PdfGridCell's style
            e.PdfGridCell.Style = style;                                 
        }
        else
        {
            //Access the image from the specified path 
            System.Drawing.Image image = System.Drawing.Image.FromFile(@"..\..\Images\Untied.png");
            //Set the background to newly created PdfGridCellStyle
            style.BackgroundImage = PdfImage.FromImage(image);
            //Customize the image position as Fit 
            e.PdfGridCell.ImagePosition = PdfGridImagePosition.Center;
            //Apply the new style to PdfGridCell's style
            e.PdfGridCell.Style = style;      
        }
        //customize the Border color of PdfGridCell
        e.PdfGridCell.Style.Borders.All = normalBorder;                
        e.CellValue = null;
    }
}

The above GridTemplateColumn images are exported into PDF document as displayed in the following screenshot.

Figure 2: PDF View

Sample Links:

WPF

SilverLight

Conclusion

I hope you enjoyed learning about how to export images which is loaded inside the GridTemplateColumn to PDF document in WPF DataGrid.

You can refer to our WPF DataGrid feature tour
page to know about its other groundbreaking feature representations. You can also explore our
WPF DataGrid documentation
to understand how to create and manipulate data.

For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.

If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!