blazor-devexpress-dot-blazor-dot-office-8a5b7201.md
A color editor on the Rich Text Editor‘s ribbon or toolbar.
Namespace : DevExpress.Blazor.Office
Assembly : DevExpress.Blazor.v25.2.dll
NuGet Package : DevExpress.Blazor
public interface IBarColorEdit :
IBarButton,
IBarItemWithImageBase,
IBarItem,
IBarItemBase
The following members return IBarColorEdit objects:
The following code snippet creates a custom color editor that allows users to change the font color for selected text.
<DxRichEdit CustomizeToolbar=OnCustomizeToolbar BarMode=BarMode.Toolbar/>
@code {
void OnCustomizeToolbar(IToolbar toolbar) {
BarGroupCollection groups = toolbar.Groups;
groups.Clear();
AddFormattingGroup(groups);
// ...
}
void AddFormattingGroup(BarGroupCollection groups) {
IBarGroup formattingGroup = groups.AddCustomGroup();
// ...
// Adds a custom color editor
IBarColorEdit fontColor = fontDropDown.Items.AddCustomColorEdit(
() => currentColor.HasValue && !currentColor.Value.IsEmpty ? currentColor.Value : System.Drawing.Color.Black,
(value) => Task.FromResult(currentColor = value),
async () => {
TextSpan span = await selection.ActiveSubDocument.GetTextSpanAsync(selection.Intervals[0]);
await span.ChangePropertiesAsync(p => p.ForegroundColor = currentColor);
}
);
fontColor.Tooltip = "Change the font color.";
fontColor.Text = "Font Color";
}
}
Run Demo: Toolbar Customization
See Also