DxTreeListColumn.HeaderCaptionTemplate Property

Specifies a template used to display the column header’s caption.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public RenderFragment<TreeListColumnHeaderCaptionTemplateContext> HeaderCaptionTemplate { get; set; }

Property Value

Type	Description
RenderFragment<TreeListColumnHeaderCaptionTemplateContext>	The template for the column header’s caption.

Remarks

The HeaderCaptionTemplate allows you to customize captions of individual column headers. To define a common template for all header captions in the TreeList, use the DxTreeList.ColumnHeaderCaptionTemplate.

The HeaderCaptionTemplate accepts a TreeListColumnHeaderCaptionTemplateContext object as the context parameter. You can use the parameter’s members to get the current Caption, and the Column or DataColumn object. You can also access the TreeList object and use its members to obtain additional information about the TreeList.

The following example displays custom captions for TreeList columns:

Razor

@inject SpaceObjectDataProvider SpaceObjectDataProvider

<DxTreeList Data="TreeListData" ChildrenFieldName="Satellites">
    <Columns>
        <DxTreeListDataColumn FieldName="Name" />
        <DxTreeListDataColumn FieldName="TypeOfObject" Caption="Type" />
        <DxTreeListDataColumn FieldName="Mass10pow21kg" Caption="Mass, kg" DisplayFormat="N2">
            <HeaderCaptionTemplate>Mass, 10<sup>21</sup> &#215; kg</HeaderCaptionTemplate>
        </DxTreeListDataColumn>
        <DxTreeListDataColumn FieldName="MeanRadiusInKM" Caption="Radius, km" DisplayFormat="N2"/>
        <DxTreeListDataColumn FieldName="Volume10pow9KM3" DisplayFormat="N2">
            <HeaderCaptionTemplate>Volume, 10<sup>9</sup> &#215; km<sup>3</sup></HeaderCaptionTemplate>
        </DxTreeListDataColumn>
        <DxTreeListDataColumn FieldName="SurfaceGravity" DisplayFormat="N2">
            <HeaderCaptionTemplate>Gravity, m/s<sup>2</sup></HeaderCaptionTemplate>
        </DxTreeListDataColumn>
    </Columns>
</DxTreeList>

@code {
    object TreeListData { get; set; }

    protected override async Task OnInitializedAsync() {
        TreeListData = SpaceObjectDataProvider.GenerateData();
    }
}

SpaceObject

using System.Collections.Generic;

public class SpaceObject {
    public string Name { get; set; }
    public double MeanRadiusInKM { get; set; }
    public double Volume10pow9KM3 { get; set; }
    public double Mass10pow21kg { get; set; }
    public double Density { get; set; }
    public double SurfaceGravity { get; set; }
    public string TypeOfObject { get; set; }
    public List<SpaceObject> Satellites { get; set; }
    public SpaceObject(
        string name,
        double meanRadiusInKM,
        double volume10pow9KM3,
        double mass10pow21kg,
        double density,
        double surfaceGravity,
        string typeOfObject,
        List<SpaceObject> satellites = null
    ) {
        Name = name;
        MeanRadiusInKM = meanRadiusInKM;
        Volume10pow9KM3 = volume10pow9KM3;
        Mass10pow21kg = mass10pow21kg;
        Density = density;
        SurfaceGravity = surfaceGravity;
        TypeOfObject = typeOfObject;
        Satellites = satellites ?? new List<SpaceObject>();
    }
}

SpaceObjectDataProvider

public class SpaceObjectDataProvider {
    public List<SpaceObject> GenerateData() {
        return new List<SpaceObject>() {
            new SpaceObject("Sun", 696000, 1412000000, 1989100000, 1.409, 274.0, "Star", new List<SpaceObject>() {
                new SpaceObject("Mercury", 2439.7, 60.83, 330.2, 5.43, 3.7, "Planet"),
                new SpaceObject("Venus", 6051.8, 928.43, 4868.5, 5.24, 8.872, "Planet"),
                new SpaceObject("Earth", 6371.0, 1083.21, 5973.6, 5.515, 9.78033, "Planet", new List<SpaceObject> () {
                    new SpaceObject("Moon", 1737.1, 21.958, 73.5, 3.3464, 1.625, "Satellite")
                }),
                new SpaceObject("Mars", 3390.0, 163.18, 641.85, 3.94, 3.7, "Planet"),
                new SpaceObject("Jupiter", 69911, 1431280, 1898600, 1.33, 24.79, "Planet", new List<SpaceObject>() {
                    new SpaceObject("Ganymede", 2631.2, 76.30, 148.2, 1.936, 1.428, "Satellite"),
                    new SpaceObject("Callisto", 2410.3, 58.65, 107.6, 1.83, 1.23603, "Satellite"),
                    new SpaceObject("Io", 1821.5, 25.32, 89.3, 3.528, 1.797, "Satellite"),
                    new SpaceObject("Europa", 1561, 15.93, 48, 3.01, 1.316, "Satellite"),
                }),
                new SpaceObject("Saturn", 58232, 827130, 568460, 0.70, 10.445, "Planet", new List<SpaceObject>() {
                    new SpaceObject("Titan", 2576, 71.52, 134.5, 1.88, 1.354, "Satellite"),
                    new SpaceObject("Rhea", 764.4, 1.87, 2.3166, 1.23, 0.26, "Satellite"),
                    new SpaceObject("Iapetus", 736, 1.55, 1.9739, 1.08, 0.223, "Satellite"),
                    new SpaceObject("Dione", 561.6, 0.73, 1.096, 1.48, 0.232, "Satellite"),
                    new SpaceObject("Tethys", 533, 0.624, 0.6173, 1.15, 0.145, "Satellite"),
                    new SpaceObject("Enceladus", 252.1, 0.067, 0.108, 1.61, 0.111, "Satellite"),
                    new SpaceObject("Mimas", 198.3, 0.033, 0.03749, 1.15, 0.06363, "Satellite")
                }),
                new SpaceObject("Uranus", 25362, 68340, 86832, 1.30, 8.87, "Planet", new List<SpaceObject>() {
                    new SpaceObject("Titania", 788.9, 2.06, 3.526, 1.72, 0.378, "Satellite"),
                    new SpaceObject("Oberon", 761.4, 1.85, 3.014, 1.63, 0.347, "Satellite"),
                    new SpaceObject("Umbriel", 584.7, 0.84, 1.2, 1.4, 0.234, "Satellite"),
                    new SpaceObject("Ariel", 578.9, 0.81, 1.35, 1.67, 0.269, "Satellite"),
                    new SpaceObject("Miranda", 235.8, 0.055, 0.0659, 1.20, 0.07910375, "Satellite"),
                }),
                new SpaceObject("Neptune", 24622, 62540, 102430, 1.76, 11.15, "Planet", new List<SpaceObject>() {
                    new SpaceObject("Triton", 1353.4, 10.38, 21.5, 2.061, 0.782, "Satellite"),
                    new SpaceObject("Proteus", 210, 0.038, 0.050, 1.3, 0.0666, "Satellite"),
                }),
                new SpaceObject("Eris", 1170, 7, 16.7, 2.25, 0.662, "Dwarf planet"),
                new SpaceObject("Pluto", 1153, 7.15, 13.105, 2.0, 0.61, "Dwarf planet"),
                new SpaceObject("Makemake", 710, 1.8, 3, 2.0, 0.4,  "Dwarf planet"),
                new SpaceObject("Haumea", 575, 1.3, 4.006, 3, 0.44, "Dwarf planet"),
                new SpaceObject("Ceres", 475, 0.437, 0.95, 2.08, 0.27, "Dwarf planet"),
                new SpaceObject("Pallas", 266, 0.078, 0.211, 2.8, 0.2, "Asteroid"),
                new SpaceObject("Vesta", 264.6, 0.078, 0.262, 3.42, 0.251, "Asteroid")
            })
        };
    }
}

Program.cs

// ...
builder.Services.AddSingleton<SpaceObjectDataProvider>();

Run Demo: TreeList - Hierarchical Data

For more information about templates in the TreeList component, refer to the following topic: Templates in Blazor TreeList.

Implements

HeaderCaptionTemplate