IBarCheckableButton Interface

A checkable button on the Rich Text Editor‘s ribbon or toolbar.

Namespace: DevExpress.Blazor.Office

Assembly: DevExpress.Blazor.v23.2.dll

NuGet Package: DevExpress.Blazor

Declaration

public interface IBarCheckableButton :
    IBarButton,
    IBarItemWithImageBase,
    IBarItem,
    IBarItemBase

Related API Members

The following members return IBarCheckableButton objects:

• BarItemCollection.AddCustomCheckButton(Int32, String, Func<Task>, Func<Boolean>)
• BarItemCollection.AddCustomCheckButton(String, Func<Task>, Func<Boolean>)

Remarks

The code below demonstrates how to create a custom checkable button that allows users to save the document.

<DxRichEdit CustomizeToolbar=OnCustomizeToolbar BarMode=BarMode.Toolbar/>

@code {
    void OnCustomizeToolbar(IToolbar toolbar) {
        BarGroupCollection groups = toolbar.Groups;
        groups.Clear();
        AddFileCommonGroup(groups);
        // ...
    }

    void AddFileCommonGroup(BarGroupCollection groups) {
        IBarGroup fileCommonGroup = groups.Add(RichEditRibbonGroupNames.FileCommon);
        // ...

        // adds a custom checkable button
        IBarCheckableButton saveButton = fileCommonGroup.Items.AddCustomCheckButton(1, "Save",
            async () => await rich.SaveDocumentAsync(),
            () => !modified
        );
        saveButton.IconUrl = "_content/BlazorDemo/images/Save.svg";
        saveButton.Tooltip = "Save the document.";

    }    
}

Run Demo: Toolbar Customization