DxSplitter.Orientation Property

Specifies whether the splitter arranges panes horizontally or vertically.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v25.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(Orientation.Horizontal)]
[Parameter]
public Orientation Orientation { get; set; }

Property Value

Type	Default	Description
Orientation	Horizontal	The pane stack direction.

Available values:

Name	Description
Horizontal	Sets horizontal orientation.
Vertical	Sets vertical orientation.

Remarks

The splitter component displays a single-level stack of panels. Use the Orientation property to specify the pane stack direction.

<DxSplitter CssClass="border" Height="200px" Width="950px">
    <Panes>
        <DxSplitterPane>Pane 1</DxSplitterPane>
        <DxSplitterPane>
            <DxSplitter Orientation="Orientation.Vertical">
                <Panes>
                    <DxSplitterPane>Pane 2-1</DxSplitterPane>
                    <DxSplitterPane>Pane 2-2</DxSplitterPane>
                </Panes>
            </DxSplitter>
        </DxSplitterPane>
        <DxSplitterPane>Pane 3</DxSplitterPane>
    </Panes>
</DxSplitter>

Run Demo