Discussing the article: "MQL5 Trading Tools (Part 33): Building a Rich Content Markup Documentation System for MQL5 Programs"

[MetaQuotes]

Check out the new article: MQL5 Trading Tools (Part 33): Building a Rich Content Markup Documentation System for MQL5 Programs.

We extend the Part 9 setup wizard to build a canvas-based, in-chart documentation system for MetaTrader 5. The panel is tabbed and scrollable, supports inline styling, images, and interactive controls, and renders with supersampled anti-aliasing. The result is a reusable engine that any MQL5 program can embed to deliver self-contained documentation directly on the chart.

Documentation has always lived outside the tool. A separate PDF, an external link, a forum thread the user has to go and find, and more often than not, never does. The idea here is straightforward: bring the documentation inside the program itself, formatted and interactive, always available the moment the program is attached to a chart. Think of it as a user manual or a rich-content guide — the kind of formatted document you would expect to open in a PDF reader or a word processor, but living natively inside MetaTrader 5, attached to the very program it describes.

At its core, a rich content document system is built around a few key ideas. Content is organized into tabs, each covering a distinct topic, so the user can navigate freely without scrolling through everything at once. Within each tab, paragraphs carry meaning through formatting — headings stand out, warnings are visually distinct from tips, numbered lists guide step-by-step, and inline text can be bold, italic, underlined, colored, or highlighted. Images sit inline with the text, scaled to fit the panel. Everything scrolls smoothly within a defined body area, and the whole panel adapts to the chart size.

The rendering approach is what separates this from a plain chart object panel. Rather than placing individual label objects for every piece of text, everything is drawn pixel by pixel onto dedicated drawing surfaces. To achieve smooth, professional edges on rounded corners, buttons, and scrollbar pills, we use supersampling — rendering each element at four times the display resolution on an internal high-resolution surface, then downsampling it to the visible display. This eliminates the jagged edges that bitmap rendering typically produces at normal scale.

Think of this system like a well-written trading plan. It doesn't change how the tool works, but it improves how confidently and correctly the tool is used. A trader who understands what each input controls, what conditions the program is designed for, and what to expect from it is far less likely to misuse it. Embedded documentation is not decoration — it is risk management for the developer. We build this in steps. First, we define the layout and theme. Next, we implement supersampled rendering. Then we add paragraphs and inline markup, handle tabs and scrolling, embed images, and wire up interactions. Here is a visualization of our objectives.

Author: Allan Munene Mutiiria