Class SplitView

A resizable multi-pane layout component that allows users to adjust the size of each pane using draggable splitters.

Inheritance
object
CallbackEventHandler
Focusable
VisualElement
BaseVisualElement
SplitView
Implements
Inherited Members
VisualElement.Focus()
VisualElement.Overlaps(Rect)
VisualElement.ToString()
VisualElement.TryGetBinding(BindingId, out Binding)
VisualElement.TryGetDataSourceContext(BindingId, out DataSourceContext)
VisualElement.TryGetLastBindingToUIResult(in BindingId, out BindingResult)
VisualElement.TryGetLastBindingToSourceResult(in BindingId, out BindingResult)
VisualElement.GetFirstOfType<T>()
VisualElement.GetFirstAncestorOfType<T>()
VisualElement.canGrabFocus
VisualElement.focusController
VisualElement.cacheAsBitmap
CallbackEventHandler.RegisterCallback<TEventType>(EventCallback<TEventType>, TrickleDown)
CallbackEventHandler.RegisterCallbackOnce<TEventType>(EventCallback<TEventType>, TrickleDown)
CallbackEventHandler.RegisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TUserArgsType, TrickleDown)
CallbackEventHandler.RegisterCallbackOnce<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TUserArgsType, TrickleDown)
CallbackEventHandler.RegisterCallback<TEventType>(EventCallback<TEventType>, CallbackOptions)
CallbackEventHandler.RegisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TUserArgsType, CallbackOptions)
CallbackEventHandler.UnregisterCallback<TEventType>(EventCallback<TEventType>, TrickleDown)
CallbackEventHandler.UnregisterCallback<TEventType>(EventCallback<TEventType>, CallbackOptions)
CallbackEventHandler.UnregisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TrickleDown)
CallbackEventHandler.UnregisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, CallbackOptions)
CallbackEventHandler.NotifyPropertyChanged(in BindingId)
Namespace: Unity.AppUI.UI
Assembly: Unity.AppUI.dll
Syntax
[UxmlElement]
public class SplitView : BaseVisualElement, IEventHandler, IResolvedStyle, ITransform, ITransitionAnimations, IExperimentalFeatures, IVisualElementScheduler, IContextOverrideElement, IAdditionalDataHolder
Remarks

The SplitView component creates a flexible layout that divides space into multiple resizable panes. Users can drag the splitters between panes to adjust their sizes. This component is ideal for creating complex layouts like file explorers, code editors, or any interface requiring adjustable panels. This component can contain any number of Pane elements as children.

Key features:

  • Supports both horizontal and vertical orientations
  • Allows real-time or deferred resizing
  • Supports collapsible panes with customizable thresholds
  • RTL (Right-to-Left) layout support
  • Maintains minimum size constraints

Note: Each pane in the SplitView must be a Pane component. Other visual elements are not supported as direct children.

Examples

Basic horizontal split view with two panes — Creating a basic horizontal split view.

<SplitView direction="Horizontal">
    <Pane style="min-width: 200px">
        <Label text="Left Panel" />
    </Pane>
    <Pane style="min-width: 200px">
        <Label text="Right Panel" />
    </Pane>
</SplitView>

Complex layout with nested split views — Creating a complex layout with nested split views.

<SplitView direction="Horizontal">
    <Pane style="min-width: 200px">
        <Label text="Navigation" />
    </Pane>
    <Pane stretch="true">
        <SplitView direction="Vertical">
            <Pane style="min-height: 300px">
                <Label text="Content" />
            </Pane>
            <Pane style="min-height: 150px">
                <Label text="Details" />
            </Pane>
        </SplitView>
    </Pane>
</SplitView>

Using collapse and expand functionality — Implementing collapsible panes.

// Create split view with collapsible panes
var splitView = new SplitView();
var leftPane = new Pane { compactThreshold = 50 };
var rightPane = new Pane();

splitView.AddPane(leftPane);
splitView.AddPane(rightPane);


// Collapse the first splitter forward
splitView.CollapseSplitter(0, CollapseDirection.Forward);


// Later, expand it back
splitView.ExpandSplitter(0);

Constructors

SplitView()

Default constructor.

Declaration
public SplitView()
See Also

SplitView(Direction)

Construct a SplitView with the given direction.

Declaration
public SplitView(Direction direction)
Parameters
Type Name Description
Direction direction

The direction of the SplitView.
See Also

Fields

directionUssClassName

The USS class name of the SplitView with a specific direction.

Declaration
public const string directionUssClassName = "appui-splitview--direction-"
Field Value
Type Description
string
See Also

firstItemUssClassName

The USS class name of the first child element of the SplitView.

Declaration
public const string firstItemUssClassName = "appui-splitview__item--first"
Field Value
Type Description
string
See Also

itemUssClassName

The USS class name of a child element of the SplitView.

Declaration
public const string itemUssClassName = "appui-splitview__item"
Field Value
Type Description
string
See Also

lastItemUssClassName

The USS class name of the last child element of the SplitView.

Declaration
public const string lastItemUssClassName = "appui-splitview__item--last"
Field Value
Type Description
string
See Also

paneContainerUssClassName

The USS class name of the pane container.

Declaration
public const string paneContainerUssClassName = "appui-splitview__pane-container"
Field Value
Type Description
string
See Also

splitterContainerUssClassName

The USS class name of the splitter container.

Declaration
public const string splitterContainerUssClassName = "appui-splitview__splitter-container"
Field Value
Type Description
string
See Also

ussClassName

The USS class name of the SplitView.

Declaration
public const string ussClassName = "appui-splitview"
Field Value
Type Description
string
See Also

withExpandButtonsUssClassName

The USS class name of the SplitView with expand buttons.

Declaration
public const string withExpandButtonsUssClassName = "appui-splitview--with-expand-buttons"
Field Value
Type Description
string
See Also

Properties

contentContainer

Child elements are added to it, usually this is the same as the element itself.

Declaration
public override VisualElement contentContainer { get; }
Property Value
Type Description
VisualElement
Overrides
See Also

direction

The direction of the SplitView. A horizontal SplitView will have the splitters between the panes be vertical, and a vertical SplitView will have the splitters between the panes be horizontal.

Declaration
[CreateProperty]
[UxmlAttribute]
public Direction direction { get; set; }
Property Value
Type Description
Direction
See Also

paneCount

The number of panes in the SplitView.

Declaration
public int paneCount { get; }
Property Value
Type Description
int
See Also

realtimeResize

Whether the SplitView should resize in real-time or not.

When set to true, the SplitView will resize the panes as the user drags the splitter. When set to false, the SplitView will only resize the panes when the user releases the dragged splitter.

Declaration
[CreateProperty]
[UxmlAttribute]
public bool realtimeResize { get; set; }
Property Value
Type Description
bool
See Also

showExpandButtons

Whether the SplitView should show expand buttons or not.

Declaration
[CreateProperty]
[UxmlAttribute]
public bool showExpandButtons { get; set; }
Property Value
Type Description
bool
See Also

splitterCount

The number of splitters in the SplitView.

Declaration
public int splitterCount { get; }
Property Value
Type Description
int
See Also

Methods

AddPane(Pane)

Add a pane to the SplitView.

Declaration
public void AddPane(Pane pane)
Parameters
Type Name Description
Pane pane

The pane to add.
See Also

CollapseSplitter(int, CollapseDirection)

Collapse the splitter at the given index in the given direction.

Declaration
public void CollapseSplitter(int index, CollapseDirection collapseDirection)
Parameters
Type Name Description
int index

The index of the splitter.
CollapseDirection collapseDirection

Whether to collapse the splitter forward or not.
Remarks

Collapsing forward means that the splitter will move towards the next splitter in the current layout direction (in Left-to-Right or Top-to-Bottom layout, forward means right or down, respectively).

If the splitter is already collapsed, this method does nothing.

Exceptions
Type Condition
ArgumentOutOfRangeException

Thrown if the index is out of range.
See Also

ExpandSplitter(int)

Expand the splitter at the given index (if it is collapsed).

Declaration
public void ExpandSplitter(int index)
Parameters
Type Name Description
int index

The index of the splitter.
Remarks

If the splitter is not collapsed, this method does nothing.

Exceptions
Type Condition
ArgumentOutOfRangeException

Thrown if the index is out of range.
See Also

GetLegalSplitterPosition(int, float)

Get the legal position of the splitter at the given index.

Declaration
public float GetLegalSplitterPosition(int index, float desiredPosition)
Parameters
Type Name Description
int index

The index of the splitter.
float desiredPosition

The desired position of the splitter.
Returns
Type Description
float

The legal position of the splitter.
See Also

GetOrientationUssClassName(Direction)

Declaration
public static string GetOrientationUssClassName(Direction enumValue)
Parameters
Type Name Description
Direction enumValue
Returns
Type Description
string
See Also

GetRange(int, out float, out float)

Get the range of the splitter at the given index.

Declaration
public void GetRange(int index, out float min, out float max)
Parameters
Type Name Description
int index

The index of the splitter.
float min

The minimum position of the splitter.
float max

The maximum position of the splitter.
Remarks

The returned value depends on the current layout direction of the SplitView.

See Also

IndexOfPane(Pane)

Get the index of the given pane.

Declaration
public int IndexOfPane(Pane pane)
Parameters
Type Name Description
Pane pane

The pane to get the index of.
Returns
Type Description
int

The index of the pane. -1 if the pane is not found.
See Also

InsertPane(int, Pane)

Insert a pane at the given index.

Declaration
public void InsertPane(int index, Pane pane)
Parameters
Type Name Description
int index

The index to insert the pane at.
Pane pane

The pane to insert.
Exceptions
Type Condition
ArgumentOutOfRangeException

Thrown if the index is out of range.
See Also

IsSplitterCollapsed(int)

Whether the splitter at the given index is collapsed or not.

Declaration
public bool IsSplitterCollapsed(int index)
Parameters
Type Name Description
int index

The index of the splitter.
Returns
Type Description
bool

True if the splitter is collapsed, false otherwise.
Exceptions
Type Condition
ArgumentOutOfRangeException

Thrown if the index is out of range.
See Also

PaneAt(int)

Get the pane at the given index.

Declaration
public Pane PaneAt(int index)
Parameters
Type Name Description
int index

The index of the pane.
Returns
Type Description
Pane

The pane at the given index.
Exceptions
Type Condition
ArgumentOutOfRangeException

Thrown if the index is out of range.
See Also

RemovePane(Pane)

Remove the pane at the given index.

Declaration
public void RemovePane(Pane pane)
Parameters
Type Name Description
Pane pane

The pane to remove.
See Also

RestoreState(State)

Restore the state of the SplitView.

Declaration
public void RestoreState(SplitView.State state)
Parameters
Type Name Description
SplitView.State state

The state to restore.
See Also

SaveState()

Save the state of the SplitView.

Declaration
public SplitView.State SaveState()
Returns
Type Description
SplitView.State

The state of the SplitView.
See Also

Implements

Extension Methods

See Also