Skip to main content
All docs
V25.1
  • GridDocumentExportCustomizeColumnEventArgsBase.Width Property

    Specifies the exported column’s width in pixels.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

    public int Width { get; set; }

    Property Value

    Type Description
    Int32

    A column width in pixels.

    Remarks

    A column’s ExportWidth property specifies the column width when data is exported to XLS, XLSX, or PDF. Specify the Width event argument to modify the column width only when data is exported to PDF.

    During PDF export operations, Grid and TreeList components recalculate column widths so that the output table occupies all available space. Disable the FitToPage export option to use the exact Width value for exported columns. If a page does not have enough space to render a column, then this and subsequent columns are moved to the next page (similar to the Summary column in the image below).

    PDF Export - Disable Auto Fit

    Grid Example

    The following example exports Grid data to PDF and customizes output table appearance:

    @rendermode InteractiveServer
    @using DevExpress.Drawing;
    @inject WeatherForecastService ForecastService
    
    <DxGrid @ref="Grid" Data="@forecasts">
        <Columns>
            <DxGridDataColumn Caption="Date" FieldName="Date" />
            <DxGridDataColumn Caption="Summary" FieldName="Summary" />
            <DxGridDataColumn Caption="Temperature (C)" FieldName="TemperatureC" />
            <DxGridDataColumn Caption="Temperature (F)" FieldName="TemperatureF" Visible="false" />
        </Columns>
        <ToolbarTemplate>
            <DxToolbar>
                <DxToolbarItem Text="Export to PDF" Click="ExportPdf_Click" BeginGroup="true" />
            </DxToolbar>
        </ToolbarTemplate>
    </DxGrid>
    
    @code {
        IGrid Grid;
        private WeatherForecast[]? forecasts;
    
        protected override async Task OnInitializedAsync() {
            forecasts = await ForecastService.GetForecastAsync(DateOnly.FromDateTime(DateTime.Now));
        }
        async Task ExportPdf_Click() {
            await Grid.ExportToPdfAsync("ExportResult", new GridPdfExportOptions() {
                FitToPage = false,
                CustomizeColumn = OnCustomizeColumn,
            });
        }
        void OnCustomizeColumn(GridDocumentExportCustomizeColumnEventArgs args) {
            args.Width = 400;
            args.IsHidden = false;
            if (args.ColumnIndex % 2 == 1)
                args.DataCellStyle.BackColor = System.Drawing.Color.LightGray;
            if (args.FieldName == "Date")
                args.DataCellStyle.Font = new DXFont(args.DataCellStyle.Font, DXFontStyle.Bold);
        }
    }
    

    Blazor Grid PDF export - Customize Columns

    TreeList Example

    The following example exports TreeList data to PDF and customizes output table appearance:

    @rendermode InteractiveServer
    @using DevExpress.Drawing
    @inject SpaceObjectDataProvider SpaceObjectDataProvider
    
    <DxTreeList @ref="TreeList" Data="TreeListData" ChildrenFieldName="Satellites">
        <Columns>
            <DxTreeListDataColumn FieldName="Name" />
            <DxTreeListDataColumn FieldName="TypeOfObject" Caption="Type" />
            <DxTreeListDataColumn FieldName="Mass10pow21kg" Caption="Mass, kg" DisplayFormat="N2" />
            <DxTreeListDataColumn FieldName="MeanRadiusInKM" Caption="Radius, km" DisplayFormat="N2" />
            <DxTreeListDataColumn FieldName="Volume10pow9KM3" Caption="Volume, km³" DisplayFormat="N2" Visible="false" />
            <DxTreeListDataColumn FieldName="SurfaceGravity" Caption="Gravity" DisplayFormat="N2" Visible="false" />
        </Columns>
        <ToolbarTemplate>
            <DxToolbar>
                <DxToolbarItem Text="Export to PDF" Click="ExportPdf_Click" BeginGroup="true" />
            </DxToolbar>
        </ToolbarTemplate>
    </DxTreeList>
    
    @code {
        ITreeList TreeList { get; set; }
        object TreeListData { get; set; }
        protected override async Task OnInitializedAsync() {
            TreeListData = SpaceObjectDataProvider.GenerateData();
        }
        async Task ExportPdf_Click() {
            await TreeList.ExportToPdfAsync("ExportResult", new TreeListPdfExportOptions() {
                FitToPage = false,
                CustomizeColumn = OnCustomizeColumn,
            });
        }
        void OnCustomizeColumn (TreeListDocumentExportCustomizeColumnEventArgs args) {
            args.Width = 300;
            args.IsHidden = false;
            if (args.ColumnIndex % 2 == 1)
                args.DataCellStyle.BackColor = System.Drawing.Color.LightGray;
            if (args.FieldName == "Name") {
                args.DataCellStyle.Font = new DXFont(args.DataCellStyle.Font, DXFontStyle.Bold);
                args.Width = 400;
            }
        }
    }
    

    Blazor TreeList PDF export - Customize Cells

    See Also