Collapse and Expand Rows

• Sep 03, 2021
• 3 minutes to read

You can group rows into categories and display rows as children of other rows. Users can collapse categories and parent rows to hide their child rows.

Users can click the collapse/expand button in a category or row, double-click a category or row header, or press the plus (+) or minus (-) sign on the numeric keypad to collapse or expand a category or row.

Allow Users to Collapse and Expand Rows

Use the control’s AllowCollapseRows option to specify whether users can collapse (and expand) rows. You can also use a row’s AllowCollapse property to override this setting for an individual row.

Allow Users to Collapse and Expand Specific Rows

The control raises the RowCollapsing, RowCollapsed, RowExpanding, and RowExpanded events before and after the corresponding operation. Use the Row event argument to determine the processed row. You can set the Cancel argument to true to discard an operation.

The handler below prohibits users from collapsing a row if a specific record is focused.

C#

private void vGridControl1_RowCollapsing(object sender, DevExpress.XtraVerticalGrid.Events.RowCollapsingEventArgs e) {
    VGridControl gridControl = sender as VGridControl;
    if (e.Row == rowAddress && gridControl.FocusedRecord == 0)
        e.Cancel = true;
}

VB.NET

Private Sub vGridControl1_RowCollapsing(ByVal sender As Object, ByVal e As Events.RowCollapsingEventArgs)
    Dim gridControl As VGridControl = TryCast(sender, VGridControl)
    If e.Row Is rowAddress AndAlso gridControl.FocusedRecord = 0 Then e.Cancel = True
End Sub

Buttons

Use the control’s ShowCollapseButtons option to specify whether collapse/expand buttons are visible. You can also use a row’s ShowCollapseButton property to hide these buttons in an individual row.

The code below allows users to collapse all rows except a specific row.

C#

using DevExpress.Utils;

vGridControl1.OptionsBehavior.AllowCollapseRows = true;
rowAddress.AllowCollapse = DefaultBoolean.False;

vGridControl1.OptionsView.ShowCollapseButtons = true;
rowAddress.ShowCollapseButton = DefaultBoolean.False;

VB.NET

Imports DevExpress.Utils

vGridControl1.OptionsBehavior.AllowCollapseRows = True
rowAddress.AllowCollapse = DefaultBoolean.False

vGridControl1.OptionsView.ShowCollapseButtons = True
rowAddress.ShowCollapseButton = DefaultBoolean.False

Button Style

For a category, you can also use the TreeButtonStyle property to specify whether collapse buttons are displayed on the left (the tree style) or on the right (the Explorer style).

The CustomDrawTreeButton event allows you to draw collapse/expand buttons in a custom way.

How to: Expand or Collapse a Particular Row or All Rows

Use the BaseRow.Expanded property to specify whether a row is expanded or collapsed.

C#

rowPicture.Expanded = false;

VB.NET

rowPicture.Expanded = False

The image below shows how to specify the expand state in a designer.

To expand a row and all its child rows, pass the row to the VGridControlBase.FullExpandRow method.

C#

vGridControl1.FullExpandRow(rowPicture);

VB.NET

VGridControl1.FullExpandRow(rowPicture)

To expand or collapse all rows, use the VGridControlBase.ExpandAllRows and VGridControlBase.CollapseAllRows methods.

C#

vGridControl1.ExpandAllRows();

VB.NET

VGridControl1.ExpandAllRows()

How to: Expand or Collapse Specific Rows

To expand or collapse rows that meet a specific condition, enumerate rows and specify the expanded state. The following example collapses all rows except for the focused row and all its parent rows. See Tree Traversal for more details and examples.

C#

vGridControl1.RowsIterator.DoOperation(new CollapseExceptSpecifiedOperation(vGridControl1.FocusedRow));

public class CollapseExceptSpecifiedOperation : RowOperation {
   BaseRow visibleRow;
   public CollapseExceptSpecifiedOperation(BaseRow visibleRow) : base() {
      this.visibleRow = visibleRow;
   }
   public override void Execute(BaseRow row) {
      if (!row.HasAsChild(visibleRow))
         row.Expanded = false;
   }
   public override bool NeedsFullIteration { get { return false; } }
}

VB.NET

VGridControl1.RowsIterator.DoOperation(New CollapseExceptSpecifiedOperation(VGridControl1.FocusedRow))

Public Class CollapseExceptSpecifiedOperation
   Inherits RowOperation
   Dim VisibleRow As BaseRow
   Public Sub New(ByVal VisibleRow As BaseRow)
      MyBase.New()
      Me.VisibleRow = VisibleRow
   End Sub
   Public Overrides Sub Execute(ByVal Row As BaseRow)
      If Not Row.HasAsChild(VisibleRow) Then Row.Expanded = False
   End Sub
   Public Overrides ReadOnly Property NeedsFullIteration() As Boolean
      Get
         Return False
      End Get
   End Property
End Class