Article-22214-Interactive-Tools-Palette-Part-3/README.md

Article-22214-Interactive-Tools-Palette-Part-3

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 reference repository documents the architecture described in MQL5 article 22214, which upgrades a previously static chart sidebar into an interactive drawing palette for MetaTrader 5.

The article focuses on the interaction layer required to make a rendered tools panel operational. It describes a data-driven tool registry, sidebar and flyout canvases, hit-testing, chart event routing, scrolling, drag-and-snap behavior, bottom-edge resizing, live theme switching, and a multi-click drawing engine for creating chart objects.

## Original Article

- **Article ID:** 22214
- **Title:** Interactive Tools Palette Part 3
- **Author:** Allan Munene Mutiiria
- **Publication date:** 2026.05.16
- **Category:** MQL5 / UI / Chart interaction / drawing tools
- **URL:** https://www.mql5.com/en/articles/22214

## Repository Purpose

This repository serves as a technical reference and possible reconstruction base for the interaction system presented in the article.

Its purpose is to capture the described design and implementation elements for:

- interactive sidebar behavior on MT5 charts
- flyout-based tool selection
- event-driven UI handling through chart events
- deterministic tool placement workflows for 1-click, 2-click, and 3-click drawing objects

Because the processed input contains article content rather than a confirmed complete attached code package, this repository should be treated as a reference/reconstruction project.

## Key Concepts

- Tool palette interaction layer on top of bitmap/canvas UI
- `OnEvent` / `OnChartEvent` style centralized event routing
- Sidebar hit-testing for buttons, grip area, theme toggle, close button, and resize grip
- Flyout panel management with pointer triangle and scroll support
- Theme manager with dark/light live switching
- Tool registry with dynamic tool arrays per category
- Active-tool contract as the source of truth
- Drawing engine with click-count-based placement logic
- Sidebar scrolling, thumb dragging, and edge snapping
- MQL5 chart object creation for lines, channels, Fibonacci tools, shapes, and annotations

## Algorithm / Architecture Summary

The article presents a ten-class hierarchy that evolves the prior visual sidebar into a full interaction system:

1. **Expanded tool/icon definitions**
- 35 tool icon definitions
- `TOOL_TYPE` enumeration
- `ToolDefinition`, `CategoryDefinition`, and expanded `ThemeColorSet`

2. **Canvas primitives**
- High-resolution triangle fill via scanline rasterization for flyout pointer rendering

3. **Theme manager**
- Dark/light theme application
- Live toggle behavior

4. **Tool registry**
- Category population
- Reverse lookup from active tool to category
- Required click count lookup
- Tool label lookup

5. **Canvas layer**
- Sidebar canvas
- Sidebar high-resolution canvas
- Flyout canvas
- Flyout high-resolution canvas

6. **Sidebar layout**
- Panel geometry
- Scroll metrics
- snap-to-edge logic
- hit-testing for panel regions

7. **Flyout panel**
- Category flyout visibility and placement
- item hit-testing
- scrollable item list
- pointer-aware rendering

8. **Sidebar renderer**
- Hover/active visual states
- sidebar scroll pill overlay

9. **Chart event handler**
- chart resize handling
- mouse wheel scrolling
- mouse move processing
- drag, resize, thumb-drag, and hover-state updates

10. **Drawing engine and top-level shell**
- object placement from chart clicks
- single-click, two-click, and three-click creation flows
- tool activation/deactivation
- cleanup of created chart objects

The article explicitly maps tools to click requirements:
- **0 clicks:** pointer, crosshair
- **1 click:** horizontal/vertical line, text, arrows, thumbs, price label, stop sign, check mark, Fibonacci time zones
- **2 clicks:** trend/ray/extended/info lines, shapes, several Fibonacci and Gann tools, regression/stddev channels
- **3 clicks:** parallel channel, Fibonacci channel, pitchfork variants

## 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 3.mq5`

## Statistics

- **Tools covered:** 35
- **Categories covered:** 8
- **Classes described:** 10
- **Theme color fields:** 19
- **Interaction scenarios highlighted:** 5
- select and place a chart object
- scroll overflowing categories
- drag and snap the panel
- resize from the bottom
- switch theme live

## Tags

`MQL5`, `MetaTrader 5`, `UI`, `Canvas`, `Chart Events`, `Drawing Tools`, `Sidebar`, `Flyout Menu`, `Hit Testing`, `Theme Switching`

## Difficulty

**Advanced**

Requires familiarity with:

- MQL5 OOP and inheritance
- chart object APIs
- canvas rendering with `CCanvas`
- chart event processing
- coordinate conversion and hit-testing
- UI state management

## Limitations

- The full original source code is not confirmed as attached in the processed input.
- This README is based on article analysis and quoted excerpts, so the repository should be treated as a reference/reconstruction project.
- Some surrounding dependencies from earlier series parts are referenced but not fully included in the provided text, such as prior icon/category definitions and previously implemented primitive helpers.
- Buildability cannot be guaranteed from the article text alone.

## Reference

- Allan Munene Mutiiria, **Interactive Tools Palette Part 3**, MQL5 article 22214
https://www.mql5.com/en/articles/22214