Collapse and Expand Nodes in Tree View for .NET MAUI
- 2 minutes to read
You can tap a node expand button or node content to collapse or expand the node. The following code snippet displays and configures node expand buttons within the DXTreeView control:
<dxt:DXTreeView ...
ExpandActionTarget="Node"
AutoExpandMode="AllNodes"
ShowExpandButtons="True"
ExpandNodesOnFiltering="True">
...
</dxt:DXTreeView>
Use the following API to specify how to collapse and expand nodes:
- ExpandActionTarget
- Gets or sets a value that indicates how to expand and collapse nodes. This is a bindable property.
- AutoExpandMode
- Gets or sets whether to expand nodes automatically when the DXTreeView is loaded or the DXTreeView.ItemsSource property is set to a new instance. This is a bindable property.
- ShowExpandButtons
- Gets or sets whether to show expand buttons. This is a bindable property.
- ExpandNodesOnFiltering
- Gets or sets whether to expand a node if its child nodes contain a search string. This is a bindable property.
Collapse and Expand Nodes at Runtime
The DXTreeView exposes an API that allows you to collapse/expand nodes at runtime:
- CollapseAllNodes()
- Collapses all nodes.
- ExpandAllNodes()
- Expands all nodes.
- ExpandToLevel(Int32)
- Expands parent nodes down to the specified nesting level.
Respond to User Actions when Collapsing and Expanding Nodes
The DXTreeView ships with the following events that fire before/after a node is collapsed/expanded:
- NodeCollapsing
- Occurs before a node is collapsed.
- NodeCollapsed
- Occurs after a node is collapsed.
- NodeExpanding
- Occurs before a node is expanded.
- NodeExpanded
- Occurs after a node is expanded.
You can handle these events to cancel collapse and expand operations, display a notification, and so on.
Change Expand Button Appearance
The DXTreeView control allows you to change expand button appearance. For more information, refer to the following help topic: Change Expand Button Appearance.