DxFormLayout.ItemSizeMode Property

OBSOLETE

This property is obsolete now. Use the SizeMode property instead.

Specifies the size of the Form Layout and its inner components.

Assembly : DevExpress.Blazor.v25.2.dll

Declaration

csharp

[Browsable(false)]
[DefaultValue(null)]
[Obsolete("This property is obsolete now. Use the SizeMode property instead.")]
[Parameter]
public SizeMode? ItemSizeMode { get; set; }

Property Value

Type	Default	Description
Nullable<SizeMode>	null

A SizeMode enumeration value.

Available values:

Name	Description
Small

Small size.

| | Medium |

Medium size.

| | Large |

Large size.

Remarks

Use the ItemSizeMode property to specify size mode for the Form Layout component.

The following size modes are available:

Size mode

Description

| | --- | --- | |

Not specified (NULL)

Form Layout and its inner components inherit their sizes from the Form Layout’s parent component. If the parent component’s size mode is not specified, Form Layout’s inner component size is specified by the SizeMode global option.

| |

Large

The size of Form Layout and its inner components is large.

| |

Medium

The size of Form Layout and its inner components is medium.

| |

Small

The size of Form Layout and its inner components is small.

The following code snippet applies the Large size mode:

razor

<DxFormLayout Data="@editFormData" ItemSizeMode="SizeMode.Large">
    <DxFormLayoutItem Field="@nameof(FormDataItem.Name)" Caption="Contact Name:" ColSpanMd="6" />
    <DxFormLayoutItem Field="@nameof(FormDataItem.BirthDate)" Caption="Birth Date:" ColSpanMd="6" />
    <DxFormLayoutItem Field="@nameof(FormDataItem.YearsWorked)" Caption="Years Worked:" ColSpanMd="6">
        <DxSpinEdit @bind-Value="@spinEditValue"></DxSpinEdit>
    </DxFormLayoutItem>
    <DxFormLayoutItem Field="@nameof(FormDataItem.Position)" Caption="Position:" ColSpanMd="6">
        <DxComboBox Data="@(new List<string>() { "Sales Representative", "Designer" })"
                    Value="@(((string)((ValueEditContext)context).Value))" />
    </DxFormLayoutItem>
    <DxFormLayoutItem Field="@nameof(FormDataItem.OnVacation)" Caption="On Vacation:" ColSpanMd="6" />
</DxFormLayout>

@code {
    FormDataItem editFormData = new FormDataItem() {
        Name = "Nancy Davolio",
        BirthDate = DateTime.Now.AddYears(-30),
        YearsWorked = 3,
        Position = "Sales Representative"
    };
    int spinEditValue { get; set; }
}

To override the common ItemSizeMode value for an individual item’s editor, define an item template, add a DevExpress data editor to the item, and use the editor’s SizeMode property to specify the size.

razor

<DxFormLayout Data="@editFormData" ItemSizeMode="SizeMode.Small">
    <DxFormLayoutItem Field="@nameof(FormDataItem.YearsWorked)" Caption="Years Worked:" ColSpanMd="6">
        <DxSpinEdit @bind-Value="@spinEditValue" SizeMode="SizeMode.Large"></DxSpinEdit>
    </DxFormLayoutItem>
</DxFormLayout>

For additional information, refer to Size Modes.

Run Demo: Form Layout - Overview