Skip to main content
All docs
V24.1

TreeList.HtmlTemplates Property

A collection of HTML-CSS templates that can be applied to TreeList and Gantt UI elements.

Namespace: DevExpress.XtraTreeList

Assembly: DevExpress.XtraTreeList.v24.1.dll

NuGet Packages: DevExpress.Win.Navigation, DevExpress.Win.TreeList

Declaration

[XtraSerializableProperty(XtraSerializationVisibility.Collection)]
public HtmlTemplateCollection HtmlTemplates { get; }

Property Value

Type Description
HtmlTemplateCollection

A collection of HTML-CSS templates.

Remarks

HTML Templates in TreeList

The TreeList control supports HTML/CSS templates and allows you to generate unique custom layouts for nodes and its empty space area.

HTML Templates in WinForms TreeList

Handle the QueryNodeTemplate and QueryEmptyTreeTemplate events to apply a template from the HtmlTemplates collection based on a condition.

using DevExpress.XtraTreeList;
using DevExpress.HTML.Demos.Modules.TreeList;

// ...
EditingComment editingComment;

private void treeList1_QueryNodeTemplate(object sender, QueryNodeTemplateEventArgs e) {
    var comment = treeList1.GetRow(e.Node.Id);
    if(editingComment != null && editingComment.Comment == comment) {
        if(editingComment.Mode == CommentEditingMode.Editing)
            e.Template.Assign(editCommentTemplate);
        else
            e.Template.Assign(replyCommentTemplate);
    }
}

Run Demo: HTML/CSS Templates in TreeList

Use the NodeHtmlTemplate property to specify the default HTML-CSS template for nodes.

HTML Templates in Gantt Control

The Gantt control supports HTML/CSS templates for the following UI elements:

Handle the GanttControl.QueryItemTemplate event to apply a template.

HTML templates in Gantt Control

void GanttControl1_QueryItemTemplate(object sender, QueryItemTemplateEventArgs e) {
    switch(e.ItemType) {
        case GanttChartItemType.Task:
        case GanttChartItemType.SummaryTask:
            e.Template.Assign(TaskTemplate);
            break;
        case GanttChartItemType.Progress:
        case GanttChartItemType.SummaryTaskProgress:
            e.Template.Assign(TaskProgressTemplate);
            break;
        case GanttChartItemType.TextLabel:
            e.Template.Assign(TaskTextLabelTemplate);
            break;
    }
}

Run Demo: HTML/CSS Templates in Gantt

See this help topic for more information: HTML Templates in Gantt Control.

See Also