Rich text

Wx::RTC::RichTextCtrl is a powerful formatted text editor. Unlike Wx::TextCtrl, it supports inline bold, italic, font sizes, colours, and paragraph alignment — all within a single editable widget. It is suitable for any application that needs to display or produce styled text: documentation tools, note-taking apps, report editors, and markdown previewers.

Creating a RichTextCtrl

The widget lives in the Wx::RTC namespace:

1
2


@rtc = Wx::RTC::RichTextCtrl.new(@panel,
         style: Wx::VSCROLL | Wx::HSCROLL | Wx::NO_BORDER | Wx::WANTS_CHARS)

Wx::WANTS_CHARS is important — without it, Tab and Enter keys may not work correctly inside the control.

Writing content programmatically

Use freeze and thaw to suppress repainting while adding content. Without them, the control repaints on every write call, which is slow for large documents:

1
2
3
4
5
6


@rtc.freeze

@rtc.write_text('Some text here')
@rtc.newline

@rtc.thaw

Inline formatting

Formatting uses a begin/end pair that brackets the text it applies to:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14


@rtc.begin_bold
@rtc.write_text('This is bold.')
@rtc.end_bold

@rtc.begin_italic
@rtc.write_text('This is italic.')
@rtc.end_italic

# Bold and italic together — nest the pairs
@rtc.begin_bold
@rtc.begin_italic
@rtc.write_text('Bold and italic.')
@rtc.end_italic
@rtc.end_bold

Mixed formatting in a single line requires interleaving plain text between formatted spans:

1
2
3
4
5
6


@rtc.write_text('Normal, ')
@rtc.begin_bold
@rtc.write_text('bold, ')
@rtc.end_bold
@rtc.write_text('and normal again.')
@rtc.newline

Text colour

1
2
3
4


@rtc.begin_text_colour(Wx::Colour.new(200, 0, 0))
@rtc.write_text('This text is red.')
@rtc.end_text_colour
@rtc.newline

Custom font

1
2
3
4
5
6


font = Wx::Font.new(12, Wx::FONTFAMILY_TELETYPE,
                    Wx::FONTSTYLE_NORMAL, Wx::FONTWEIGHT_NORMAL)
@rtc.begin_font(font)
@rtc.write_text("def hello\n  puts 'world'\nend")
@rtc.end_font
@rtc.newline

Paragraph alignment

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14


@rtc.begin_alignment(Wx::TEXT_ALIGNMENT_LEFT)
@rtc.write_text('Left aligned.')
@rtc.newline
@rtc.end_alignment

@rtc.begin_alignment(Wx::TEXT_ALIGNMENT_CENTRE)
@rtc.write_text('Centred.')
@rtc.newline
@rtc.end_alignment

@rtc.begin_alignment(Wx::TEXT_ALIGNMENT_RIGHT)
@rtc.write_text('Right aligned.')
@rtc.newline
@rtc.end_alignment

Applying formatting to selections

When the user selects text and clicks a toolbar button, use apply_bold_to_selection and apply_italic_to_selection:

1
2
3
4
5
6
7
8
9


evt_togglebutton(@bold_btn.id) do
  @rtc.apply_bold_to_selection
  @rtc.set_focus
end

evt_togglebutton(@italic_btn.id) do
  @rtc.apply_italic_to_selection
  @rtc.set_focus
end

For other attributes (font size, colour) use set_style_ex with a RichTextAttr:

1
2
3


attr = Wx::RTC::RichTextAttr.new
attr.set_font_size(16)
@rtc.set_style_ex(@rtc.selection, attr, Wx::RTC::RICHTEXT_SETSTYLE_WITH_UNDO)

Always call set_focus after applying formatting from a toolbar button — otherwise the cursor leaves the editor.

Scrolling to position

After programmatically populating the control, scroll to the top:

1

@rtc.move_home

Or to the end:

1

@rtc.move_end

A reusable heading helper

When generating structured documents programmatically, a helper method keeps the code clean:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


def write_heading(text, size: 18)
  @rtc.begin_bold
  @rtc.begin_font_size(size)
  @rtc.begin_text_colour(Wx::Colour.new(30, 30, 80))
  @rtc.write_text(text)
  @rtc.end_text_colour
  @rtc.end_font_size
  @rtc.end_bold
  @rtc.newline
end

See rich_text_demo.rb for the complete demonstration including a simple toolbar with Bold, Italic, and font size controls.

Download rich_text_demo.rb

What to take forward

Wx::RTC::RichTextCtrl — the namespace and class name
Use freeze/thaw around bulk content generation
Formatting uses begin_*/end_* pairs — nest them for combined effects
apply_bold_to_selection and apply_italic_to_selection for toolbar formatting
set_style_ex with Wx::RTC::RichTextAttr for other selection formatting
Always set_focus after toolbar formatting to return the cursor to the editor

Previous: Images and bitmaps | Next: HtmlWindow

Images and bitmaps HtmlWindow