Skip to content

HtmlWindow

Wx::HTML::HtmlWindow is a lightweight HTML renderer built into wxRuby3. It handles a useful subset of HTML — headings, paragraphs, lists, tables, inline formatting, images, links, and horizontal rules — without requiring a full browser engine. It is the right tool when you need to display formatted content that you control and know will be straightforward HTML.

html_window.png

Note the namespace: it is Wx::HTML (all caps), not Wx::Html.

When to use HtmlWindow

Use HtmlWindow when:

  • Displaying formatted help text, documentation, or reports
  • Rendering markdown output (via a converter like kramdown)
  • Showing structured content with headings, lists, and tables
  • You want simplicity and no external dependencies

Use WebView (Module 5) when:

  • You need full CSS support
  • You need JavaScript execution
  • You need syntax highlighting in code blocks
  • You are loading external web pages
  • You need a bidirectional JavaScript bridge

Creating a HtmlWindow 

1

@html = Wx::HTML::HtmlWindow.new(@panel)

Optionally set a larger base font size — the default is quite small:

1

@html.set_standard_fonts(13)

Loading content

Load an HTML string directly with set_page:

1
2
3
4
5
6

@html.set_page(<<~HTML)
  <html><body>
    <h1>Hello</h1>
    <p>Some <b>formatted</b> content.</p>
  </body></html>
HTML

The content can be a full HTML document or a fragment — HtmlWindow is forgiving about missing <html> and <body> tags.

Load from a file with load_page:

1

@html.load_page('/path/to/document.html')

What HTML it supports

HtmlWindow handles the basics well:

  • Headings (<h1> through <h6>)
  • Paragraphs, line breaks, horizontal rules
  • Bold, italic, underline, code (<b>, <i>, <u>, <code>)
  • Font colour and size (<font color="..." size="...">)
  • Unordered and ordered lists, including nested lists
  • Tables with border and cellpadding
  • <pre> and <code> blocks
  • Blockquotes
  • Hyperlinks
  • Inline images (<img src="..."> for local files)

It does not support CSS stylesheets, JavaScript, or modern HTML5 elements. For those you need WebView.

Handling link clicks

Register evt_html_link_clicked to intercept link clicks:

1
2
3
4
5

evt_html_link_clicked(@html.id) do |event|
  url = event.get_link_info.href
  # Handle the link — open in browser, navigate, run a command...
  Wx.launch_default_browser(url)
end

Without this handler, HtmlWindow will attempt to navigate to clicked links itself, which may produce unexpected results for non-HTTP URLs.

Generating HTML from data

For dynamic content, build the HTML string in Ruby:

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

def build_report_html(results)
  rows = results.map do |r|
    "<tr><td>#{r.name}</td><td>#{r.value}</td></tr>"
  end.join("\n")

  <<~HTML
    <html><body>
    <h1>Results Report</h1>
    <table border="1" cellpadding="6">
      <tr><th>Name</th><th>Value</th></tr>
      #{rows}
    </table>
    </body></html>
  HTML
end

@html.set_page(build_report_html(results))

See html_window_demo.rb for the complete demonstration including a page selector and link click handling.

Download html_demo.rb

What to take forward

  • Namespace is Wx::HTML (all caps) not Wx::Html
  • set_page(html_string) for inline content; load_page(path) for files
  • set_standard_fonts(size) to increase the default font size
  • evt_html_link_clicked to intercept link clicks
  • Good for static formatted content; use WebView when you need CSS, JavaScript, or external pages

Previous: Rich text | Next: Capstone: Markdown editor

Rich textProject: Markdown editor