Table of Contents

Putting it together

A complete rich-editor surface usually combines the edit toolbar, format toolbar, and horizontal ruler around one TTMSFNCRichEditor. Bind every companion to the same editor, trim the visible command sets to match the application, wire events that update surrounding UI, and configure the ruler layout before the form is shown.

Rich editor formatting toolbar with font, style, alignment, colour, and list buttons Rich editor formatting toolbar with font, style, alignment, colour, and list buttons

Build the surface

The following routine combines the three companion controls in the order most applications need: bind them, restrict commands, wire apply/save events, configure ruler margins and tabs, then apply a small appearance theme.

procedure TForm1.BuildEditorSurface;
begin
  // 1. Bind all three companions to the same editor.
  TMSFNCRichEditorEditToolBar1.RichEditor     := TMSFNCRichEditor1;
  TMSFNCRichEditorFormatToolBar1.RichEditor   := TMSFNCRichEditor1;
  TMSFNCRichEditorHorizontalRuler1.RichEditor := TMSFNCRichEditor1;

  // 2. Restrict each toolbar to the commands this app exposes.
  TMSFNCRichEditorEditToolBar1.Options :=
    [etoOpenFile, etoSaveFile, etoCut, etoCopy, etoPaste, etoUndo, etoRedo];
  TMSFNCRichEditorFormatToolBar1.Options :=
    [ftoFontName, ftoFontSize, ftoBold, ftoItalic, ftoUnderline,
     ftoAlignLeft, ftoAlignCenter, ftoAlignRight,
     ftoTextColor, ftoBullets, ftoNumbering];

  // 3. Reflect the applied font in the status bar and track saves.
  TMSFNCRichEditorFormatToolBar1.OnApplyFontName := DoFontNameApplied;
  TMSFNCRichEditorEditToolBar1.OnSaveFile        := DoDocumentSaved;

  // 4. Configure the ruler: margins, a set of tab stops, and auto-position.
  TMSFNCRichEditorHorizontalRuler1.Layout.LeftMargin  := 50;
  TMSFNCRichEditorHorizontalRuler1.Layout.RightMargin := 46;
  TMSFNCRichEditorHorizontalRuler1.Layout.AutoPosition := True;
  TMSFNCRichEditorHorizontalRuler1.Layout.TabMove      := tmStep;
  TMSFNCRichEditorHorizontalRuler1.Tabs.BeginUpdate;
  try
    TMSFNCRichEditorHorizontalRuler1.Tabs.Clear;
    TMSFNCRichEditorHorizontalRuler1.Tabs.AddTab(20);
    TMSFNCRichEditorHorizontalRuler1.Tabs.AddTab(45);
  finally
    TMSFNCRichEditorHorizontalRuler1.Tabs.EndUpdate;
  end;

  // 5. Give the ruler a light, branded surface.
  TMSFNCRichEditorHorizontalRuler1.Appearance.RulerFill.Kind  := gfkSolid;
  TMSFNCRichEditorHorizontalRuler1.Appearance.RulerFill.Color := gcWhite;
  TMSFNCRichEditorHorizontalRuler1.Appearance.TabColor        := gcSteelblue;
end;

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

procedure TForm1.DoDocumentSaved(Sender: TObject);
begin
  StatusBar1.Panels[1].Text := 'Saved';
end;

When to split the setup

Keep one setup routine while the editor surface is simple. Split it into smaller routines when the toolbar command set depends on permissions, when the ruler layout is document-specific, or when appearance comes from a shared theme service.

Pitfalls

  • Bind each companion explicitly. Sharing an editor instance does not cascade from one toolbar to another.
  • Apply document-specific ruler values after loading the document. Defaults are useful for new documents, but existing documents should restore their own margins, indents, and tabs.
  • Keep event handlers focused on surrounding UI. Toolbar commands already update the editor; handlers are best used for status bars, dirty flags, telemetry, and related application state.

See also