Back to Devexpress

WYSIWYG Export

wpf-118842-controls-and-libraries-data-grid-printing-and-exporting-wysiwyg-export.md

latest15.7 KB
Original Source

WYSIWYG Export

  • Jan 10, 2024
  • 6 minutes to read

In this mode, an exported document retains the layout of grid cells. Grid data shaping features in the exported document are not supported in contrast to the data-aware export. This mode uses the Printing-Exporting library to export data.

Export Data in Code

The GridControl allows you to export its data to a file or stream. The following code sample exports GridControl data to a PDF file:

csharp
void Button_Click_Export(object sender, RoutedEventArgs e) {
    view.ExportToPdf(@"c:\Example\grid_export.pdf");
}
vb
Private Sub Button_Click_Export(ByVal sender As Object, ByVal e As RoutedEventArgs)
    view.ExportToPdf("c:\Example\grid_export.pdf")
End Sub

View Example: Print and Export the GridControl

MethodDescription
DataViewBase.ExportToHtmlExports a grid to the specified file path as HTML.
DataViewBase.ExportToImageExports a grid to the specified file path as image.
DataViewBase.ExportToMhtExports a grid to the specified file path as MHT.
DataViewBase.ExportToPdfExports a grid to the specified file path as PDF.
DataViewBase.ExportToRtfExports a grid to the specified file path as RTF.
DataViewBase.ExportToTextExports a grid to the specified file path as text.
DataViewBase.ExportToXpsExports a grid to the specified file path as XPS.
TableView.ExportToCsv*, TreeListView.ExportToCsv*, CardView.ExportToCsvExports a grid to the specified file path as CSV.
TableView.ExportToXls*, TreeListView.ExportToXls*, CardView.ExportToXlsExports a grid to the specified file path as XLS.
TableView.ExportToXlsx*, TreeListView.ExportToXlsx*, CardView.ExportToXlsxExports a grid to the specified file path as XLSX.

* These methods use data-aware export mode. To enable WYSIWYG mode in these methods, do one of the following:

Export Data with Print Preview

The Print Preview window allows end users to print a document and export it to a file in the required format.

MethodDescription
DataViewBase.ShowPrintPreviewCreates the print document from the View and displays the document’s Print Preview.
DataViewBase.ShowPrintPreviewDialogCreates the print document from the View and displays the document’s modal Print Preview.
DataViewBase.ShowRibbonPrintPreviewCreates the print document from the View and displays the document’s Print Preview with the Ribbon.
DataViewBase.ShowRibbonPrintPreviewDialogCreates the print document from the View and displays the document’s modal Print Preview with the Ribbon.

Customize Appearance

WYSIWYG export mode uses the same customization options that change printed GridControl appearance.

Note

Exported GridControl ignores DataViewBase.CellTemplate and regular Template/Style properties. Refer to the Format Cell Values topic for information on what properties affect WYSIWYG export mode.

GridControl Views have styles and templates that define exported GridControl appearance.

Example: Change Column Header Appearance

xaml
<Window
xmlns:dxgt="http://schemas.devexpress.com/winfx/2008/xaml/grid/themekeys">
<Window.Resources>
    <Style x:Key="customPrintColumnHeaderStyle"
            TargetType="dxe:BaseEdit"
            BasedOn="{StaticResource {dxgt:TableViewThemeKey ResourceKey=DefaultPrintHeaderStyle}}">
        <Setter Property="Background" Value="White" />
        <Setter Property="FontWeight" Value="Bold" />
    </Style>
</Window.Resources>

<dxg:GridControl.View>
    <dxg:TableView PrintColumnHeaderStyle="{StaticResource customPrintColumnHeaderStyle}"/>
</dxg:GridControl.View>

Example: Bind Cell Background to a Property Value

The following code sample uses brushes specified in the Color column to paint the background of Product Name cells when you export data:

xaml
<!--
xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid"
xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
xmlns:dxgt="http://schemas.devexpress.com/winfx/2008/xaml/grid/themekeys"
-->
<dxg:GridColumn FieldName="ProductName">
    <dxg:GridColumn.PrintCellStyle>
        <Style TargetType="dxe:TextEdit"
               BasedOn="{StaticResource {dxgt:TableViewThemeKey ResourceKey=DefaultPrintCellStyle}}">
            <Setter Property="Background" Value="{Binding RowData.Row.Color}"/>
        </Style>
    </dxg:GridColumn.PrintCellStyle>
</dxg:GridColumn>

Example: Render Images within Data Cells with PopupImageEdit

xaml
<Window ...
    xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
    xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid"
    xmlns:dxgt="http://schemas.devexpress.com/winfx/2008/xaml/grid/themekeys"
    xmlns:dxp="http://schemas.devexpress.com/winfx/2008/xaml/printing">
<!-- ... -->
<Style x:Key="ImageColumnPrintingStyle" 
       TargetType="{x:Type dxe:PopupImageEdit}" 
       BasedOn="{StaticResource {dxgt:TableViewThemeKey ResourceKey=DefaultPrintCellStyle}}">

   <Setter Property="dxp:ExportSettings.TargetType" Value="Panel"/>
   <Setter Property="DisplayTemplate">
       <Setter.Value>
           <ControlTemplate TargetType="dxe:PopupImageEdit">
               <dxe:ImageEdit Source="{Binding Path=Value}"
                              IsPrintingMode="True"/>
           </ControlTemplate>
       </Setter.Value>
   </Setter>
</Style>
<!-- ... -->
<dxg:GridColumn FieldName="Image"
                PrintCellStyle="{StaticResource ImageColumnPrintingStyle}">
    <dxg:GridColumn.EditSettings>
        <dxe:PopupImageEditSettings/>
    </dxg:GridColumn.EditSettings>
</dxg:GridColumn>

View Example: Customize the Appearance of Printed/Exported Information

To additionally customize your document, use Printing Links. For example:

Show PrintableControlLink properties

PropertyDescription
TemplatedLink.PageHeaderData / TemplatedLink.PageHeaderTemplateAllows you to customize a page header in the output document.
TemplatedLink.ReportHeaderData / TemplatedLink.ReportHeaderTemplateAllows you to customize a report header in the output document.
TemplatedLink.PageFooterData / TemplatedLink.PageFooterTemplateAllows you to customize a page footer in the output document.
TemplatedLink.ReportFooterData / TemplatedLink.ReportFooterTemplateAllows you to customize a report footer in the output document.

View Example: Add Page Headers and Footers to Printed/Exported Data

WYSIWYG export Options

Table View Options

PropertyDescription
DataViewBase.PrintTotalSummarySpecifies whether the Summary Panel is printed.
DataViewBase.PrintFixedTotalSummarySpecifies whether the Fixed Summary Panel is printed.
GridViewBase.PrintAllGroupsSpecifies whether the grid is printed with all group rows expanded.
TableView.PrintAutoWidthSpecifies whether printed column widths are automatically changed to allow the grid to fit the width of the report page.
TableView.PrintColumnHeadersSpecifies whether column headers are printed.
TableView.PrintGroupFootersSpecifies whether group footers are printed.
BaseColumn.AllowPrintingAllows you to hide specific columns when printing or exporting a grid.

Card View Options

PropertyDescription
DataViewBase.PrintTotalSummarySpecifies whether the Summary Panel is printed.
DataViewBase.PrintFixedTotalSummarySpecifies whether the Fixed Summary Panel is printed.
GridViewBase.PrintAllGroupsSpecifies whether the grid is printed with all group rows expanded.
CardView.PrintAutoCardWidthSpecifies whether cards in the print/export output are automatically resized horizontally to fit the report page width.
CardView.PrintCardMarginSpecifies the thickness of a frame around a card.
CardView.PrintMaximumCardColumnsSpecifies the maximum number of card columns for printing/exporting.
BaseColumn.AllowPrintingAllows you to hide specific columns when printing or exporting a grid.

TreeList View Options

PropertyDescription
DataViewBase.PrintTotalSummarySpecifies whether the Summary Panel is printed.
DataViewBase.PrintFixedTotalSummarySpecifies whether the Fixed Summary Panel is printed.
TreeListView.PrintAllNodesSpecifies whether the grid is printed with all nodes expanded.
TreeListView.PrintAutoWidthSpecifies whether printed column width is automatically changed to allow the grid to fit the width of the report page.
TreeListView.PrintColumnHeadersSpecifies whether column headers are printed.
BaseColumn.AllowPrintingAllows you to hide columns when printing or exporting a grid.

Master-Detail Options

PropertyDescription
TableView.AllowPrintDetailsSpecifies whether View details are printed.
TableView.AllowPrintEmptyDetailsSpecifies whether View details that don’t contain any data are printed.
TableView.PrintDetailTopIndentSpecifies the top print detail indent separating the details.
TableView.PrintDetailBottomIndentSpecifies the bottom print detail indent separating the details.

See Also

Print Data

Generate a Grid-Based Report