Back to Devexpress

Pane Collapsing and Expanding

aspnetmvc-10352-components-site-navigation-and-layout-splitter-pane-collapsing-and-expanding.md

latest2.7 KB
Original Source

Pane Collapsing and Expanding

  • Feb 02, 2023

A Splitter allows its panes to be collapsed in a backward or forward direction, and then be expanded back again. End-users can collapse panes on the client by using the specific collapse forward button and collapse backward button, which can be displayed within separators.

To enable/disable this feature for all panes of a Splitter, use the SplitterSettings.ShowCollapseBackwardButton and SplitterSettings.ShowCollapseForwardButton properties. For individual panes, these settings can be overridden with the help of the SplitterPane.ShowCollapseBackwardButton (via MVCxSplitterPane. ShowCollapseBackwardButton ) and SplitterPane.ShowCollapseForwardButton (via MVCxSplitterPane. ShowCollapseForwardButton ) properties of a pane object.

The state of an individual pane can be defined by using the SplitterPane.Collapsed (via MVCxSplitterPane. Collapsed ) property, or by calling the ASPxClientSplitterPane.Collapse or ASPxClientSplitterPane.Expand method. The client ASPxClientSplitterPane.IsCollapsed method can also be used on the client to identify the current state of a pane.

You can respond to pane state changes on the client side by assigning the event handlers to corresponding properties: SplitterClientSideEvents.PaneCollapsing, SplitterClientSideEvents.PaneCollapsed, SplitterClientSideEvents.PaneExpanding and SplitterClientSideEvents.PaneExpanded. These properties are available via the SplitterSettings.ClientSideEvents property.