Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

DevExpress Wrap Layout for .NET MAUI

The DXWrapLayout control sequentially positions its nested child controls from left to right. The layout breaks content to the next line at the edge of the viewport if necessary.

DevExpress WrapLayout for .NET MAUI

#Add a DXWrapLayout to the Page

The following example adds a DXWrapLayout and configures its settings:

<dx:DXWrapLayout ItemSpacing="20"
                 LineSpacing="20" Margin="20" 
                 ItemAlignment="Center"
                 Reverse="False" Wrap="Flex">
    <!-- Add items here. -->
</dx:DXWrapLayout>

#Configure Layout’s Settings

The following list contains properties specific to the DXWrapLayout control:

ItemAlignment

Specifies how the layout control aligns its child items.

ItemSpacing
Specifies the amount of space between the DXWrapLayout‘s child items.
Reverse

Sets whether the layout control’s child controls are positioned in reversed order.

DevExpress Layout for .NET  - DXWrapLayout's Reverse in action

Wrap

Defines the wrap mode for items within the DXWrapLayout control.

  • Regular - Items are wrapped - they are positioned in multiple lines if necessary.
  • Flex - Items are wrapped and distributed evenly between layout rows or columns (depending on Orientation).
  • NoWrap - Items are not wrapped - they are positioned in a single line.
LineAlignment
Specifies how the layout aligns item lines.
LineSpacing
Defines the gap between the DXWrapLayout child item lines.
Orientation
Sets the direction of child item flow.