UI HTML Viewer

ui-html-viewer shows how to build a structured document viewer on top of the UI framework. It reuses the HTML rendering pipeline but delegates layout, header/footer lines, and scroll behavior to reusable UI surfaces.

Use This Demo When You Need…

  • A support example for the UI framework version of a scrollable document viewer.

  • A reference for combining HeaderLine and FooterLine with a reusable scrollable center surface.

  • An example of parsing command line options in ui::Application and applying them to an existing surface tree.

  • A practical example of reusing HtmlRenderer output inside a higher-level UI application.

Run the Demo

Start the demo from the build directory:

$ ./cmake-build-debug/demo-apps/ui-html-viewer
$ ./cmake-build-debug/demo-apps/ui-html-viewer --style=simple

Use the arrow keys or j and k to scroll, PgUp and PgDn to page, Home and End to jump, S to change style presets, and Q or Esc to quit.

Captured Output (80x25)

 UI HTML Viewer  |  demo-tea.html             style styled             80 x 490



  ─▸◆ Tea and the Tea Plant ◆◂─────────────────────────────────────────────────

      Tea is at once a plant, a drink, a ritual, a commodity, and a language
      of hospitality. In many homes it appears so often that it almost escapes
      notice, yet its story is unusually rich. The leaves that become green
      tea, black tea, white tea, oolong, and many other styles all come from
      one remarkable evergreen species, Camellia sinensis. From mountain
      gardens wrapped in mist to busy city kitchens where kettles begin to
      sing, tea connects agriculture, craft, trade, memory, and daily comfort.

      Unlike many beverages that rely on blending several ingredients, true
      tea begins with a single raw material: the young leaf and bud of the tea
      plant. What changes from cup to cup is not the species itself so much as
      the place where it grows, the season in which it is plucked, and the
      care with which it is handled after harvest. A fresh, grassy infusion
      and a dark, malty breakfast tea may seem worlds apart, but they are
      close relatives in botanical terms. That simple fact is one reason tea
      invites both casual enjoyment and deep study.

      Tea is ordinary and extraordinary at the same time. It can be prepared
 lines 1-23 / 490  (4%)  l  PgUp/PgDn page  Home/End jump  [S] style  [Q] quit

Features Demonstrated

  • ScrollingBufferView as the document viewport.

  • HeaderLine and FooterLine used without demo-specific subclasses.

  • setupUi() builds the UI shell before processCommandLineArguments() loads the selected document and style.

  • Shared Action objects for scrolling, style changes, quit handling, and automatic footer keyboard help.

  • HtmlRenderer and the rich-text style system reused unchanged from the non-UI viewer.

  • UI-driven paint invalidation for live status updates.

Relevant Source Files

If you want to explore the implementation, start with demo/ui-html-viewer/src/UiHtmlViewerApp.cpp and demo/ui-html-viewer/src/HtmlDocumentPanel.cpp.