Back to Devexpress

Size and Alignment

windowsforms-17574-controls-and-libraries-form-layout-managers-layout-and-data-layout-controls-size-and-alignment.md

latest22.1 KB
Original Source

Size and Alignment

  • Jan 27, 2025
  • 8 minutes to read

The layout control contains layout items that embed controls. When a control is placed in a layout item, the layout item automatically sets its Size property according to the current layout. LayoutControl resizes its items so that they fill all available space. You can set Size Constraints — which limit the maximum width and height for a layout item when LayoutControl resizes it. This topic describes how to set size constraints and align a control within a layout item.

Size Constraints

The LayoutControlItem.SizeConstraintsType property specifies whether to use size constraints of the embedded control or the layout item:

Default Size Constraints

Default size constraints depend on the control type. Use the following properties to change the default constraints:

  • Control.MinimumSize — gets or sets the minimum size. If this size is larger than the available area, scrollbars are shown.
  • Control.MaximumSize — gets or sets the maximum size. You can also add Empty Space Items that occupy all remaining space when the availble area becomes larger than the maximum control size. This allows you to limit the maximum size of one specific item, while other items can be freely resized.

Most DevExpress WinForms controls implement the IXtraResizableControl interface. You can also use the following properties:

Note

The ControlDefaultMaxSizeCalcMode property specifies whether to use the Control.MaximumSize property value, the IXtraResizableControl.MaxSize property value, or the larger of the two values. The ControlDefaultMinSizeCalcMode property specifies whether to use the Control.MinimumSize property value, the IXtraResizableControl.MinSize property value, or the smaller of the two values.

Default Size Constraints for Standard WinForms Controls

The table below contains default size constraints and caption visibility for standard .NET controls.

|

Control

|

Minimum Size (Width, Height)

|

Maximum Size (Width, Height)

|

Show Caption

| | --- | --- | --- | --- | |

Label

|

20, 20

|

No limit, No limit

|

No

| |

LinkLabel

|

20, 20

|

No limit, 20

|

Yes

| |

Button

|

20, 20

|

No limit, No limit

|

No

| |

TextBox

|

20, 20

|

No limit, 20

|

Yes

| |

CheckBox

|

20, 20

|

No limit, 20

|

No

| |

RadioButton

|

20, 25

|

No limit, 25

|

No

| |

ListBox

|

20, 20

|

No limit, No limit

|

Yes

| |

CheckedListBox

|

20, 20

|

No limit, No limit

|

Yes

| |

ComboBox

|

20, 21

|

No limit, 21

|

Yes

| |

ListView

|

20, 20

|

No limit, No Limit

|

Yes

| |

TreeView

|

20, 20

|

No limit, No Limit

|

Yes

| |

TabControl

|

20, 20

|

No limit, No Limit

|

Yes

| |

DateTimePicker

|

20, 20

|

No limit, 20

|

Yes

| |

MonthCalendar

|

20, 20

|

No limit, No limit

|

Yes

| |

DomainUpDown

|

20, 20

|

No limit, 20

|

Yes

| |

NumericUpDown

|

20, 20

|

No limit, 20

|

Yes

| |

TrackBar

|

20, 20

|

No limit, No limit

|

No

| |

ProgressBar

|

20, 20

|

No limit, No limit

|

No

| |

RichTextBox

|

20, 20

|

No limit, No limit

|

Yes

| |

BindingNavigator

|

100, 30

|

No limit, 30

|

No

|

To register default size constraints for a custom control, use the static (Shared in VB) ConstraintsManager.RegisterControlConstraints method.

csharp
using DevExpress.XtraLayout;

ConstraintsManager.Default.RegisterControlConstraints(
    type:typeof(MyButton), 
    minSize:new Size(20, 20), 
    maxSize:Size.Empty, 
    IsCaptionVisible:false);
vb
Imports DevExpress.XtraLayout

ConstraintsManager.Default.RegisterControlConstraints(
    type:=GetType(MyButton), 
    minSize:=New Size(20, 20), 
    maxSize:=Size.Empty, 
    IsCaptionVisible:=False)

Custom Size Constraints

To override the default size constraints, set the SizeConstraintsType property to Custom and use the MinSize and MaxSize properties. If the width or height is set to 0 , the corresponding dimension has no limit. The minimum size of a layout item is 1 (setting the MinSize property to Size(0, 0) sets the MinSize property to Size(1, 1)).

The code below shows how to set custom size constraints.

csharp
using DevExpress.XtraEditors;
using DevExpress.XtraLayout;
using DevExpress.XtraLayout.Utils;

layoutControl.Root.DefaultLayoutType = LayoutType.Vertical;
LayoutControlItem item1 = layoutControl.AddItem("Memo 1", new MemoEdit() { Name = "Memo1" });
item1.SizeConstraintsType = SizeConstraintsType.Custom;
item1.MinSize = new Size(0, 50);
item1.MaxSize = new Size(0, 200);
layoutControl.AddItem(new SplitterItem());
layoutControl.AddItem("Memo 2", new MemoEdit() { Name = "Memo2" });
vb
Imports DevExpress.XtraEditors
Imports DevExpress.XtraLayout
Imports DevExpress.XtraLayout.Utils

layoutControl.Root.DefaultLayoutType = LayoutType.Vertical
Dim item1 As LayoutControlItem = layoutControl.AddItem("Memo 1", New MemoEdit() With {.Name = "Memo1"})
item1.SizeConstraintsType = SizeConstraintsType.Custom
item1.MinSize = New Size(0, 50)
item1.MaxSize = New Size(0, 200)
layoutControl.AddItem(New SplitterItem())
layoutControl.AddItem("Memo 2", New MemoEdit() With {.Name = "Memo2"})

Tip

To view more code examples, run the following demo: Custom size constraints.

End-User Capabilities

Users can invoke the Customization Form to customize the layout — show/hide/replace layout items, show/hide captions, add/remove separators, etc. To specify size constraints, users can utilize an item’s context menu.

The following table describes commands in the context menu.

|

Command

|

Description

| | --- | --- | |

Reset to Default

|

Applies the default size constraints to the layout item.

Sets the layout item’s SizeConstraintsType to Default. Sets the MaxSize and MinSize properties to default values.

| |

Free Sizing

|

Removes size constraints.

Sets the layout item’s SizeConstraintsType to Custom. Nullifies the MaxSize property. Sets the MinSize property to the default minimum value.

| |

Lock Size

|

Locks the layout item’s current width and height.

Sets the SizeConstraintsType to Custom. The MaxSize and MinSize properties are set to the current Size property value.

| |

Lock Width

|

Locks the layout item’s current width.

Sets the SizeConstraintsType to Custom. The Width property (for MaxSize and MinSize properties) is set to the Size property’s Width property value.

| |

Lock Height

|

Locks the layout item’s current height.

Sets the SizeConstraintsType to Custom. The System.Drawing.Size.Height property (for MaxSize and MinSize properties) is set to the Size property’s System.Drawing.Size.Height property value.

|

Tip

You can also use the Customization Form in the Windows Forms Designer to specify size constraints at design time.

Example

In the image below, the Delete , Cancel , and Save buttons have a fixed size. When a user resizes the form, only the empty space between them is resized.

Remove the empty space and allow the control to resize the buttons. Right-click the button and select Size Constraints | Free Sizing - as shown in the image below.

The buttons are now resized when a user resizes the form.

Size Constraints of Layout Groups

Size constraints of a layout group depend on size constraints set to its items or embedded controls.

csharp
using System.Drawing;
using DevExpress.XtraLayout;

layoutControlItemA1.SizeConstraintsType = SizeConstraintsType.Custom;
layoutControlItemA1.MaxSize = new Size(250, 24);
layoutControlItemA1.MinSize = new Size(100, 24);
vb
Imports System.Drawing
Imports DevExpress.XtraLayout

layoutControlItemA1.SizeConstraintsType = SizeConstraintsType.Custom
layoutControlItemA1.MaxSize = New Size(250, 24)
layoutControlItemA1.MinSize = New Size(100, 24)

Control Size Based on Content

Certain controls can be automatically sized to fit the content, not the layout item. To enable this mode, use the following properties:

Align Controls in Layout Items

When the form is resized, the layout item and embedded control are also resized. If the embedded control cannot be stretched because size constraints (defined by the MinSize and MaxSize properties) are set, the control’s size is fixed, or the control is sized to fit its content, the layout item contains an empty space. In this instance, you can use the ContentHorzAlignment and ContentVertAlignment properties to align the control within the layout item at the near or far edge, or at the center. Note that the SizeConstraintsType property should be set to SupportHorzAlignment.

Example

The example below displays the following controls:

  • CheckEdit — the size is set to fit the content. The control is aligned at the center.
  • RadioGroup — the maximum size is limited. The control is aligned at the left.

csharp
using DevExpress.XtraLayout;
using DevExpress.XtraEditors;

CheckEdit checkEdit1 = new CheckEdit() { Name = "CheckEdit" };
LayoutControlItem layoutControlItem1 = layoutControl.AddItem("Check box", checkEdit1);
checkEdit1.AutoSizeInLayoutControl = true;
layoutControlItem1.ContentHorzAlignment = HorzAlignment.Center;
//layoutControlItem1.ContentHorzAlignment = HorzAlignment.Far;

RadioGroup radioGroup1 = new RadioGroup() { Name = "RadioGroup" };
radioGroup1.Properties.Items.AddEnum<HorzAlignment>();
LayoutControlItem layoutControlItem2 = layoutControl.AddItem("Radio Group", radioGroup1);
layoutControlItem2.TextVisible = false;
radioGroup1.AutoSizeInLayoutControl = true;
radioGroup1.Properties.ItemsLayout = RadioGroupItemsLayout.Column;
radioGroup1.Properties.Columns = 1;
radioGroup1.MaximumSize = new Size(200, 0);
layoutControlItem2.ContentHorzAlignment = HorzAlignment.Center;
//layoutControlItem2.ContentHorzAlignment = HorzAlignment.Far;
layoutControlItem2.ContentVertAlignment = VertAlignment.Center;
//layoutControlItem2.ContentVertAlignment = VertAlignment.Bottom;
vb
Imports DevExpress.XtraLayout
Imports DevExpress.XtraEditors

Dim checkEdit1 As New CheckEdit() With {.Name = "CheckEdit"}
Dim layoutControlItem1 As LayoutControlItem = layoutControl.AddItem("Check box", checkEdit1)
checkEdit1.AutoSizeInLayoutControl = True
layoutControlItem1.ContentHorzAlignment = HorzAlignment.Center
'layoutControlItem1.ContentHorzAlignment = HorzAlignment.Far;

Dim radioGroup1 As New RadioGroup() With {.Name = "RadioGroup"}
radioGroup1.Properties.Items.AddEnum(Of HorzAlignment)()
Dim layoutControlItem2 As LayoutControlItem = layoutControl.AddItem("Radio Group", radioGroup1)
layoutControlItem2.TextVisible = False
radioGroup1.AutoSizeInLayoutControl = True
radioGroup1.Properties.ItemsLayout = RadioGroupItemsLayout.Column
radioGroup1.Properties.Columns = 1
radioGroup1.MaximumSize = New Size(200, 0)
layoutControlItem2.ContentHorzAlignment = HorzAlignment.Center
'layoutControlItem2.ContentHorzAlignment = HorzAlignment.Far;
layoutControlItem2.ContentVertAlignment = VertAlignment.Center
'layoutControlItem2.ContentVertAlignment = VertAlignment.Bottom;

Tip

To see the complete example, run the following demo: Content Alignment. Click Open Solution in the ribbon for source codes.

Third-Party Controls

To support size constraints for third-party controls, use one of the following approaches:

  • implement the IXtraResizableControl interface:

    • MaxSize, MinSize — specify the size constraints.
    • IsCaptionVisible — specifies whether the layout item should display the caption.
    • Changed — the control fires this event when a property that affects the layout changes (for example, font settings).
  • use the ConstraintsManager.RegisterControlConstraints method to specify size constraints and caption visibility. Note that this method must be called for each LayoutControl that applies size constraints.

See Also

How to: Provide Size Constraints for Control via IXtraResizable Interface

Member Table: Control Alignment