[Expand]General Information
[Collapse]WinForms Controls
  .NET Core Support
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications, and Dialogs
  [Expand]Editors and Simple Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Expand]Data Grid
  [Expand]Vertical Grid
  [Expand]Property Grid
  [Expand]Pivot Grid
  [Collapse]Tree List
   [Expand]Product Information
   [Expand]Feature Center
   [Expand]Visual Elements
   [Collapse]Design-Time Features
     Design-Time Band Customization
     Tree List Designer
   [Expand]End User Capabilities
   [Expand]Member Tables
  [Expand]Gantt Control
  [Expand]Chart Control
  [Expand]Map Control
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Sunburst Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Design-Time Band Customization

Bands are used to organize columns into logical groups. This document describes two approaches to customizing bands at design time.

  • Using the Tree List Designer, which allows you to create, delete, re-arrange bands, add/remove existing columns to/from bands and access bands settings.
  • On-form access and customization of bands and columns.

Expanded Band Customization Using the Tree List Designer

The Tree List Designer's Bands page allows you to do the following.

  • Create and delete bands.
  • Hide and display existing bands.
  • Add/remove existing columns to/from bands.
  • Re-arrange bands.
  • Change band widths.
  • Customize band settings.

The page contains a preview section, the Properties grid used to access the selected band settings and a set of buttons that provide the functionality described below.

  • - creates a new band.
  • - invokes/hides the Customization Form.
  • - removes the selected bands.
  • - discards all the changes made since the page was opened.

To create a new band at the default position, click the Add New Band... button. After that, the band can be moved to another position by dragging its header.

To create a new band at a specific position, press and hold the Add New Band... button and move the mouse cursor to the target position within the band panel.

To resize bands, drag the right edge of their headers.

The following video shows how to create new bands and change a specific band's caption in the Properties grid using the TreeListBand.Caption property.

Click the Show Columns Selector button to open the Customization Form, which allows you to hide specific bands/columns and display hidden bands/columns. This form contains the Columns and Bands tabs that show headers of hidden columns and bands, respectively. To display a band, drag and drop its header to the Tree List's band panel. Drag-and-drop a band header to the Customization Form to hide this band. The Tree List also provides the capability to quickly hide bands and columns by dragging their headers away from the header panel.

The video below demonstrates an example of band customization.

Expanded On-Form Band Customization

Some band customization features supported by the Tree List Designer can be utilized directly on the form.


Bands can only be created using the Tree List Designer. Created bands is not visible on the form if the TreeListOptionsView.ShowBandsMode property is set to false.

You can change the positions of visible bands and columns using drag-and-drop operations, and resize bands and columns by dragging the right edge of their headers (as shown in the following video).

A band's OptionsBand.AllowMove and OptionsBand.AllowSize properties define whether moving and resizing of this band are enabled. To customize these options for all bands in a centralized way, use the TreeListOptionsCustomization.AllowBandMoving and TreeListOptionsCustomization.AllowBandResizing properties, respectively.

By default, columns and bands can only be moved within their parent bands. To remove these constraints, enable the TreeListOptionsCustomization.AllowChangeColumnParent and TreeListOptionsCustomization.AllowChangeBandParent options, respectively.

The Customization Form allows you to hide/display bands, and add/remove existing columns to/from bands. This form can be invoked by selecting the Column/Band Chooser item in the band header context menu. To hide a band, drag-and-drop it onto the Customization Form. To display a hidden band, drag and drop its header from the Customization Form to the target position within the TreeList.

Use the band's OptionsBand.ShowInCustomizationForm property to regulate whether this band is accessible through the Customization Form. Setting the TreeListOptionsCustomization.ShowBandsInCustomizationForm property to false hides the Bands tab in the Customization Form.

If the TreeListOptionsCustomization.AllowQuickHideColumns is enabled, you can hide bands and individual columns by dragging their headers away from the header panel, even when the Customization Form is not opened.

To access and customize a band's settings (customization options, caption, size, etc.) in the Properties grid, select this band by clicking its header in the Tree List. Note that you can simultaneously customize settings of multiple bands. Hold down the SHIFT or CTRL key while clicking band headers.

When a band is selected, it displays a smart tag. Clicking the smart tag invokes the smart tag panel, which allows you to change the band caption and add a new column to the band.

To delete an existing band, click this band header and press Delete.

Expanded See Also

Is this topic helpful?​​​​​​​