Table of Contents

Rich Editor Toolbars Guide

The rich editor toolbar components sit above or below a TTMSFNCRichEditor and provide ready-made formatting and editing controls. Connect a toolbar by setting its RichEditor property; the toolbar then synchronises its button states automatically with the editor selection.

Component Purpose
TTMSFNCRichEditorFormatToolBar Font name, font size, bold, italic, underline, strikeout, alignment, text colour, background colour, bullets, numbering, indent, image, hyperlink
TTMSFNCRichEditorEditToolBar Open file, save file, cut, copy, paste, undo, redo
TTMSFNCRichEditorHorizontalRuler Left/right margins, paragraph indents, and tab stops

Connecting toolbars to an editor

Drop the toolbar components on the form and set RichEditor to the same TTMSFNCRichEditor instance. Multiple toolbars can share the same editor.

// Drop TTMSFNCRichEditorFormatToolBar and TTMSFNCRichEditorEditToolBar on the form.
// Connect both to the same TTMSFNCRichEditor by setting the RichEditor property.

procedure TForm1.FormCreate(Sender: TObject);
begin
  RichEditorFormatToolBar1.RichEditor := TMSFNCRichEditor1;
  RichEditorEditToolBar1.RichEditor   := TMSFNCRichEditor1;
end;

Controlling which buttons are visible

The Options property on each toolbar is a set that lists the buttons to display. Remove a button from the set to hide it; the remaining buttons reflow automatically.

// Restrict which buttons appear in the format toolbar
TMSFNCRichEditorFormatToolBar1.Options :=
  [ftoBold, ftoItalic, ftoUnderline,
   ftoAlignLeft, ftoAlignCenter, ftoAlignRight,
   ftoTextColor, ftoFontName, ftoFontSize];

// Restrict which buttons appear in the edit toolbar
TMSFNCRichEditorEditToolBar1.Options :=
  [etoOpenFile, etoSaveFile, etoCut, etoCopy, etoPaste, etoUndo, etoRedo];

Horizontal ruler and toolbar events

TTMSFNCRichEditorHorizontalRuler connects the same way as the other toolbars. Format toolbar events such as OnApplyFontName and OnApplyFontSize fire after the toolbar applies the change to the editor, giving you a hook to update a status bar or log the action.

// Connect a TTMSFNCRichEditorHorizontalRuler to the editor and handle
// an apply-font event from the format toolbar to update a status label.

procedure TForm1.FormCreate(Sender: TObject);
begin
  TMSFNCRichEditorFormatToolBar1.RichEditor := TMSFNCRichEditor1;
  TMSFNCRichEditorHorizontalRuler1.RichEditor := TMSFNCRichEditor1;

  // Respond when the user picks a different font name from the toolbar
  TMSFNCRichEditorFormatToolBar1.OnApplyFontName := ToolBarFontNameChanged;
end;

procedure TForm1.ToolBarFontNameChanged(Sender: TObject; AFontName: String);
begin
  StatusBar1.Panels.Items[0].Text := 'Font: ' + AFontName;
end;

Accessing individual toolbar buttons

Each toolbar exposes accessor functions for its internal controls:

// Make the bold button unavailable programmatically
RichEditorFormatToolBar1.BoldButton.Enabled := False;

// Reference the font name picker to read the current font
ShowMessage(RichEditorFormatToolBar1.FontNamePicker.FontName);

Combining format toolbar, edit toolbar, and ruler with event handling

Use all three toolbar components together with a single editor, restrict which buttons each shows, and handle a formatting event to update a status bar:

procedure TForm1.FormCreate(Sender: TObject);
begin
  // Connect all three toolbars to the same editor
  RichEditorFormatToolBar1.RichEditor := TMSFNCRichEditor1;
  RichEditorEditToolBar1.RichEditor   := TMSFNCRichEditor1;
  RichEditorHorizontalRuler1.RichEditor := TMSFNCRichEditor1;

  // Restrict format toolbar to essential formatting buttons only
  RichEditorFormatToolBar1.Options :=
    [rfoBold, rfoItalic, rfoUnderline,
     rfoFontName, rfoFontSize, rfoFontColor,
     rfoAlignLeft, rfoAlignCenter, rfoAlignRight];

  // Restrict edit toolbar to clipboard operations only
  RichEditorEditToolBar1.Options := [reoCut, reoCopy, rfoPaste, reoUndo, reoRedo];

  // Wire event to reflect current font name in a status bar panel
  RichEditorFormatToolBar1.OnApplyFontName := DoFontNameApplied;
end;

procedure TForm1.DoFontNameApplied(Sender: TObject; AFontName: string);
begin
  StatusBar1.Panels[0].Text := 'Font: ' + AFontName;
end;