Skip to main content
All docs
V24.2

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

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.2.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