29210372/Article-22193-Tools-Palette-Part-2-Layered-Sidebar-Architecture
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
Article-22193-Tools-Palette.../README.md

5 KiB
Raw Permalink Blame History

Article-22193-Tools-Palette-Part-2-Layered-Sidebar-Architecture

This repository is an article-derived reference project based on the original MQL5 article. It does not claim to reproduce the full original source code unless files are explicitly attached.

Overview

This project documents and reconstructs the MQL5 Expert Advisor architecture presented in article 22193. The article refactors a chart-side tools palette into a layered object-oriented sidebar with:

  • supersampled canvas rendering
  • anti-aliased rounded corners and borders
  • light/dark theme management
  • category registration for drawing tool groups
  • chart-attached bitmap label rendering

The implementation shown in the article is a self-contained sidebar UI foundation intended for future expansion with interaction, flyout panels, and drawing actions.

Original Article

  • Article ID: 22193
  • Title: Tools Palette Part 2: Layered Sidebar Architecture
  • Author: Allan Munene Mutiiria
  • Publication date: 2026.05.08
  • Category: MQL5 / UI architecture / chart tools
  • URL: https://www.mql5.com/en/articles/22193

Repository Purpose

This repository serves as a reference reconstruction of the article's demonstrated design and code structure for a layered chart sidebar in MQL5.

Its purpose is to preserve the article's technical ideas in repository form:

  • separation of rendering, theming, registry, canvas, layout, and shell logic
  • reusable canvas primitives for rounded geometry and borders
  • theme-driven visual styling
  • registry-based category definition
  • initialization and teardown flow through standard MQL5 event handlers

Key Concepts

  • CCanvas-based UI rendering on MetaTrader 5 charts
  • supersampling and downsampling for anti-aliased output
  • alpha compositing with per-pixel blending
  • selective rounded corners depending on snap state
  • layered inheritance-based class architecture
  • centralized theme color application
  • category metadata registry
  • chart object lifecycle management

Algorithm / Architecture Summary

The article describes a 7-layer class hierarchy:

  1. CCanvasPrimitives
  • low-level drawing helpers
  • alpha blending
  • rounded rectangle filling
  • quadrilateral scanline fill
  • border edge and arc drawing
  • high-resolution rendering plus downsampling
  1. CThemeManager
  • stores dark/light state
  • applies a ThemeColorSet
  1. CCategoryRegistry
  • populates an array of CategoryDefinition
  • registers 8 sidebar categories:
  • Cursors
  • Lines
  • Channels
  • Pitchfork
  • Gann
  • Fibonacci
  • Shapes
  • Annotate
  1. CCanvasLayer
  • owns the normal-resolution and high-resolution canvases
  • creates, destroys, and resizes canvas resources
  1. CSidebarLayout
  • computes panel height and button layout
  • maintains geometry and clipping boundaries
  1. CSidebarRenderer
  • composes the sidebar background, header, border, indicators, icons, and separators
  1. CToolsSidebar
  • public shell for initialization and destruction
  • integrates with OnInit, OnDeinit, and OnChartEvent

Rendering flow, as described in the article:

  • create display and high-resolution canvases
  • draw the panel background at high resolution
  • apply selective corner rounding depending on left/right snap mode
  • draw header strip and grip dots
  • draw category indicators
  • draw border
  • downsample to the display canvas
  • overlay icon glyphs and separator lines
  • update the chart bitmap label

The event flow shown in the article is minimal: initialization and cleanup are implemented, while interaction handling is intentionally left empty for future parts.

Mentioned or Attached Files

Explicitly attached files

No attached source files were available in the processed input.

Files mentioned in the article text

  • Tools Palette Part 2.mq5
  • Canvas/Canvas.mqh

Statistics

  • Classes described: 7
  • Enumerations described: 2
  • Main category count: 8
  • Input parameters shown: 6
  • Canvas layers used: 2
  • Supersample factor: 4

Tags

MQL5, MetaTrader5, CCanvas, Chart-UI, Sidebar, Tools-Palette, OOP, Supersampling, Theme-Management, Rendering

Difficulty

Intermediate to Advanced

Limitations

  • The repository is based on article content only unless source files are explicitly attached.
  • No full original repository structure was provided in the processed input.
  • Interactive behavior is not implemented in the shown code; OnEvent(...) is a placeholder.
  • Backtesting evidence in the article is visual/descriptive, not a formal automated test suite.
  • No installation or build workflow beyond standard MQL5 compilation can be safely inferred.
  • If this repository contains reconstructed code, it should be treated as a reference implementation rather than a guaranteed byte-for-byte copy of the article author's original source.

Reference

Original article: Allan Munene Mutiiria, Tools Palette Part 2: Layered Sidebar Architecture https://www.mql5.com/en/articles/22193