Size and Alignment

  • 8 minutes to read

The layout control contains layout items that embed controls. If a control is placed in a layout item, the layout item automatically sets its Size property according to the current layout. When the layout control is resized, the layout items and embedded controls are also resized. You can set size constraints — which set the maximum width and height for a layout control when it is resized. 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:

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.

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.

using DevExpress.XtraLayout;

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

Custom Size Constraints

To override the default size constraints, you can use the LayoutControlItem.MinSize, MaxSize properties. If the width or height is set to 0, the corresponding dimension has no limit.

The code below shows how to set custom size constraints.

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" });
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 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 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 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 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 Lock Height

Locks the layout item's current height.

Sets the SizeConstraintsType to Custom. The Height property (for MaxSize and MinSize properties) is set to the Size property's 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.

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.

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;
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. Use the ConstraintsManager property to access the manager. Note that this method must be called for each LayoutControl that applies size constraints.

    using DevExpress.XtraLayout;
    
    layoutControl.ConstraintsManager.RegisterControlConstraints(type:typeof(MyButton), minSize:new Size(20, 20), maxSize:Size.Empty, IsCaptionVisible:false);
    
See Also