blazor-devexpress-dot-blazor-dot-dxbuttongroup.md
Specifies the component’s item collection.
Namespace : DevExpress.Blazor
Assembly : DevExpress.Blazor.v25.2.dll
NuGet Package : DevExpress.Blazor
[DefaultValue(null)]
[Parameter]
public RenderFragment Items { get; set; }
| Type | Default | Description |
|---|---|---|
| RenderFragment | null |
A collection of items (UI fragments).
|
Populate the component’s <Items>...</Items> tag with DxButtonGroupItem objects to create a collection of button group items:
<DxButtonGroup RenderStyle="ButtonRenderStyle.Secondary">
<Items>
<DxButtonGroupItem Text="Add Task"
IconCssClass="icon icon-plus" />
<DxButtonGroupItem Text="Edit Task"
IconCssClass="icon icon-edit" />
<DxButtonGroupItem Text="Assign Task"
IconCssClass="icon icon-user-profile" />
<DxButtonGroupItem Text="Complete Task"
IconCssClass="icon icon-check" />
<DxButtonGroupItem Text="Archive Task"
IconCssClass="icon icon-delete" />
</Items>
</DxButtonGroup>
.icon {
width: 16px;
height: 16px;
background-color: currentColor;
opacity: 0.7;
}
.icon-plus {
mask-image: url(../images/plus.svg);
}
.icon-edit {
mask-image: url(../images/edit.svg);
}
.icon-user-profile {
mask-image: url(../images/user-profile.svg);
}
.icon-check {
mask-image: url(../images/check.svg);
}
.icon-delete {
mask-image: url(../images/delete.svg);
}
See Also