DXDockLayout.HorizontalSpacing Property

Gets or sets the horizontal spacing between the DXDockLayout‘s docked children. This is a bindable property.

Namespace: DevExpress.Maui.Core

Assembly: DevExpress.Maui.Core.dll

NuGet Package: DevExpress.Maui.Core

Declaration

public double HorizontalSpacing { get; set; }

Property Value

Type	Description
Double	The horizontal spacing between the DXDockLayout‘s docked children.

Remarks

The following image shows how the HorizontalSpacing property affects the resulting item layout within DXDockLayout:

XAML

<ContentPage.Resources>
    <Style TargetType="dx:DXBorder">
        <Setter Property="BorderColor" Value="DarkGray"/>
        <Setter Property="BorderThickness" Value="2"/>
        <Setter Property="Margin" Value="2"/>
        <Setter Property="BackgroundColor" Value="#FDF8FD"/>
    </Style>

    <DataTemplate x:Key="contentTemplate">
        <Label Text="{Binding}" Padding="2" FontSize="Medium"/>
    </DataTemplate>
</ContentPage.Resources>

<dx:DXDockLayout HorizontalSpacing="30">

    <dx:DXStackLayout dx:DXDockLayout.Dock="Top" Orientation="Horizontal" ItemAlignment="Fill">
        <dx:DXBorder Content="1" ContentTemplate="{StaticResource contentTemplate}" HeightRequest="100"/>
        <dx:DXBorder Content="2" ContentTemplate="{StaticResource contentTemplate}" HeightRequest="100"/>
        <dx:DXBorder Content="3" ContentTemplate="{StaticResource contentTemplate}" HeightRequest="100"/>
    </dx:DXStackLayout>

    <dx:DXBorder dx:DXDockLayout.Dock="Bottom" Content="4" ContentTemplate="{StaticResource contentTemplate}" HeightRequest="100"/>
    <dx:DXBorder dx:DXDockLayout.Dock="Bottom" Content="5" ContentTemplate="{StaticResource contentTemplate}" HeightRequest="100"/>

    <dx:DXBorder dx:DXDockLayout.Dock="Left" Content="6" ContentTemplate="{StaticResource contentTemplate}" WidthRequest="60"/>
    <dx:DXBorder dx:DXDockLayout.Dock="Left" Content="7" ContentTemplate="{StaticResource contentTemplate}" WidthRequest="60"/>
    <dx:DXBorder dx:DXDockLayout.Dock="Right" Content="8" ContentTemplate="{StaticResource contentTemplate}" WidthRequest="60"/>
    <dx:DXBorder dx:DXDockLayout.Dock="Right" Content="9" ContentTemplate="{StaticResource contentTemplate}"/>

</dx:DXDockLayout>