Back to Devexpress

DxToolbar.ItemSizeMode Property

blazor-devexpress-dot-blazor-dot-dxtoolbar-5ce0ba15.md

latest3.3 KB
Original Source

DxToolbar.ItemSizeMode Property

OBSOLETE

This property is obsolete now. Use the SizeMode property instead

Specifies the Toolbar item’s size.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

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

TypeDefaultDescription
Nullable<SizeMode>null

A SizeMode enumeration value.

|

Available values:

NameDescription
Small

Small size.

| | Medium |

Medium size.

| | Large |

Large size.

|

Remarks

Use the ItemSizeMode property to specify the size of root Toolbar items.

The following size modes are available:

|

Size mode

|

Description

| | --- | --- | |

Not specified (NULL)

|

Toolbar item’s inner components inherit their sizes from Toolbar’s parent component. For example, if Toolbar is in Data Grid’s header template, Toolbar’s inner component size is controlled by the InnerComponentSizeMode property.
If the parent component’s size mode is not specified, Toolbar item’s inner component size is specified by the SizeMode global option.

| |

Large

|

The size of Toolbar item’s inner components is large.

| |

Medium

|

The size of Toolbar item’s inner components is medium.

| |

Small

|

The size of Toolbar item’s inner components is small.

|

The following code snippet applies the Large option to Toolbar items:

razor
<div class="card p-2">
    <DxToolbar ItemSizeMode="SizeMode.Large">
        <Items>
            <DxToolbarItem Text="Item" />
            <DxToolbarItem Text="Link to demos"
                           NavigateUrl="https://demos.devexpress.com/blazor/Toolbar" />
            <DxToolbarItem BeginGroup="true" IconCssClass="oi oi-align-left" />
            <DxToolbarItem IconCssClass="oi oi-align-center" />
            <DxToolbarItem IconCssClass="oi oi-align-right" />
            <DxToolbarItem Name="Documentation" 
                           Text="Documentation" 
                           BeginGroup="true" 
                           Tooltip="Documentation (opened in a new tab)"
                           Alignment="ToolbarItemAlignment.Right" 
                           NavigateUrl="https://docs.devexpress.com/Blazor/DevExpress.Blazor.DxToolbar"
                           Target="_blank" />
        </Items>
    </DxToolbar>
</div>

For additional information, refer to Size Modes.

Run Demo: Toolbar - Overview

See Also

DxToolbar Class

DxToolbar Members

DevExpress.Blazor Namespace