English Deutsch 日本語
preview
Создаем интерактивную MQL5-панель с использованием класса Controls (Часть 1): Настройка панели

Создаем интерактивную MQL5-панель с использованием класса Controls (Часть 1): Настройка панели

MetaTrader 5Трейдинг | 16 мая 2025, 13:45
290 2
Allan Munene Mutiiria
Allan Munene Mutiiria

Введение

В этой статье мы создадим интерактивную панель управления с помощью класса Controls в MetaQuotes Language 5 (MQL5). Структура макета придаст панели управления внешний вид и базовые функции, которые послужат основой для более сложных операций с панелью. Упор будет сделан на то, как сделать процесс торговли более интуитивно понятным и быстрым для трейдера. К концу статьи у вас у нас будет базовая панель управления MetaTrader 5 с заголовком, а также кнопками для навигации и необходимых действий.

Основная навигационная панель будет иметь три кнопки: Trade (торговля), Close (закрыть) и Information (информация). Каждый раздел будет иметь свои специализированные элементы управления для различных команд. Например, в разделе Trade будут кнопки для определения объема торговли, цены, стоп-лосса (SL), тейк-профита (TP) и установки ордеров Buy, Sell и Buy Stop. В разделе Close среди прочего будет возможность закрыть все прибыльные (Close All Profit) и все отложенные (Close All Pending Orders) ордера. В разделе Information будут отображаться важные торговые данные и обновления статуса. Статья разделена на три основные части:

  1. Описание элементов
  2. Сборка панели графического интерфейса в MQL5
  3. Заключение

В нашей работе мы будем активно использовать язык MetaQuotes Language 5 (MQL5) в качестве нашей основной среды разработки (IDE) в MetaEditor, что позволит нам создавать сложные торговые приложения и интерфейсы. Мы запустим нашу программу непосредственно в торговом терминале MetaTrader 5, где мы сможем отслеживать рыночные данные в реальном времени и беспрепятственно взаимодействовать с нашей торговой программой. Поэтому наличие установленных последних версий MQL5 и MetaTrader 5 имеет решающее значение для совместимости и доступа ко всему спектру доступных функций.


Описание элементов

Здесь мы рассмотрим ключевые компоненты нашей интерактивной панели. Панель будет состоять из нескольких основных элементов, каждый из которых будет служить определенной цели и повышать эффективность торговли. Мы сосредоточимся на трех основных кнопках навигации - Trade, Close и Information, каждая из которых оснащена соответствующими кнопками действий.

В разделе Trade помимо прочих будут содержаться кнопки для объема, цены, стоп-лосса (SL) и тейк-профита (TP), а также кнопки исполнения ордеров Buy, Sell и Buy Stop. В разделе Close среди прочего будет возможность закрыть все прибыльные (Close All Profit) и все отложенные (Close All Pending Orders) ордера. Наконец, в разделе Information будут отображаться важные торговые данные, такие как баланс счета, уровни маржи и обновления рынка в режиме реального времени.

Для наглядного представления этих элементов мы предоставим схему расположения, которая покажет, как эти компоненты будут расположены внутри панели. Иллюстрация послужит дорожной картой для построения нашего графического интерфейса в последующих разделах статьи, помогая нам интегрировать эти элементы в целостный и удобный интерфейс.

Панель


Сборка панели графического интерфейса в MQL5

Панель будет создана на основе советника. Для создания советника в терминале MetaTrader 5 выберите "Сервис" > "Редактор MetaQuotes Language" или просто нажмите F4. Также вы можете щелкнуть по иконке IDE (интегрированная среда разработки) на панели инструментов. Откроется среда разработки на MQL5, которая позволяет писать торговых роботов, технические индикаторы, скрипты и библиотеки функций.

IDE

На панели инструментов выберите "Файл" - "Новый файл" или нажмите CTRL + N, чтобы создать новый документ. Также вы можете нажать на иконку "Создать" в панели инструментов. Откроется окно Мастера MQL.

Новый советник

В открывшемся Мастере выберите Советник (шаблон) и нажмите Далее.

Мастер

В общих свойствах укажите имя файла вашего советника. Чтобы указать или создать папку, если она не существует, используйте обратную косую черту перед именем советника. По умолчанию указана папка Experts\. Это значит, что наш советник будет создан в папке Experts. Остальные разделы довольно просты, но вы можете перейти по ссылке в нижней части Мастера, чтобы узнать детали.

Имя советника

После указания имени файла советника нажмите "Далее" > "Далее" > "Готово". Теперь мы готовы к реализации нашей панели графического интерфейса.

В новом наборе данных программы, который отображается по умолчанию, содержатся метаданные, показывающие необходимые свойства, связанные с файлом. При настройке у нас есть следующие метаданные.

//+------------------------------------------------------------------+
//|                                         CONTROL PANEL PART 1.mq5 |
//|                           Copyright 2024, Allan Munene Mutiiria. |
//|                                     https://forexalgo-trader.com |
//+------------------------------------------------------------------+
#property copyright "Copyright 2024, Allan Munene Mutiiria." //--- Set copyright information
#property link      "https://forexalgo-trader.com"            //--- Link to the author's website
#property version   "1.00"                                    //--- Version of the script

Теперь первое, что нам нужно сделать, это получить доступ к пользовательской библиотеке MQL5 по умолчанию, которая позволит нам создать панель. Она уже организована по классам, что упрощает нашу работу. Файлы, которые мы будем использовать, находятся в папке Include (подпапка Controls). Чтобы получить к ним доступ, просто перейдите в указанные папки и откройте их.

Путь к файлам в папке Include

После просмотра файлов первое, что нам нужно сделать, это включить файлы в программу, чтобы мы могли получить доступ к их свойствам и другим утилитам. Первое, что мы делаем, это подключаем файлы кнопок. Это делается с помощью следующей логики.

#include <Controls/Button.mqh>                                 //--- Include button control library

В этом разделе мы используем библиотеку Button.mqh, которая является частью стандартных библиотек MQL5 для элементов управления графическим пользовательским интерфейсом (GUI). С помощью библиотеки Button.mqh мы получаем доступ к классу CButton, который мы можем использовать для создания, настройки и управления элементами кнопок нашей торговой панели. Используя библиотеку Button.mqh, мы можем реализовать кнопки панели, которые служат различным целям взаимодействия, например, кнопки навигации, кнопки торговых действий (в частности, для ордеров на покупку и продажу) и другие компоненты панели, которым необходимы кнопки в качестве элементов графического интерфейса. При компиляции программы мы должны реализовать некоторые дополнительные расширения файлов в программе, показанные ниже.

Подключенные дополнительные файлы кнопок

Мы можем подтвердить, что файлы добавлены правильно. Теперь мы можем создать объект, который предоставит нам доступ к членам класса и создаст рамку основного фона панели. Мы достигаем этого с помощью следующей логики.

CButton obj_Btn_MAIN;                                       //--- Main button object

Здесь мы объявляем переменную obj_Btn_MAIN как экземпляр класса CButton. Это означает, что obj_Btn_MAIN будет действовать как объект кнопки в нашей программе. Создавая этот объект кнопки, мы по сути резервируем место в памяти для представления и управления основным элементом кнопки в нашем интерфейсе. Класс CButton предоставляет различные методы и свойства для создания, настройки и взаимодействия с элементами управления кнопками, например, для установки надписи, размера и цвета кнопки, а также для обработки событий нажатия. Теперь мы можем приступить к созданию кнопки при инициализации советника. Это обработчик событий OnInit.

//+------------------------------------------------------------------+
//| Expert initialization function                                   |
//+------------------------------------------------------------------+
int OnInit() {
   //--- Start of the initialization function

   //--- MAIN BUTTON
   obj_Btn_MAIN.Create(0, Btn_MAIN, 0, 30, 30, 0, 0); //--- Create the main button at specified coordinates
   

   //--- End of initialization function
   return(INIT_SUCCEEDED); //--- Return initialization success status
}

Здесь, в обработчике событий OnInit, при первом присоединении советника к графику или повторной инициализации, мы создаем главную кнопку панели. Вызываем объект obj_Btn_MAIN и используем оператор точка, чтобы получить доступ ко всем членам класса. С оператором точка у нас должно получиться примерно следующее:

Члены оператора точка

Create — это функция-член, которую мы выбираем и предоставляем ей необходимые параметры. Чтобы четко понять, что все означает, давайте разберем параметры:

  • Первый параметр (0) указывает идентификатор графика. Значение 0 относится к текущему графику, на котором работает советник.
  • Второй параметр (Btn_MAIN) — это предопределенная строковая константа, представляющая имя этой кнопки. Это имя используется для ссылки на кнопку в других частях программы. Для удобства ссылок мы определили его в глобальной области видимости следующим образом:

//--- Define button names for easier reference
#define Btn_MAIN "Btn_MAIN"                                   //--- Button name for the main button

  • Третий параметр (0) относится к индексу подокна. Здесь 0 указывает, что кнопка должна быть размещена в главном окне графика.
  • Четвертый (30) и пятый (30) параметры задают координаты X и Y кнопки соответственно. Они определяют положение кнопки на графике.
  • Последние два параметра (0 и 0) определяют ширину и высоту кнопки. В этом случае значение 0 означает, что кнопка будет использовать размеры по умолчанию. Это проиллюстрировано ниже:

Расстояние и размер

При запуске программы мы видим следующее.

Кнопка по умолчанию без высоты и ширины

На изображении мы видим, что наши первые координаты установлены как 30 и 30 пикселей, но вторые координаты отображаются как 0, поскольку мы оставляем их равными 0. Таким образом, наши вторые координаты отображаются в начале координат (0,0). Чтобы задать вторые координаты, можно использовать несколько способов. Первый — это их прямое определение в функции-члене. 

   //--- MAIN BUTTON
   obj_Btn_MAIN.Create(0, Btn_MAIN, 0, 30, 30, 310, 300); //--- Create the main button at specified coordinates

Здесь мы определяем вторые координаты кнопки. У нас они составляют 310 и 300 пикселей для осей x и y соответственно. Для большей наглядности мы также выделили их желтым цветом. После запуска мы получим следующий результат.

Вывод X и Y

Мы получили ожидаемые результаты. Однако для использования этого метода необходимо быть внимательным при определении пикселей, поскольку вторые координаты никак не связаны с первыми. Таким образом, необходимо провести основательные расчеты, поскольку все пиксели отсчитываются от начала координат. Например, если заданные нами вторые координаты равны 10 и 10, кнопка будет иметь вторые координаты по осям y и x на расстоянии 10 пикселей от начала координат. Таким образом, наша кнопка будет отображена в обратном направлении, ее размер составит (30-10 = 20) 20 пикселей.

Отображение в обратном направлении

Чтобы избежать математических вычислений, связанных с первым методом, мы можем использовать второй метод, который подразумевает определение высоты и ширины кнопки, которые напрямую вычисляются из первых координат. Используется следующая логика.

   //--- MAIN BUTTON
   obj_Btn_MAIN.Create(0, Btn_MAIN, 0, 30, 30, 0, 0); //--- Create the main button at specified coordinates
   obj_Btn_MAIN.Width(20); //---  Set width of the main button
   obj_Btn_MAIN.Height(20); //---  Set height of the main button

Здесь мы используем функции-члены width и height для установки размера кнопки. Мы использовали единый размер в 20 пикселей, чтобы увидеть разницу. После компиляции программы получаем следующие результаты.

Отображение в прямом направлении

На иллюстрации мы видим, что кнопка отображается в прямом направлении, а это значит, что нам не нужно акцентировать внимание на вторых координатах при определении начальной точки. Существует еще один, третий способ определения точек напрямую, который экономит место за счет объединения параметров ширины и высоты. Фрагмент его кода выглядит следующим образом:

   //--- MAIN BUTTON
   obj_Btn_MAIN.Create(0, Btn_MAIN, 0, 30, 30, 0, 0); //--- Create the main button at specified coordinates
   //obj_Btn_MAIN.Width(310); //--- (Commented out) Set width of the main button
   //obj_Btn_MAIN.Height(300); //--- (Commented out) Set height of the main button
   obj_Btn_MAIN.Size(310, 300); //--- Set size of the main button

Здесь мы напрямую задаем размер кнопки. Однако нам необходимо задать цвета фона и границы кнопки. 

   obj_Btn_MAIN.ColorBackground(C'070,070,070'); //--- Set background color of the main button
   obj_Btn_MAIN.ColorBorder(clrBlack); //--- Set border color of the main button

Здесь мы настраиваем внешний вид нашей кнопки obj_Btn_MAIN, задавая цвета ее фона и границы. Сначала мы вызываем метод ColorBackground для объекта obj_Btn_MAIN и передаем значения RGB C'070,070,070' в качестве параметра. RGB означает красный (Red), зеленый (Green) и синий (Blue) — три основных цвета, используемых для создания широкого спектра цветов на цифровых экранах.

Формат RGB принимает три значения, представляющие интенсивность красного, зеленого и синего цветов в диапазоне от 0 до 255, где 0 означает отсутствие интенсивности, а 255 — максимальную интенсивность. Например, C'070,070,070' означает, что:

  • Мы устанавливаем красный компонент на 70 (из 255)
  • Зеленый - на 70
  • Синий - на 70

Если мы установим все три значения RGB равными, то полученный цвет будет оттенком серого. Поскольку для всех трех компонентов мы используем умеренные значения 70, фон кнопки становится темно-серым. Этот цвет визуально нейтрален, что позволяет другим ярким элементам, которые мы создадим, выделяться на панели.

Далее мы вызываем метод ColorBorder и задаем цвет с помощью константы clrBlack, которая представляет чистый черный цвет. Здесь каждое значение RGB равно 0 (C'000,000,000'), что означает отсутствие красного, зеленого или синего компонентов. Используя черный цвет для рамки, мы создаем четкий визуальный контур, явно определяя границы кнопки на более темном сером фоне, благодаря чему она выглядит более четкой и структурированной. Такой подход гарантирует, что кнопку будет легко различить, а также придаст привлекательный вид всему графическому интерфейсу. После компиляции мы получаем следующий результат.

Главная кнопка

Вот наша главная кнопка. Наконец, нам нужно обновить диаграмму, чтобы изменения вступили в силу автоматически, без необходимости ожидания ручного события графика, которое повлияет на обновление. Использованная логика представлена ниже.

   ChartRedraw(0); //--- Redraw the chart to update the panel

Здесь мы вызываем функцию ChartRedraw для визуального обновления интерфейса графика. Мы делаем это для того, чтобы гарантировать правильное отображение всех вновь добавляемых графических элементов — кнопок, надписей и так далее. Функция ChartRedraw незаменима всякий раз, когда мы добавляем, изменяем или удаляем элементы графика, поскольку она заставляет терминал повторно отображать текущий график. Это особенно важно, когда мы создаем интерактивные панели и хотим быть уверены, что панель показывает пользователю самое последнее состояние, которое она может показать.

При вызове функции используется параметр 0. Это идентификатор графика. Каждый график в MetaTrader 5 имеет уникальный идентификатор, а 0 относится к текущему графику, к которому прикреплен советник. Чтобы перерисовать график, необходимо передать правильный идентификатор. Мы гарантируем, что перерисовка будет применена к этому конкретному графику. Если мы не вызовем функцию ChartRedraw, мы можем столкнуться с проблемой. Недавно созданные графические объекты могут не отображаться, либо измененные графические объекты могут не отображать внесенные в них изменения. Они по-прежнему будут отображать свои устаревшие свойства. При вызове функции ChartRedraw для панели мы можем гарантировать, что наша панель и ее содержимое отображаются правильно. Окончательный код инициализации, отвечающий за создание главной кнопки, выглядит следующим образом.

//+------------------------------------------------------------------+
//| Expert initialization function                                   |
//+------------------------------------------------------------------+
int OnInit() {
   //--- Start of the initialization function

   //--- MAIN BUTTON
   obj_Btn_MAIN.Create(0, Btn_MAIN, 0, 30, 30, 0, 0); //--- Create the main button at specified coordinates
   //obj_Btn_MAIN.Width(310); //--- (Commented out) Set width of the main button
   //obj_Btn_MAIN.Height(300); //--- (Commented out) Set height of the main button
   obj_Btn_MAIN.Size(310, 300); //--- Set size of the main button
   obj_Btn_MAIN.ColorBackground(C'070,070,070'); //--- Set background color of the main button
   obj_Btn_MAIN.ColorBorder(clrBlack); //--- Set border color of the main button


   ChartRedraw(0); //--- Redraw the chart to update the panel

   //--- End of initialization function
   return(INIT_SUCCEEDED); //--- Return initialization success status
}

К этому моменту у нас уже есть некоторая базовая информация о том, что мы будем делать, и о необходимых вещах, которые нам предстоит сделать. Таким образом, мы можем определить объекты для всех кнопок, которые нам понадобятся для начального интерфейса.

#include <Controls/Button.mqh>                                 //--- Include button control library
CButton obj_Btn_MAIN;                                       //--- Main button object
CButton obj_Btn_HEADER;                                     //--- Header button object
CButton obj_Btn_X;                                          //--- Close button (X) object
CButton obj_Btn_TRADE;                                     //--- Trade button object
CButton obj_Btn_CLOSE;                                      //--- Close button object
CButton obj_Btn_INFO;                                       //--- Information button object
CButton obj_Btn_RISK;                                       //--- Risk button object
CButton obj_Btn_POINTS;                                     //--- Points button object
CButton obj_Btn_SELL;                                       //--- Sell button object
CButton obj_Btn_ENTRY;                                      //--- Entry button object
CButton obj_Btn_BUY;                                        //--- Buy button object
CButton obj_Btn_SELLSTOP;                                   //--- Sell Stop button object
CButton obj_Btn_BUYSTOP;                                    //--- Buy Stop button object
CButton obj_Btn_SELLLIMIT;                                  //--- Sell Limit button object
CButton obj_Btn_BUYLIMIT;                                   //--- Buy Limit button object
CButton obj_Btn_FOOTER;                                     //--- Footer button object

Здесь мы определяем несколько объектов кнопок с помощью класса CButton для представления различных интерактивных элементов панели. Каждая строка создает уникальный объект кнопки, формируя базовую структуру для различных разделов панели управления, которые нам необходимо создать. Давайте разберем назначение каждой кнопки:

  • obj_Btn_HEADER - кнопка заголовка панели. Мы можем использовать этот объект для отображения заголовка, значка или в качестве визуального разделителя верхней части панели.
  • obj_Btn_X - кнопка закрытия (часто обозначается как X), позволяющая пользователям выйти или скрыть панель.
  • obj_Btn_TRADE - кнопка Trade, являющаяся центральным элементом управления. При нажатии этой кнопки активируются функции торговли, осуществляется переход к параметрам торговли и открываются подменю, относящиеся к торговым действиям.
  • obj_Btn_CLOSE - кнопка Close для управления закрытием сделок. Она будет функционировать как переключатель для перехода между разделом торговли и разделом закрытия на панели.
  • obj_Btn_INFO - кнопка Info будет использоваться для предоставления пользователю информации, включая торговые показатели, данные счета и описания панелей.

Для кнопок торговых функций объекты будут служить определенным целям в торговом контексте:

  • obj_Btn_RISK - кнопка управления рисками. Это позволит пользователю настраивать или корректировать параметры риска, такие как процент риска на сделку.
  • obj_Btn_POINTS - эта кнопка будет использоваться для установки или переключения на торговые опции на основе пунктов, где определенные уровни, такие как стоп-лосс или тейк-профит, определяются в пунктах, а не в уровнях цен.
  • obj_Btn_SELL, obj_Btn_ENTRY и obj_Btn_BUY - кнопки торговых действий. obj_Btn_SELL - продажа, obj_Btn_BUY - покупка, obj_Btn_ENTRY - вход в рынок.

Для отложенных ордеров используются следующие кнопки:

  • obj_Btn_SELLSTOP и obj_Btn_BUYSTOP управляют положением отложенных ордеров Sell Stop и Buy Stop, которые размещаются ниже или выше текущей цены соответственно.
  • obj_Btn_SELLLIMIT и obj_Btn_BUYLIMIT обрабатывают отложенные ордера Sell Limit и Buy Limit, позволяя пользователям размещать ордера на указанных уровнях в ожидании коррекции цен.

obj_Btn_FOOTER используется для определения кнопки нижнего колонтитула панели. Эта кнопка может выступать в качестве декоративного элемента, элемента управления сбросом или кнопки навигации для переключения в режим сводных данных. В нашем случае мы будем использовать ее для отображения сводкных данных панели управления.

Аналогично нам нужно будет определить поля редактирования и текста соответственно. Применяется следующая логика.

#include <Controls/Edit.mqh>                                   //--- Include edit control library
CEdit obj_Edit_RISK;                                        //--- Risk edit field object
CEdit obj_Edit_PRICE;                                       //--- Price edit field object
CEdit obj_Edit_LOTS;                                        //--- Lots edit field object
CEdit obj_Edit_SL;                                          //--- Stop Loss edit field object
CEdit obj_Edit_TP;                                          //--- Take Profit edit field object

#include <Controls/Label.mqh>                                  //--- Include label control library
CLabel obj_Lbl_HEADER;                                      //--- Header label object
CLabel obj_Lbl_PRICE;                                       //--- Price label object
CLabel obj_Lbl_LOTS;                                        //--- Lots label object
CLabel obj_Lbl_SL;                                          //--- Stop Loss label object
CLabel obj_Lbl_TP;                                          //--- Take Profit label object

Здесь мы включаем основные библиотеки для управления вводом данных пользователем и отображения текста на панели управления. Во-первых, мы включаем библиотеку Edit.mqh, которая предоставляет функциональные возможности для редактируемых полей ввода. Определено несколько объектов класса CEdit, включая obj_Edit_RISK как поле редактирования риска. Объект obj_Edit_PRICE представляет собой поле редактирования цены, в котором пользователь может указать желаемую цену сделки. Объект с именем obj_Edit_LOTS предназначен для размера лота, который пользователи могут настраивать, чтобы указать количество лотов, которыми они хотят торговать. obj_Edit_SL - поле редактирования стоп-лосса. И, наконец, obj_Edit_TP служит полем редактирования тейк-профита.

Далее мы интегрируем библиотеку Label.mqh. Она упрощает процесс создания статических текстовых надписей на панели, что особенно полезно для удобства интерфейса. Библиотека разработана специально для нашей рабочей среды и включает класс CLabel, который мы создали несколько раз для создания различных надписей, которые нам нужны на нашей панели. Первая текстовая метка, которую мы создаем, называется obj_Lbl_HEADER и используется для отображения заголовка или наиболее важной информации в самом верху панели. Следующая метка называется obj_Lbl_PRICE и используется для указания текущей цены актива, с которым мы работаем. Рядом с полем ввода размера лота находится метка obj_Lbl_LOTS, которая используется для указания размера лота. После этого мы можем определить соответствующие поля панели, а также:

//--- Define button names for easier reference
#define Btn_MAIN "Btn_MAIN"                                   //--- Button name for the main button
#define Btn_HEADER "Btn_HEADER"                               //--- Button name for the header button
#define Btn_X "Btn_X"                                        //--- Button name for the close button
#define Btn_TRADE "Btn_TRADE"                               //--- Button name for the trade button
#define Btn_CLOSE "Btn_CLOSE"                                //--- Button name for the close button
#define Btn_INFO "Btn_INFO"                                  //--- Button name for the info button

#define Btn_RISK "Btn_RISK"                                  //--- Button name for the risk button
#define Btn_POINTS "Btn_POINTS"                              //--- Button name for the points button
#define Btn_SELL "Btn_SELL"                                  //--- Button name for the sell button
#define Btn_ENTRY "Btn_ENTRY"                                //--- Button name for the entry button
#define Btn_BUY "Btn_BUY"                                    //--- Button name for the buy button
#define Btn_SELLSTOP "Btn_SELLSTOP"                          //--- Button name for the sell stop button
#define Btn_BUYSTOP "Btn_BUYSTOP"                            //--- Button name for the buy stop button
#define Btn_SELLLIMIT "Btn_SELLLIMIT"                        //--- Button name for the sell limit button
#define Btn_BUYLIMIT "Btn_BUYLIMIT"                          //--- Button name for the buy limit button
#define Btn_FOOTER "Btn_FOOTER"                              //--- Button name for the footer button

//---
//--- Define edit field names for easier reference
#define Edit_RISK "Edit_RISK"                                //--- Edit field name for risk input
#define Edit_PRICE "Edit_PRICE"                              //--- Edit field name for price input
#define Edit_LOTS "Edit_LOTS"                                //--- Edit field name for lots input
#define Edit_SL "Edit_SL"                                    //--- Edit field name for stop loss input
#define Edit_TP "Edit_TP"                                    //--- Edit field name for take profit input

//--- Define label names for easier reference
#define Lbl_HEADER "Lbl_HEADER"                              //--- Label name for the header
#define Lbl_PRICE "Lbl_PRICE"                                //--- Label name for the price
#define Lbl_LOTS "Lbl_LOTS"                                  //--- Label name for the lots
#define Lbl_SL "Lbl_SL"                                      //--- Label name for the stop loss
#define Lbl_TP "Lbl_TP"                                      //--- Label name for the take profit

Определив ключевые элементы, которые нам нужны в нашем интерфейсе инициализации, мы можем приступить к созданию заголовка нашей панели, используя уже определенные утилиты. Принятая логика заголовка показана во фрагменте кода ниже:

   //--- HEADER BUTTON 
   obj_Btn_HEADER.Create(0, Btn_HEADER, 0, 30, 30, 0, 0); //--- Create the header button at specified coordinates
   obj_Btn_HEADER.Size(310, 25); //--- Set size of the header button
   obj_Btn_HEADER.ColorBackground(clrLightBlue); //--- Set background color of the header button
   obj_Btn_HEADER.ColorBorder(clrBlack); //--- Set border color of the header button

Здесь мы создаем и настраиваем кнопку заголовка панели управления. Начнем с использования метода Create применительно к объекту obj_Btn_HEADER для инициализации кнопки с параметрами, которые указывают ее идентификатор графика, имя (Btn_HEADER), первые координаты (30, 30) и вторые координаты (0, 0). Далее мы устанавливаем размер кнопки 310 пикселей в ширину и 25 пикселей в высоту с помощью метода Size, чтобы она хорошо вписалась в макет панели.

Затем мы настраиваем цвет фона кнопки заголовка с помощью метода ColorBackground, устанавливая для него значение clrLightBlue для визуальной привлекательности. Кроме того, мы указываем цвет границы с помощью метода ColorBorder и устанавливаем для него значение clrBlack, что улучшает видимость кнопки и ее четкость на фоне панели. После компиляции мы получаем следующий результат.

Вывод заголовка

Всё работает как надо. Теперь мы можем оживить заголовок, добавив к нему метку и боковую кнопку закрытия. Давайте сначала добавим кнопку закрытия. Логика показана ниже.

   //--- X BUTTON
   obj_Btn_X.Create(0, Btn_X, 0, 30 + 280, 30 + 1, 0, 0); //--- Create the close button (X) at specified coordinates
   obj_Btn_X.Size(30 - 1, 25 - 1 - 1); //--- Set size of the close button
   obj_Btn_X.ColorBackground(clrLightBlue); //--- Set background color of the close button
   obj_Btn_X.ColorBorder(clrLightBlue); //--- Set border color of the close button
   obj_Btn_X.Text(CharToString(255)); //--- Set the close button text to an "X" character
   obj_Btn_X.Color(clrBlack); //--- Set text color of the close button
   obj_Btn_X.Font("Wingdings"); //--- Set font of the close button to Wingdings
   obj_Btn_X.FontSize(17); //--- Set font size of the close button

Здесь мы создаем и настраиваем кнопку закрытия (X) для панели. Начнем с инициализации кнопки с помощью метода Create на объекте obj_Btn_X. Предоставляемые нами параметры определяют идентификатор графика, имя (Btn_X) и положение на графике, рассчитанное таким образом, чтобы разместить ее по координате x (30 + 280) и y (30 + 1), гарантируя ее правильное выравнивание в макете панели.

Далее мы устанавливаем размер кнопки закрытия равным 29 (30 -1) пикселям в ширину и 23 (25 - 1 - 1) пикселям в высоту с помощью метода Size, немного уменьшая размер по умолчанию, чтобы она хорошо вписывалась в пользовательский интерфейс. Мы играемся с 1 пикселем, чтобы создать границу, которая не перекрывает границу заголовка, а попадает внутрь него. Затем мы устанавливаем голубой цвет фона кнопки с помощью метода ColorBackground для стилизации под кнопку заголовка. Цвет границы также устанавливается светло-голубым с помощью метода ColorBorder, что придает кнопке чистый вид без контрастной границы.

Продолжаем устанавливать текст кнопки в виде значка, используя функцию CharToString и 255 в качестве параметра, что позволяет кнопке визуально указывать на ее функцию как кнопки закрытия. В MQL5 символ представляет значок Windows, но может быть чем угодно. Цвет текста установлен черным с помощью метода Color, что обеспечивает его выделение на светлом фоне. Наконец, мы выбираем шрифт Wingdings для кнопки закрытия с помощью метода Font, который подходит для отображения символа Windows, а также устанавливаем размер шрифта 17 с помощью метода FontSize для улучшения читабельности. Ниже представлены возможные коды символов в MQL5.

Возможные коды MQL5

Мы видим, что существует огромное количество вариантов на выбор, но мы остановимся на первоначальном коде 255. Напоследок нам нужно задать заголовок.

   //--- HEADER LABEL
   obj_Lbl_HEADER.Create(0, Lbl_HEADER, 0, 40, 30, 0, 0); //--- Create the header label at specified coordinates
   obj_Lbl_HEADER.Text("Control Panel"); //--- Set text of the header label
   obj_Lbl_HEADER.Color(clrRed); //--- Set text color of the header label
   obj_Lbl_HEADER.Font("Cooper black"); //--- Set font of the header label to Cooper Black
   obj_Lbl_HEADER.FontSize(14); //--- Set font size of the header label

Здесь мы создаем и настраиваем заголовок для торговой панели. Начнем с инициализации метки с помощью метода Create на объекте obj_Lbl_HEADER, указав идентификатор графика, имя метки (Lbl_HEADER) и ее положение на графике: (40) для координаты x и (30) для координаты y. Такое расположение гарантирует, что заголовок будет отображаться правильно на макете панели.

Далее мы устанавливаем текст заголовка "Control Panel" (панель управления) с помощью метода Text, четко указывая назначение панели. Разумеется, вы можете установить свой заголовок. Затем мы устанавливаем красный цвет текста с помощью метода Color, гарантируя, что он будет выделяться на фоне и станет более заметным. Шрифт заголовка установлен на Cooper black с использованием метода Font, что придает тексту четкий и профессиональный вид. Наконец, мы указываем размер шрифта 14 с помощью метода FontSize, гарантируя, что текст заголовка будет легко читаемым. После компиляции получаем следующий результат.

Готовый заголовок

Всё работает как надо. Аналогичным образом можно создавать кнопки навигации. Сначала мы создадим кнопку просмотра торговых операций, используя следующую логику. 

   //--- TRADE BUTTON
   obj_Btn_TRADE.Create(0, Btn_TRADE, 0, 40, 60, 0, 0); //--- Create the trade button at specified coordinates
   obj_Btn_TRADE.Size(90, 30); //--- Set size of the trade button
   obj_Btn_TRADE.ColorBackground(clrYellow); //--- Set background color of the trade button
   obj_Btn_TRADE.ColorBorder(clrYellow); //--- Set border color of the trade button
   obj_Btn_TRADE.Text("Trade"); //--- Set text of the trade button
   obj_Btn_TRADE.Color(clrBlack); //--- Set text color of the trade button
   obj_Btn_TRADE.Font("Arial Black"); //--- Set font of the trade button to Arial Black
   obj_Btn_TRADE.FontSize(13); //--- Set font size of the trade button

Здесь мы меняем размер кнопки, а также меняем цвет фона на желтый. После компиляции мы получаем следующий результат.

Кнопка Trade

Всё получилось. Мы устанавливаем желтый цвет кнопки, чтобы показать, что она активна. При определении других кнопок навигации будет сохранена аналогичная логика, но цвет будет изменен на неактивный. Вот полная логика.

   //--- CLOSE BUTTON
   obj_Btn_CLOSE.Create(0, Btn_CLOSE, 0, 40 + obj_Btn_TRADE.Width() + 10, 60, 0, 0); //--- Create the close button at specified coordinates
   obj_Btn_CLOSE.Size(90, 30); //--- Set size of the close button
   obj_Btn_CLOSE.ColorBackground(clrSilver); //--- Set background color of the close button
   obj_Btn_CLOSE.ColorBorder(clrSilver); //--- Set border color of the close button
   obj_Btn_CLOSE.Text("Close"); //--- Set text of the close button
   obj_Btn_CLOSE.Color(clrBlack); //--- Set text color of the close button
   obj_Btn_CLOSE.Font("Arial Black"); //--- Set font of the close button to Arial Black
   obj_Btn_CLOSE.FontSize(13); //--- Set font size of the close button

   //--- INFO BUTTON
   obj_Btn_INFO.Create(0, Btn_INFO, 0, 40 + obj_Btn_TRADE.Width() + 10 + obj_Btn_CLOSE.Width() + 10, 60, 0, 0); //--- Create the info button at specified coordinates
   obj_Btn_INFO.Size(90, 30); //--- Set size of the info button
   obj_Btn_INFO.ColorBackground(clrSilver); //--- Set background color of the info button
   obj_Btn_INFO.ColorBorder(clrSilver); //--- Set border color of the info button
   obj_Btn_INFO.Text("Inform'n"); //--- Set text of the info button
   obj_Btn_INFO.Color(clrBlack); //--- Set text color of the info button
   obj_Btn_INFO.Font("Arial Black"); //--- Set font of the info button to Arial Black
   obj_Btn_INFO.FontSize(13); //--- Set font size of the info button

Здесь мы создаем кнопки закрытия и информации и устанавливаем для них серебристый цвет фона, чтобы он указывал на их изначальное неактивное состояние. Вот как она выглядит.

Кнопки навигации

После определения кнопок навигации мы можем ввести раздел нижнего колонтитула. Логика следующая.

   //--- FOOTER BUTTON
   obj_Btn_FOOTER.Create(0, Btn_FOOTER, 0, 30 + 1, 305 - 1, 0, 0); //--- Create the footer button at specified coordinates
   obj_Btn_FOOTER.Size(310 - 1 - 1, 25); //--- Set size of the footer button
   obj_Btn_FOOTER.ColorBackground(C'070,070,070'); //--- Set background color of the footer button
   obj_Btn_FOOTER.ColorBorder(C'070,070,070'); //--- Set border color of the footer button
   obj_Btn_FOOTER.Text(ShortToString(0x23F0) + "https://t.me/Forex_Algo_Trader"); //--- Set text of the footer button with a link
   obj_Btn_FOOTER.Color(clrWhite); //--- Set text color of the footer button
   obj_Btn_FOOTER.Font("Calibri bold italic"); //--- Set font of the footer button to Calibri bold italic
   obj_Btn_FOOTER.FontSize(12); //--- Set font size of the footer button

Здесь мы создаем и настраиваем кнопку нижнего колонтитула торговой панели, передавая обычные параметры и помещая ее в нижнюю часть панели. Далее мы определяем размер кнопки нижнего колонтитула с помощью метода Size, устанавливая ее размеры 310 - 1 - 1 для ширины и 25 для высоты. Это гарантирует, что кнопка будет хорошо помещаться в нижней части панели. Затем мы устанавливаем темно-серый цвет фона кнопки, используя метод ColorBackground со значениями RGB C'070,070,070' для большей визуальной привлекательности и соответствия общему дизайну.

Цвет границы также задается темно-серым с помощью метода ColorBorder, что придает кнопке бесшовный вид. Для текста кнопки мы используем метод Text, чтобы придать ему вид значка (представленного символом Unicode 0x23F0, который выглядит как часы) и добавить ссылку https://t.me/Forex_Algo_Trader для доступа к дополнительным ресурсам. у нас есть символы Unicode, преобразованные в значки с помощью функции ShortToString. Символы представлены в шестнадцатеричной форме, как показано ниже, и именно поэтому нам нужна эта функция.

Символы Unicode

Устанавливаем белый цвет текста с помощью метода Color, чтобы улучшить видимость на темном фоне. Наконец, мы устанавливаем шрифт Calibri полужирный курсив для нижнего колонтитула с помощью метода Font, что придает ему более профессиональный вид, и устанавливаем размер шрифта на 12 с помощью метода FontSize, гарантируя, что текст останется читабельным. Upon compilation, we have the following milestone.

Нижний колонтитул на текущем этапе

Всё работает как надо. Теперь нам нужно завершить работу над телом панели. Поскольку нам придется постоянно менять вид тела при каждой активации кнопки навигации, мы можем поместить логику тела в функцию и вызывать ее только при необходимости. 

   // BODY OF THE PANEL
   createSection_Trade(); //--- Call function to create the trade section

Здесь мы создаем функцию под названием createSection_Trade в теле панели для настройки раздела Trade на панели управления. Обычно это означает вызов функции. Эта функция используется для создания и настройки интерактивных элементов, связанных с торговыми операциями, таких как кнопки покупки, продажи и типа ордера. Используя эту функцию, мы делаем код модульным и организованным, что позволит обрабатывать все элементы, связанные с торговлей, в рамках отдельной функции. Это позволяет сделать основную панель чище, что упрощает обслуживание и расширение панели по мере необходимости.

Затем нам необходимо определить функцию. Поскольку она проста, мы определяем ее как void и не передаем ей никаких параметров. 

void createSection_Trade(){

//---

}

Для введения необходимого функционала мы используем ту же логику, что и в остальном коде. Полный фрагмент кода функции выглядит так.

//+------------------------------------------------------------------+
//|     FUNCTION TO CREATE THE TRADE SECTION                         |
//+------------------------------------------------------------------+
void createSection_Trade(){
   //--- RISK BUTTON
   obj_Btn_RISK.Create(0,Btn_RISK,0,40,100,0,0); //--- Create the risk button
   obj_Btn_RISK.Size(210,25); //--- Set the button size
   obj_Btn_RISK.ColorBackground(clrTurquoise); //--- Set the background color
   obj_Btn_RISK.ColorBorder(clrTurquoise); //--- Set the border color
   obj_Btn_RISK.Text("Risk based on Equity (%)"); //--- Set the button text
   obj_Btn_RISK.Color(clrBlack); //--- Set the text color
   obj_Btn_RISK.Font("Arial Black"); //--- Set the font style
   obj_Btn_RISK.FontSize(11); //--- Set the font size
   
   //--- RISK EDIT
   obj_Edit_RISK.Create(0,Edit_RISK,0,40+220,100,0,0); //--- Create the risk edit field
   obj_Edit_RISK.Size(70,25); //--- Set the edit field size
   obj_Edit_RISK.ColorBackground(clrWhite); //--- Set the background color
   obj_Edit_RISK.ColorBorder(clrBlack); //--- Set the border color
   obj_Edit_RISK.Text("78"); //--- Set the default text
   obj_Edit_RISK.Color(clrBlack); //--- Set the text color
   obj_Edit_RISK.Font("Times new roman bold"); //--- Set the font style
   obj_Edit_RISK.FontSize(15); //--- Set the font size
   
   //--- PRICE LABEL
   obj_Lbl_PRICE.Create(0,Lbl_PRICE,0,40,130,0,0); //--- Create the price label
   obj_Lbl_PRICE.Text("Price"); //--- Set the label text
   obj_Lbl_PRICE.Color(clrWhite); //--- Set the text color
   obj_Lbl_PRICE.Font("Arial black"); //--- Set the font style
   obj_Lbl_PRICE.FontSize(13); //--- Set the font size   
   
   //--- PRICE EDIT
   obj_Edit_PRICE.Create(0,Edit_PRICE,0,40+60,130,0,0); //--- Create the price edit field
   obj_Edit_PRICE.Size(90,25); //--- Set the edit field size
   obj_Edit_PRICE.ColorBackground(clrWhite); //--- Set the background color
   obj_Edit_PRICE.ColorBorder(clrBlack); //--- Set the border color
   obj_Edit_PRICE.Text(DoubleToString(SymbolInfoDouble(_Symbol,SYMBOL_ASK),_Digits)); //--- Set the default text to current ask price
   obj_Edit_PRICE.Color(clrBlack); //--- Set the text color
   obj_Edit_PRICE.Font("Times new roman bold"); //--- Set the font style
   obj_Edit_PRICE.FontSize(13); //--- Set the font size
   
   //--- LOTS LABEL
   obj_Lbl_LOTS.Create(0,Lbl_LOTS,0,40+160,130,0,0); //--- Create the lot size label
   obj_Lbl_LOTS.Text("Lot size"); //--- Set the label text
   obj_Lbl_LOTS.Color(clrWhite); //--- Set the text color
   obj_Lbl_LOTS.Font("Arial black"); //--- Set the font style
   obj_Lbl_LOTS.FontSize(13); //--- Set the font size   
   
   //--- LOTS EDIT
   obj_Edit_LOTS.Create(0,Edit_LOTS,0,40+60+180,130,0,0); //--- Create the lot size edit field
   obj_Edit_LOTS.Size(50,25); //--- Set the edit field size
   obj_Edit_LOTS.ColorBackground(clrWhite); //--- Set the background color
   obj_Edit_LOTS.ColorBorder(clrBlack); //--- Set the border color
   obj_Edit_LOTS.Text("0.01"); //--- Set the default text
   obj_Edit_LOTS.Color(clrBlack); //--- Set the text color
   obj_Edit_LOTS.Font("Times new roman bold"); //--- Set the font style
   obj_Edit_LOTS.FontSize(13); //--- Set the font size
   
   //--- SL LABEL
   obj_Lbl_SL.Create(0,Lbl_SL,0,40,160,0,0); //--- Create the stop loss label
   obj_Lbl_SL.Text("SL"); //--- Set the label text
   obj_Lbl_SL.Color(clrWhite); //--- Set the text color
   obj_Lbl_SL.Font("Arial black"); //--- Set the font style
   obj_Lbl_SL.FontSize(13); //--- Set the font size   
   
   //--- SL EDIT
   obj_Edit_SL.Create(0,Edit_SL,0,40+30,160,0,0); //--- Create the stop loss edit field
   obj_Edit_SL.Size(70,25); //--- Set the edit field size
   obj_Edit_SL.ColorBackground(clrWhite); //--- Set the background color
   obj_Edit_SL.ColorBorder(clrBlack); //--- Set the border color
   obj_Edit_SL.Text("300"); //--- Set the default text
   obj_Edit_SL.Color(clrBlack); //--- Set the text color
   obj_Edit_SL.Font("Times new roman bold"); //--- Set the font style
   obj_Edit_SL.FontSize(13); //--- Set the font size
   
   //--- TP LABEL
   obj_Lbl_TP.Create(0,Lbl_TP,0,40+190,160,0,0); //--- Create the take profit label
   obj_Lbl_TP.Text("TP"); //--- Set the label text
   obj_Lbl_TP.Color(clrWhite); //--- Set the text color
   obj_Lbl_TP.Font("Arial black"); //--- Set the font style
   obj_Lbl_TP.FontSize(13); //--- Set the font size   
   
   //--- TP EDIT
   obj_Edit_TP.Create(0,Edit_TP,0,40+30+190,160,0,0); //--- Create the take profit edit field
   obj_Edit_TP.Size(70,25); //--- Set the edit field size
   obj_Edit_TP.ColorBackground(clrWhite); //--- Set the background color
   obj_Edit_TP.ColorBorder(clrBlack); //--- Set the border color
   obj_Edit_TP.Text("750"); //--- Set the default text
   obj_Edit_TP.Color(clrBlack); //--- Set the text color
   obj_Edit_TP.Font("Times new roman bold"); //--- Set the font style
   obj_Edit_TP.FontSize(13); //--- Set the font size
    
   //--- POINTS BUTTON
   obj_Btn_POINTS.Create(0,Btn_POINTS,0,40+110,160,0,0); //--- Create the points button
   obj_Btn_POINTS.Size(70,25); //--- Set the button size
   obj_Btn_POINTS.ColorBackground(clrGoldenrod); //--- Set the background color
   obj_Btn_POINTS.ColorBorder(clrGoldenrod); //--- Set the border color
   obj_Btn_POINTS.Text("Points"); //--- Set the button text
   obj_Btn_POINTS.Color(clrBlack); //--- Set the text color
   obj_Btn_POINTS.Font("Calibri bold"); //--- Set the font style
   obj_Btn_POINTS.FontSize(14); //--- Set the font size
   
   //--- SELL BUTTON
   obj_Btn_SELL.Create(0,Btn_SELL,0,40,210,0,0); //--- Create the sell button
   obj_Btn_SELL.Size(100,25); //--- Set the button size
   obj_Btn_SELL.ColorBackground(clrOrangeRed); //--- Set the background color
   obj_Btn_SELL.ColorBorder(clrOrangeRed); //--- Set the border color
   obj_Btn_SELL.Text("Sell"); //--- Set the button text
   obj_Btn_SELL.Color(clrWhite); //--- Set the text color
   obj_Btn_SELL.Font("Calibri bold"); //--- Set the font style
   obj_Btn_SELL.FontSize(14); //--- Set the font size
   
   //--- ENTRY BUTTON
   obj_Btn_ENTRY.Create(0,Btn_ENTRY,0,150,210,0,0); //--- Create the entry button
   obj_Btn_ENTRY.Size(70,25); //--- Set the button size
   obj_Btn_ENTRY.ColorBackground(clrGoldenrod); //--- Set the background color
   obj_Btn_ENTRY.ColorBorder(clrGoldenrod); //--- Set the border color
   obj_Btn_ENTRY.Text("Entry"); //--- Set the button text
   obj_Btn_ENTRY.Color(clrBlack); //--- Set the text color
   obj_Btn_ENTRY.Font("Calibri bold"); //--- Set the font style
   obj_Btn_ENTRY.FontSize(14); //--- Set the font size
   
   //--- BUY BUTTON
   obj_Btn_BUY.Create(0,Btn_BUY,0,40+190,210,0,0); //--- Create the buy button
   obj_Btn_BUY.Size(100,25); //--- Set the button size
   obj_Btn_BUY.ColorBackground(clrLimeGreen); //--- Set the background color
   obj_Btn_BUY.ColorBorder(clrLimeGreen); //--- Set the border color
   obj_Btn_BUY.Text("Buy"); //--- Set the button text
   obj_Btn_BUY.Color(clrWhite); //--- Set the text color
   obj_Btn_BUY.Font("Calibri bold"); //--- Set the font style
   obj_Btn_BUY.FontSize(14); //--- Set the font size
   
   //--- SELL STOP BUTTON
   obj_Btn_SELLSTOP.Create(0,Btn_SELLSTOP,0,40,240,0,0); //--- Create the sell stop button
   obj_Btn_SELLSTOP.Size(140,25); //--- Set the button size
   obj_Btn_SELLSTOP.ColorBackground(clrOrangeRed); //--- Set the background color
   obj_Btn_SELLSTOP.ColorBorder(clrOrangeRed); //--- Set the border color
   obj_Btn_SELLSTOP.Text("Sell Stop"); //--- Set the button text
   obj_Btn_SELLSTOP.Color(clrWhite); //--- Set the text color
   obj_Btn_SELLSTOP.Font("Calibri bold"); //--- Set the font style
   obj_Btn_SELLSTOP.FontSize(14); //--- Set the font size
   
   //--- BUY STOP BUTTON
   obj_Btn_BUYSTOP.Create(0,Btn_BUYSTOP,0,40+190-40,240,0,0); //--- Create the buy stop button
   obj_Btn_BUYSTOP.Size(140,25); //--- Set the button size
   obj_Btn_BUYSTOP.ColorBackground(clrLimeGreen); //--- Set the background color
   obj_Btn_BUYSTOP.ColorBorder(clrLimeGreen); //--- Set the border color
   obj_Btn_BUYSTOP.Text("Buy Stop"); //--- Set the button text
   obj_Btn_BUYSTOP.Color(clrWhite); //--- Set the text color
   obj_Btn_BUYSTOP.Font("Calibri bold"); //--- Set the font style
   obj_Btn_BUYSTOP.FontSize(14); //--- Set the font size
   
   //--- SELL LIMIT BUTTON
   obj_Btn_SELLLIMIT.Create(0,Btn_SELLLIMIT,0,40,270,0,0); //--- Create the sell limit button
   obj_Btn_SELLLIMIT.Size(140,25); //--- Set the button size
   obj_Btn_SELLLIMIT.ColorBackground(clrOrangeRed); //--- Set the background color
   obj_Btn_SELLLIMIT.ColorBorder(clrOrangeRed); //--- Set the border color
   obj_Btn_SELLLIMIT.Text("Sell Limit"); //--- Set the button text
   obj_Btn_SELLLIMIT.Color(clrWhite); //--- Set the text color
   obj_Btn_SELLLIMIT.Font("Calibri bold"); //--- Set the font style
   obj_Btn_SELLLIMIT.FontSize(14); //--- Set the font size
   
   //--- BUY LIMIT BUTTON
   obj_Btn_BUYLIMIT.Create(0,Btn_BUYLIMIT,0,40+190-40,270,0,0); //--- Create the buy limit button
   obj_Btn_BUYLIMIT.Size(140,25); //--- Set the button size
   obj_Btn_BUYLIMIT.ColorBackground(clrLimeGreen); //--- Set the background color
   obj_Btn_BUYLIMIT.ColorBorder(clrLimeGreen); //--- Set the border color
   obj_Btn_BUYLIMIT.Text("Buy Limit"); //--- Set the button text
   obj_Btn_BUYLIMIT.Color(clrWhite); //--- Set the text color
   obj_Btn_BUYLIMIT.Font("Calibri bold"); //--- Set the font style
   obj_Btn_BUYLIMIT.FontSize(14); //--- Set the font size
}

После компиляции мы получаем следующий результат.

Окончательное тело раздела Trade

Всё получилось. Теперь у нас есть приятный на вид торговый интерфейс. Перейдем к другим разделам навигации. Сначала мы создадим интерфейс для закрытия и организуем его логику в функции. Однако перед определением утилит функций нам необходимо определить соответствующие имена кнопок вместе с объявлениями их объектов. Логика объявления объектов.

CButton obj_Btn_CLOSE_ALL;                                  //--- Close All button object
CButton obj_Btn_CLOSE_ALL_SELL;                             //--- Close All Sell button object
CButton obj_Btn_CLOSE_ALL_BUY;                              //--- Close All Buy button object
CButton obj_Btn_CLOSE_LOSS_SELL;                            //--- Close Loss Sell button object
CButton obj_Btn_CLOSE_LOSS_BUY;                             //--- Close Loss Buy button object
CButton obj_Btn_CLOSE_PROFIT_SELL;                          //--- Close Profit Sell button object
CButton obj_Btn_CLOSE_PROFIT_BUY;                           //--- Close Profit Buy button object
CButton obj_Btn_CLOSE_ALL_LOSS;                             //--- Close All Loss button object
CButton obj_Btn_CLOSE_ALL_PROFIT;                           //--- Close All Profit button object
CButton obj_Btn_CLOSE_PENDING;                              //--- Close Pending button object

//--- 

CButton obj_Btn_ACC_NUMBER;                                 //--- Account Number button object
CButton obj_Btn_ACC_NAME;                                   //--- Account Name button object
CButton obj_Btn_ACC_TYPE;                                   //--- Account Type button object
CButton obj_Btn_ACC_LEVERAGE;                               //--- Account Leverage button object

CButton obj_Btn_ACC_EQUITY;                                 //--- Account Equity button object
CButton obj_Btn_ACC_BALANCE;                                //--- Account Balance button object
CButton obj_Btn_TIME;                                       //--- Time button object


//---
CLabel obj_Lbl_ACC_NUMBER;                                  //--- Account Number label object
CLabel obj_Lbl_ACC_NAME;                                    //--- Account Name label object
CLabel obj_Lbl_ACC_TYPE;                                    //--- Account Type label object
CLabel obj_Lbl_ACC_LEVERAGE;                                //--- Account Leverage label object

CLabel obj_Lbl_ACC_EQUITY;                                  //--- Account Equity label object
CLabel obj_Lbl_ACC_BALANCE;                                 //--- Account Balance label object
CLabel obj_Lbl_TIME;                                        //--- Time label object

Логика определения объектов.

#define Btn_CLOSE_ALL "Btn_CLOSE_ALL"                        //--- Button name for closing all trades
#define Btn_CLOSE_ALL_SELL "Btn_CLOSE_ALL_SELL"              //--- Button name for closing all sell trades
#define Btn_CLOSE_ALL_BUY "Btn_CLOSE_ALL_BUY"                //--- Button name for closing all buy trades
#define Btn_CLOSE_LOSS_SELL "Btn_CLOSE_LOSS_SELL"            //--- Button name for closing all loss sell trades
#define Btn_CLOSE_LOSS_BUY "Btn_CLOSE_LOSS_BUY"              //--- Button name for closing all loss buy trades
#define Btn_CLOSE_PROFIT_SELL "Btn_CLOSE_PROFIT_SELL"        //--- Button name for closing all profit sell trades
#define Btn_CLOSE_PROFIT_BUY "Btn_CLOSE_PROFIT_BUY"          //--- Button name for closing all profit buy trades
#define Btn_CLOSE_ALL_LOSS "Btn_CLOSE_ALL_LOSS"              //--- Button name for closing all loss trades
#define Btn_CLOSE_ALL_PROFIT "Btn_CLOSE_ALL_PROFIT"          //--- Button name for closing all profit trades
#define Btn_CLOSE_PENDING "Btn_CLOSE_PENDING"                //--- Button name for closing all pending trades

#define Btn_ACC_NUMBER "Btn_ACC_NUMBER"                      //--- Button name for the account number
#define Btn_ACC_NAME "Btn_ACC_NAME"                          //--- Button name for the account name
#define Btn_ACC_TYPE "Btn_ACC_TYPE"                          //--- Button name for the account type
#define Btn_ACC_LEVERAGE "Btn_ACC_LEVERAGE"                  //--- Button name for the account leverage

#define Btn_ACC_EQUITY "Btn_ACC_EQUITY"                      //--- Button name for the account equity
#define Btn_ACC_BALANCE "Btn_ACC_BALANCE"                    //--- Button name for the account balance
#define Btn_TIME "Btn_TIME"                                  //--- Button name for the time

//---
#define Lbl_ACC_NUMBER "Lbl_ACC_NUMBER"                      //--- Label name for the account number
#define Lbl_ACC_NAME "Lbl_ACC_NAME"                          //--- Label name for the account name
#define Lbl_ACC_TYPE "Lbl_ACC_TYPE"                          //--- Label name for the account type
#define Lbl_ACC_LEVERAGE "Lbl_ACC_LEVERAGE"                  //--- Label name for the account leverage

#define Lbl_ACC_EQUITY "Lbl_ACC_EQUITY"                      //--- Label name for the account equity
#define Lbl_ACC_BALANCE "Lbl_ACC_BALANCE"                    //--- Label name for the account balance
#define Lbl_TIME "Lbl_TIME"                                  //--- Label name for the time

После определения всех необходимых параметров приступаем к созданию функции закрытия.

//+------------------------------------------------------------------+
//|      FUNCTION TO CREATE THE CLOSE SECTION                        |
//+------------------------------------------------------------------+
void createSection_Close(){
   //--- CLOSE ALL BUTTON
   obj_Btn_CLOSE_ALL.Create(0, Btn_CLOSE_ALL, 0, 80, 120, 0, 0); //--- Create the close all button
   obj_Btn_CLOSE_ALL.Size(210, 25); //--- Set the button size
   obj_Btn_CLOSE_ALL.ColorBackground(clrPeru); //--- Set the background color
   obj_Btn_CLOSE_ALL.ColorBorder(clrWhite); //--- Set the border color
   obj_Btn_CLOSE_ALL.Text("Close All"); //--- Set the button text
   obj_Btn_CLOSE_ALL.Color(clrBlack); //--- Set the text color
   obj_Btn_CLOSE_ALL.Font("Calibri bold"); //--- Set the font style
   obj_Btn_CLOSE_ALL.FontSize(14); //--- Set the font size
   
   //--- CLOSE ALL SELL BUTTON
   obj_Btn_CLOSE_ALL_SELL.Create(0, Btn_CLOSE_ALL_SELL, 0, 40, 150, 0, 0); //--- Create the close all sell button
   obj_Btn_CLOSE_ALL_SELL.Size(140, 25); //--- Set the button size
   obj_Btn_CLOSE_ALL_SELL.ColorBackground(clrSalmon); //--- Set the background color
   obj_Btn_CLOSE_ALL_SELL.ColorBorder(clrWhite); //--- Set the border color
   obj_Btn_CLOSE_ALL_SELL.Text("Close All Sell"); //--- Set the button text
   obj_Btn_CLOSE_ALL_SELL.Color(clrBlack); //--- Set the text color
   obj_Btn_CLOSE_ALL_SELL.Font("Calibri bold"); //--- Set the font style
   obj_Btn_CLOSE_ALL_SELL.FontSize(14); //--- Set the font size
   
   //--- CLOSE ALL BUY BUTTON
   obj_Btn_CLOSE_ALL_BUY.Create(0, Btn_CLOSE_ALL_BUY, 0, 190, 150, 0, 0); //--- Create the close all buy button
   obj_Btn_CLOSE_ALL_BUY.Size(140, 25); //--- Set the button size
   obj_Btn_CLOSE_ALL_BUY.ColorBackground(clrMediumSeaGreen); //--- Set the background color
   obj_Btn_CLOSE_ALL_BUY.ColorBorder(clrWhite); //--- Set the border color
   obj_Btn_CLOSE_ALL_BUY.Text("Close All Buy"); //--- Set the button text
   obj_Btn_CLOSE_ALL_BUY.Color(clrBlack); //--- Set the text color
   obj_Btn_CLOSE_ALL_BUY.Font("Calibri bold"); //--- Set the font style
   obj_Btn_CLOSE_ALL_BUY.FontSize(14); //--- Set the font size
   
   //--- CLOSE LOSS SELL BUTTON
   obj_Btn_CLOSE_LOSS_SELL.Create(0, Btn_CLOSE_LOSS_SELL, 0, 40, 180, 0, 0); //--- Create the close loss sell button
   obj_Btn_CLOSE_LOSS_SELL.Size(140, 25); //--- Set the button size
   obj_Btn_CLOSE_LOSS_SELL.ColorBackground(clrSalmon); //--- Set the background color
   obj_Btn_CLOSE_LOSS_SELL.ColorBorder(clrWhite); //--- Set the border color
   obj_Btn_CLOSE_LOSS_SELL.Text("Close Loss Sell"); //--- Set the button text
   obj_Btn_CLOSE_LOSS_SELL.Color(clrBlack); //--- Set the text color
   obj_Btn_CLOSE_LOSS_SELL.Font("Calibri bold"); //--- Set the font style
   obj_Btn_CLOSE_LOSS_SELL.FontSize(14); //--- Set the font size
   
   //--- CLOSE LOSS BUY BUTTON
   obj_Btn_CLOSE_LOSS_BUY.Create(0, Btn_CLOSE_LOSS_BUY, 0, 190, 180, 0, 0); //--- Create the close loss buy button
   obj_Btn_CLOSE_LOSS_BUY.Size(140, 25); //--- Set the button size
   obj_Btn_CLOSE_LOSS_BUY.ColorBackground(clrMediumSeaGreen); //--- Set the background color
   obj_Btn_CLOSE_LOSS_BUY.ColorBorder(clrWhite); //--- Set the border color
   obj_Btn_CLOSE_LOSS_BUY.Text("Close Loss Buy"); //--- Set the button text
   obj_Btn_CLOSE_LOSS_BUY.Color(clrBlack); //--- Set the text color
   obj_Btn_CLOSE_LOSS_BUY.Font("Calibri bold"); //--- Set the font style
   obj_Btn_CLOSE_LOSS_BUY.FontSize(14); //--- Set the font size
   
   //--- CLOSE PROFIT SELL BUTTON
   obj_Btn_CLOSE_PROFIT_SELL.Create(0, Btn_CLOSE_PROFIT_SELL, 0, 40, 210, 0, 0); //--- Create the close profit sell button
   obj_Btn_CLOSE_PROFIT_SELL.Size(140, 25); //--- Set the button size
   obj_Btn_CLOSE_PROFIT_SELL.ColorBackground(clrSalmon); //--- Set the background color
   obj_Btn_CLOSE_PROFIT_SELL.ColorBorder(clrWhite); //--- Set the border color
   obj_Btn_CLOSE_PROFIT_SELL.Text("Close Profit Sell"); //--- Set the button text
   obj_Btn_CLOSE_PROFIT_SELL.Color(clrBlack); //--- Set the text color
   obj_Btn_CLOSE_PROFIT_SELL.Font("Calibri bold"); //--- Set the font style
   obj_Btn_CLOSE_PROFIT_SELL.FontSize(14); //--- Set the font size
   
   //--- CLOSE PROFIT BUY BUTTON
   obj_Btn_CLOSE_PROFIT_BUY.Create(0, Btn_CLOSE_PROFIT_BUY, 0, 190, 210, 0, 0); //--- Create the close profit buy button
   obj_Btn_CLOSE_PROFIT_BUY.Size(140, 25); //--- Set the button size
   obj_Btn_CLOSE_PROFIT_BUY.ColorBackground(clrMediumSeaGreen); //--- Set the background color
   obj_Btn_CLOSE_PROFIT_BUY.ColorBorder(clrWhite); //--- Set the border color
   obj_Btn_CLOSE_PROFIT_BUY.Text("Close Profit Buy"); //--- Set the button text
   obj_Btn_CLOSE_PROFIT_BUY.Color(clrBlack); //--- Set the text color
   obj_Btn_CLOSE_PROFIT_BUY.Font("Calibri bold"); //--- Set the font style
   obj_Btn_CLOSE_PROFIT_BUY.FontSize(14); //--- Set the font size
   
   //--- CLOSE ALL LOSS BUTTON
   obj_Btn_CLOSE_ALL_LOSS.Create(0, Btn_CLOSE_ALL_LOSS, 0, 40, 240, 0, 0); //--- Create the close all loss button
   obj_Btn_CLOSE_ALL_LOSS.Size(140, 25); //--- Set the button size
   obj_Btn_CLOSE_ALL_LOSS.ColorBackground(clrSalmon); //--- Set the background color
   obj_Btn_CLOSE_ALL_LOSS.ColorBorder(clrWhite); //--- Set the border color
   obj_Btn_CLOSE_ALL_LOSS.Text("CLOSE LOSS"); //--- Set the button text
   obj_Btn_CLOSE_ALL_LOSS.Color(clrBlack); //--- Set the text color
   obj_Btn_CLOSE_ALL_LOSS.Font("Calibri bold"); //--- Set the font style
   obj_Btn_CLOSE_ALL_LOSS.FontSize(14); //--- Set the font size
   
   //--- CLOSE ALL PROFIT BUTTON
   obj_Btn_CLOSE_ALL_PROFIT.Create(0, Btn_CLOSE_ALL_PROFIT, 0, 190, 240, 0, 0); //--- Create the close all profit button
   obj_Btn_CLOSE_ALL_PROFIT.Size(140, 25); //--- Set the button size
   obj_Btn_CLOSE_ALL_PROFIT.ColorBackground(clrMediumSeaGreen); //--- Set the background color
   obj_Btn_CLOSE_ALL_PROFIT.ColorBorder(clrWhite); //--- Set the border color
   obj_Btn_CLOSE_ALL_PROFIT.Text("CLOSE PROFIT"); //--- Set the button text
   obj_Btn_CLOSE_ALL_PROFIT.Color(clrBlack); //--- Set the text color
   obj_Btn_CLOSE_ALL_PROFIT.Font("Calibri bold"); //--- Set the font style
   obj_Btn_CLOSE_ALL_PROFIT.FontSize(14); //--- Set the font size
   
   //--- CLOSE ALL PENDING BUTTON
   obj_Btn_CLOSE_PENDING.Create(0, Btn_CLOSE_PENDING, 0, 80, 270, 0, 0); //--- Create the close all pending button
   obj_Btn_CLOSE_PENDING.Size(210, 25); //--- Set the button size
   obj_Btn_CLOSE_PENDING.ColorBackground(clrPeru); //--- Set the background color
   obj_Btn_CLOSE_PENDING.ColorBorder(clrWhite); //--- Set the border color
   obj_Btn_CLOSE_PENDING.Text("Close All Pending"); //--- Set the button text
   obj_Btn_CLOSE_PENDING.Color(clrBlack); //--- Set the text color
   obj_Btn_CLOSE_PENDING.Font("Calibri bold"); //--- Set the font style
   obj_Btn_CLOSE_PENDING.FontSize(14); //--- Set the font size
}

В обработчике событий инициализации мы можем закомментировать логику вызова функции для раздела торговли и взаимодействовать с разделом закрытия через вызов функции. Мы достигаем этого, комментируя функцию, а не удаляя ее, поскольку позже нам придется использовать ее повторно.

   // BODY OF THE PANEL
   //createSection_Trade(); //--- Call function to create the trade section
   createSection_Close(); //--- Call function to create the close section

После запуска программы мы получим следующий результат.

Раздел закрытия

Всё работает как надо. Теперь мы можем приступить к созданию последнего раздела, в котором будет отображаться информация по торговому счету. Для этого мы также используем функцию. 

//+------------------------------------------------------------------+
//|        FUNCTION TO CREATE THE INFO SECTION                       |
//+------------------------------------------------------------------+
void createSection_Information() {
   //--- Create Account Number Label
   obj_Lbl_ACC_NUMBER.Create(0, Lbl_ACC_NUMBER, 0, 40, 100, 0, 0); //--- Initialize label for Account Number
   obj_Lbl_ACC_NUMBER.Text("Account Number"); //--- Set label text to "Account Number"
   obj_Lbl_ACC_NUMBER.Color(clrWhite); //--- Set label color to white
   obj_Lbl_ACC_NUMBER.Font("Calibri bold"); //--- Set label font to Calibri bold
   obj_Lbl_ACC_NUMBER.FontSize(14); //--- Set label font size to 14

   //--- Create Account Number Button
   obj_Btn_ACC_NUMBER.Create(0, Btn_ACC_NUMBER, 0, 40 + 140, 100 + 2, 0, 0); //--- Initialize button for Account Number
   obj_Btn_ACC_NUMBER.Size(150, 20); //--- Set button size to 150x20
   obj_Btn_ACC_NUMBER.ColorBackground(clrGainsboro); //--- Set button background color to Gainsboro
   obj_Btn_ACC_NUMBER.ColorBorder(clrWhite); //--- Set button border color to white
   obj_Btn_ACC_NUMBER.Text(IntegerToString(AccountInfoInteger(ACCOUNT_LOGIN))); //--- Set button text with account number
   obj_Btn_ACC_NUMBER.Color(clrBlack); //--- Set button text color to black
   obj_Btn_ACC_NUMBER.Font("Calibri bold"); //--- Set button font to Calibri bold
   obj_Btn_ACC_NUMBER.FontSize(13); //--- Set button font size to 13

}

Мы снова используем аналогичный формат при создании информационного раздела. Однако при наборе текста мы используем некоторые дополнительные функции, суть которых хотелось бы пояснить. Для большей наглядности строка выделена желтым цветом. Мы используем комбинацию функций AccountInfoInteger и IntegerToString для установки текста кнопки obj_Btn_ACC_NUMBER, отображающей номера счета.

Мы используем функцию AccountInfoInteger для получения информации о счете на основе заданного параметра. В данном случае параметром является ACCOUNT_LOGIN, который сообщает функции о необходимости получить номер логина счета из терминала MetaTrader. Этот номер возвращается как целочисленное значение.

Далее применяется функция IntegerToString для преобразования этого целочисленного значения в строку. Это необходимо, поскольку метод Text кнопки требует, чтобы значение было в строковом формате для правильного отображения. Без этого преобразования кнопка не сможет правильно отобразить номер счета. Аналогично задаем кнопки имени и типа счета.

   //--- Create Account Name Label
   obj_Lbl_ACC_NAME.Create(0, Lbl_ACC_NAME, 0, 40, 125, 0, 0); //--- Initialize label for Account Name
   obj_Lbl_ACC_NAME.Text("Account Name"); //--- Set label text to "Account Name"
   obj_Lbl_ACC_NAME.Color(clrWhite); //--- Set label color to white
   obj_Lbl_ACC_NAME.Font("Calibri bold"); //--- Set label font to Calibri bold
   obj_Lbl_ACC_NAME.FontSize(14); //--- Set label font size to 14

   //--- Create Account Name Button
   obj_Btn_ACC_NAME.Create(0, Btn_ACC_NAME, 0, 40 + 120, 125 + 2, 0, 0); //--- Initialize button for Account Name
   obj_Btn_ACC_NAME.Size(170, 20); //--- Set button size to 170x20
   obj_Btn_ACC_NAME.ColorBackground(clrGainsboro); //--- Set button background color to Gainsboro
   obj_Btn_ACC_NAME.ColorBorder(clrWhite); //--- Set button border color to white
   obj_Btn_ACC_NAME.Text(AccountInfoString(ACCOUNT_SERVER)); //--- Set button text with account server name
   obj_Btn_ACC_NAME.Color(clrBlack); //--- Set button text color to black
   obj_Btn_ACC_NAME.Font("Calibri bold"); //--- Set button font to Calibri bold
   obj_Btn_ACC_NAME.FontSize(13); //--- Set button font size to 13

   //--- Create Account Type Label
   obj_Lbl_ACC_TYPE.Create(0, Lbl_ACC_TYPE, 0, 40, 150, 0, 0); //--- Initialize label for Account Type
   obj_Lbl_ACC_TYPE.Text("Account Type"); //--- Set label text to "Account Type"
   obj_Lbl_ACC_TYPE.Color(clrWhite); //--- Set label color to white
   obj_Lbl_ACC_TYPE.Font("Calibri bold"); //--- Set label font to Calibri bold
   obj_Lbl_ACC_TYPE.FontSize(14); //--- Set label font size to 14

   //--- Create Account Type Button
   obj_Btn_ACC_TYPE.Create(0, Btn_ACC_TYPE, 0, 40 + 110, 150 + 2, 0, 0); //--- Initialize button for Account Type
   obj_Btn_ACC_TYPE.Size(180, 20); //--- Set button size to 180x20
   obj_Btn_ACC_TYPE.ColorBackground(clrGainsboro); //--- Set button background color to Gainsboro
   obj_Btn_ACC_TYPE.ColorBorder(clrWhite); //--- Set button border color to white
   ENUM_ACCOUNT_TRADE_MODE account_type = (ENUM_ACCOUNT_TRADE_MODE)AccountInfoInteger(ACCOUNT_TRADE_MODE); //--- Retrieve account type
   string trade_mode; //--- Initialize variable for trade mode description
   switch (account_type) { //--- Determine account type
      case ACCOUNT_TRADE_MODE_DEMO: trade_mode = "Demo Account"; break; //--- Set trade_mode for Demo account
      case ACCOUNT_TRADE_MODE_CONTEST: trade_mode = "Contest Account"; break; //--- Set trade_mode for Contest account
      default: trade_mode = "Real Account"; break; //--- Set trade_mode for Real account
   }
   obj_Btn_ACC_TYPE.Text(trade_mode); //--- Set button text to account type description
   obj_Btn_ACC_TYPE.Color(clrBlack); //--- Set button text color to black
   obj_Btn_ACC_TYPE.Font("Calibri bold"); //--- Set button font to Calibri bold
   obj_Btn_ACC_TYPE.FontSize(13); //--- Set button font size to 13

Здесь мы задаем кнопки имени и типа счета. Однако мы используем более сложную логику для получения типа учетной записи, поскольку прямого метода его получения не существует. Логика снова выделена желтым цветом для большей выразительности. Начнем с определения переменной account_type типа перечисления ENUM_ACCOUNT_TRADE_MODE. Это перечислимый тип данных, специально разработанный для хранения различных режимов торговли, таких как Demo, Contest или Real. Мы присваиваем ему значение с помощью функции AccountInfoInteger с параметром ACCOUNT_TRADE_MODE. Эта функция извлекает текущий торговый режим счета в виде перечислимого целого числа.

Далее мы объявляем строковую переменную trade_mode для хранения описательной метки на основе типа счета. Затем мы используем оператор switch для определения типа счета путем проверки значения account_type. Оператор switch предлагает три варианта:

  • ACCOUNT_TRADE_MODE_DEMO - если это демо-счет, trade_mode устанавливается на Demo Account.
  • ACCOUNT_TRADE_MODE_CONTEST - если это конкурсный счет, trade_mode устанавливается на Contest Account.
  • Вариант по умолчанию - для любого другого типа (обычно реального счета) trade_mode устанавливается на Real Account.

Наконец, мы вызываем метод Text для кнопки obj_Btn_ACC_TYPE и передаем строку trade_mode. Это обновит текст кнопки, чтобы отобразить тип счета. Остальной служебный функционал определяется аналогично.

   //--- Create Account Leverage Label
   obj_Lbl_ACC_LEVERAGE.Create(0, Lbl_ACC_LEVERAGE, 0, 40, 175, 0, 0); //--- Initialize label for Account Leverage
   obj_Lbl_ACC_LEVERAGE.Text("Account Leverage"); //--- Set label text to "Account Leverage"
   obj_Lbl_ACC_LEVERAGE.Color(clrWhite); //--- Set label color to white
   obj_Lbl_ACC_LEVERAGE.Font("Calibri bold"); //--- Set label font to Calibri bold
   obj_Lbl_ACC_LEVERAGE.FontSize(14); //--- Set label font size to 14

   //--- Create Account Leverage Button
   obj_Btn_ACC_LEVERAGE.Create(0, Btn_ACC_LEVERAGE, 0, 40 + 150, 175 + 2, 0, 0); //--- Initialize button for Account Leverage
   obj_Btn_ACC_LEVERAGE.Size(140, 20); //--- Set button size to 140x20
   obj_Btn_ACC_LEVERAGE.ColorBackground(clrGainsboro); //--- Set button background color to Gainsboro
   obj_Btn_ACC_LEVERAGE.ColorBorder(clrWhite); //--- Set button border color to white
   obj_Btn_ACC_LEVERAGE.Text(IntegerToString(AccountInfoInteger(ACCOUNT_LEVERAGE))); //--- Set button text with account leverage
   obj_Btn_ACC_LEVERAGE.Color(clrBlack); //--- Set button text color to black
   obj_Btn_ACC_LEVERAGE.Font("Calibri bold"); //--- Set button font to Calibri bold
   obj_Btn_ACC_LEVERAGE.FontSize(13); //--- Set button font size to 13

   //--- Create Account Equity Label
   obj_Lbl_ACC_EQUITY.Create(0, Lbl_ACC_EQUITY, 0, 40, 220, 0, 0); //--- Initialize label for Account Equity
   obj_Lbl_ACC_EQUITY.Text("Account Equity"); //--- Set label text to "Account Equity"
   obj_Lbl_ACC_EQUITY.Color(clrAqua); //--- Set label color to Aqua
   obj_Lbl_ACC_EQUITY.Font("Cooper Black"); //--- Set label font to Cooper Black
   obj_Lbl_ACC_EQUITY.FontSize(14); //--- Set label font size to 14

   //--- Create Account Equity Button
   obj_Btn_ACC_EQUITY.Create(0, Btn_ACC_EQUITY, 0, 40 + 170, 220 + 2, 0, 0); //--- Initialize button for Account Equity
   obj_Btn_ACC_EQUITY.Size(120, 20); //--- Set button size to 120x20
   obj_Btn_ACC_EQUITY.ColorBackground(clrBlack); //--- Set button background color to black
   obj_Btn_ACC_EQUITY.ColorBorder(clrBlanchedAlmond); //--- Set button border color to Blanched Almond
   obj_Btn_ACC_EQUITY.Text(DoubleToString(AccountInfoDouble(ACCOUNT_EQUITY), 2)); //--- Set button text with account equity
   obj_Btn_ACC_EQUITY.Color(clrWhite); //--- Set button text color to white
   obj_Btn_ACC_EQUITY.Font("Times new roman bold"); //--- Set button font to Times New Roman bold
   obj_Btn_ACC_EQUITY.FontSize(13); //--- Set button font size to 13

   //--- Create Account Balance Label
   obj_Lbl_ACC_BALANCE.Create(0, Lbl_ACC_BALANCE, 0, 40, 245, 0, 0); //--- Initialize label for Account Balance
   obj_Lbl_ACC_BALANCE.Text("Account Balance"); //--- Set label text to "Account Balance"
   obj_Lbl_ACC_BALANCE.Color(clrAqua); //--- Set label color to Aqua
   obj_Lbl_ACC_BALANCE.Font("Cooper Black"); //--- Set label font to Cooper Black
   obj_Lbl_ACC_BALANCE.FontSize(14); //--- Set label font size to 14

   //--- Create Account Balance Button
   obj_Btn_ACC_BALANCE.Create(0, Btn_ACC_BALANCE, 0, 40 + 170, 245 + 2, 0, 0); //--- Initialize button for Account Balance
   obj_Btn_ACC_BALANCE.Size(120, 20); //--- Set button size to 120x20
   obj_Btn_ACC_BALANCE.ColorBackground(clrBlack); //--- Set button background color to black
   obj_Btn_ACC_BALANCE.ColorBorder(clrBlanchedAlmond); //--- Set button border color to Blanched Almond
   obj_Btn_ACC_BALANCE.Text(DoubleToString(AccountInfoDouble(ACCOUNT_BALANCE), 2)); //--- Set button text with account balance
   obj_Btn_ACC_BALANCE.Color(clrWhite); //--- Set button text color to white
   obj_Btn_ACC_BALANCE.Font("Times new roman bold"); //--- Set button font to Times New Roman bold
   obj_Btn_ACC_BALANCE.FontSize(13); //--- Set button font size to 13

   //--- Create Server Time Label
   obj_Lbl_TIME.Create(0, Lbl_TIME, 0, 40, 270, 0, 0); //--- Initialize label for Server Time
   obj_Lbl_TIME.Text("Server Time"); //--- Set label text to "Server Time"
   obj_Lbl_TIME.Color(clrLime); //--- Set label color to Lime
   obj_Lbl_TIME.Font("Cooper Black"); //--- Set label font to Cooper Black
   obj_Lbl_TIME.FontSize(14); //--- Set label font size to 14

   //--- Create Server Time Button
   obj_Btn_TIME.Create(0, Btn_TIME, 0, 40 + 120, 270 + 2, 0, 0); //--- Initialize button for Server Time
   obj_Btn_TIME.Size(170, 20); //--- Set button size to 170x20
   obj_Btn_TIME.ColorBackground(clrBlack); //--- Set button background color to black
   obj_Btn_TIME.ColorBorder(clrBlanchedAlmond); //--- Set button border color to Blanched Almond
   obj_Btn_TIME.Text(TimeToString(TimeTradeServer(), TIME_DATE | TIME_SECONDS)); //--- Set button text with server time
   obj_Btn_TIME.Color(clrWhite); //--- Set button text color to white
   obj_Btn_TIME.Font("Times new roman bold"); //--- Set button font to Times New Roman bold
   obj_Btn_TIME.FontSize(13); //--- Set button font size to 13

Чтобы проверить эффект изменений, нам потребуется вызвать функцию на этапе инициализации и закомментировать другие вызовы функций навигации. Это показано ниже.

   // BODY OF THE PANEL
   //createSection_Trade(); //--- Call function to create the trade section
   //createSection_Close(); //--- Call function to create the close section
   createSection_Information(); //--- Call function to create the information section

После компиляции и запуска программы мы получаем следующий результат.

Раздел информации

Теперь у нас есть полный комплект компонентов панели управления. Теперь мы можем вернуться к исходному интерфейсу для торговых операций, поскольку именно его кнопка активна. Мы закомментируем функции разделов закрытия и информации. Их соответствующие поля просмотра понадобятся нам позже. Таким образом, окончательный код инициализации, отвечающий за создание интерфейса панели, выглядит так:

//+------------------------------------------------------------------+
//| Expert initialization function                                   |
//+------------------------------------------------------------------+
int OnInit() {
   //--- Start of the initialization function

   //--- MAIN BUTTON
   obj_Btn_MAIN.Create(0, Btn_MAIN, 0, 30, 30, 0, 0); //--- Create the main button at specified coordinates
   //obj_Btn_MAIN.Width(310); //--- (Commented out) Set width of the main button
   //obj_Btn_MAIN.Height(300); //--- (Commented out) Set height of the main button
   obj_Btn_MAIN.Size(310, 300); //--- Set size of the main button
   obj_Btn_MAIN.ColorBackground(C'070,070,070'); //--- Set background color of the main button
   obj_Btn_MAIN.ColorBorder(clrBlack); //--- Set border color of the main button

   //--- HEADER BUTTON 
   obj_Btn_HEADER.Create(0, Btn_HEADER, 0, 30, 30, 0, 0); //--- Create the header button at specified coordinates
   obj_Btn_HEADER.Size(310, 25); //--- Set size of the header button
   obj_Btn_HEADER.ColorBackground(clrLightBlue); //--- Set background color of the header button
   obj_Btn_HEADER.ColorBorder(clrBlack); //--- Set border color of the header button

   //--- X BUTTON
   obj_Btn_X.Create(0, Btn_X, 0, 30 + 280, 30 + 1, 0, 0); //--- Create the close button (X) at specified coordinates
   obj_Btn_X.Size(30 - 1, 25 - 1 - 1); //--- Set size of the close button
   obj_Btn_X.ColorBackground(clrLightBlue); //--- Set background color of the close button
   obj_Btn_X.ColorBorder(clrLightBlue); //--- Set border color of the close button
   obj_Btn_X.Text(CharToString(255)); //--- Set the close button text to an "X" character
   obj_Btn_X.Color(clrBlack); //--- Set text color of the close button
   obj_Btn_X.Font("Wingdings"); //--- Set font of the close button to Wingdings
   obj_Btn_X.FontSize(17); //--- Set font size of the close button

   //--- HEADER LABEL
   obj_Lbl_HEADER.Create(0, Lbl_HEADER, 0, 40, 30, 0, 0); //--- Create the header label at specified coordinates
   obj_Lbl_HEADER.Text("Control Panel"); //--- Set text of the header label
   obj_Lbl_HEADER.Color(clrRed); //--- Set text color of the header label
   obj_Lbl_HEADER.Font("Cooper black"); //--- Set font of the header label to Cooper Black
   obj_Lbl_HEADER.FontSize(14); //--- Set font size of the header label
   
   //--- TRADE BUTTON
   obj_Btn_TRADE.Create(0, Btn_TRADE, 0, 40, 60, 0, 0); //--- Create the trade button at specified coordinates
   obj_Btn_TRADE.Size(90, 30); //--- Set size of the trade button
   obj_Btn_TRADE.ColorBackground(clrYellow); //--- Set background color of the trade button
   obj_Btn_TRADE.ColorBorder(clrYellow); //--- Set border color of the trade button
   obj_Btn_TRADE.Text("Trade"); //--- Set text of the trade button
   obj_Btn_TRADE.Color(clrBlack); //--- Set text color of the trade button
   obj_Btn_TRADE.Font("Arial Black"); //--- Set font of the trade button to Arial Black
   obj_Btn_TRADE.FontSize(13); //--- Set font size of the trade button
   
   //--- CLOSE BUTTON
   obj_Btn_CLOSE.Create(0, Btn_CLOSE, 0, 40 + obj_Btn_TRADE.Width() + 10, 60, 0, 0); //--- Create the close button at specified coordinates
   obj_Btn_CLOSE.Size(90, 30); //--- Set size of the close button
   obj_Btn_CLOSE.ColorBackground(clrSilver); //--- Set background color of the close button
   obj_Btn_CLOSE.ColorBorder(clrSilver); //--- Set border color of the close button
   obj_Btn_CLOSE.Text("Close"); //--- Set text of the close button
   obj_Btn_CLOSE.Color(clrBlack); //--- Set text color of the close button
   obj_Btn_CLOSE.Font("Arial Black"); //--- Set font of the close button to Arial Black
   obj_Btn_CLOSE.FontSize(13); //--- Set font size of the close button

   //--- INFO BUTTON
   obj_Btn_INFO.Create(0, Btn_INFO, 0, 40 + obj_Btn_TRADE.Width() + 10 + obj_Btn_CLOSE.Width() + 10, 60, 0, 0); //--- Create the info button at specified coordinates
   obj_Btn_INFO.Size(90, 30); //--- Set size of the info button
   obj_Btn_INFO.ColorBackground(clrSilver); //--- Set background color of the info button
   obj_Btn_INFO.ColorBorder(clrSilver); //--- Set border color of the info button
   obj_Btn_INFO.Text("Inform'n"); //--- Set text of the info button
   obj_Btn_INFO.Color(clrBlack); //--- Set text color of the info button
   obj_Btn_INFO.Font("Arial Black"); //--- Set font of the info button to Arial Black
   obj_Btn_INFO.FontSize(13); //--- Set font size of the info button
   
   // BODY OF THE PANEL
   createSection_Trade(); //--- Call function to create the trade section
   //createSection_Close(); //--- (Commented out) Call function to create the close section
   //createSection_Information(); //--- (Commented out) Call function to create the information section

   //--- FOOTER BUTTON
   obj_Btn_FOOTER.Create(0, Btn_FOOTER, 0, 30 + 1, 305 - 1, 0, 0); //--- Create the footer button at specified coordinates
   obj_Btn_FOOTER.Size(310 - 1 - 1, 25); //--- Set size of the footer button
   obj_Btn_FOOTER.ColorBackground(C'070,070,070'); //--- Set background color of the footer button
   obj_Btn_FOOTER.ColorBorder(C'070,070,070'); //--- Set border color of the footer button
   obj_Btn_FOOTER.Text(ShortToString(0x23F0) + "https://t.me/Forex_Algo_Trader"); //--- Set text of the footer button with a link
   obj_Btn_FOOTER.Color(clrWhite); //--- Set text color of the footer button
   obj_Btn_FOOTER.Font("Calibri bold italic"); //--- Set font of the footer button to Calibri bold italic
   obj_Btn_FOOTER.FontSize(12); //--- Set font size of the footer button

   ChartRedraw(0); //--- Redraw the chart to update the panel

   //--- End of initialization function
   return(INIT_SUCCEEDED); //--- Return initialization success status
}

Окончательный результат на текущем этапе:

Окончательный вид панели на текущем этапе

Хотя мы создали необходимые компоненты, нам необходимо избавиться от каждого созданного нами компонента, как только мы удалим программу с графика. Лучший способ добиться этого — создать функции для каждого созданного нами раздела, чтобы их можно было использовать для одновременного удаления разделов и повторного использования. В конце концов, нам нужна организованность. Если сравнивать процесс со сносом здания, то имеет смысл сначала снять облицовку, затем перегородки, затем верхние этажи, а потом - фундамент. Конечно, можно начать с любой части, но лучше действовать максимально последовательно. Думаю, вы согласны. Вот наши функции:

//--- Function to destroy main panel objects
void destroySection_Main_Panel() {
   obj_Btn_MAIN.Destroy(); //--- Destroy the main button
   obj_Btn_HEADER.Destroy(); //--- Destroy the header button
   obj_Btn_X.Destroy(); //--- Destroy the close (X) button
   obj_Lbl_HEADER.Destroy(); //--- Destroy the header label
   obj_Btn_TRADE.Destroy(); //--- Destroy the trade section button
   obj_Btn_CLOSE.Destroy(); //--- Destroy the close section button
   obj_Btn_INFO.Destroy(); //--- Destroy the information section button
   obj_Btn_FOOTER.Destroy(); //--- Destroy the footer button
}

//--- Function to destroy trade section objects
void destroySection_Trade() {
   obj_Btn_RISK.Destroy(); //--- Destroy the risk button
   obj_Edit_RISK.Destroy(); //--- Destroy the risk input field
   obj_Lbl_PRICE.Destroy(); //--- Destroy the price label
   obj_Edit_PRICE.Destroy(); //--- Destroy the price input field
   obj_Lbl_LOTS.Destroy(); //--- Destroy the lot size label
   obj_Edit_LOTS.Destroy(); //--- Destroy the lot size input field
   obj_Lbl_SL.Destroy(); //--- Destroy the stop loss label
   obj_Edit_SL.Destroy(); //--- Destroy the stop loss input field
   obj_Lbl_TP.Destroy(); //--- Destroy the take profit label
   obj_Edit_TP.Destroy(); //--- Destroy the take profit input field
   obj_Btn_POINTS.Destroy(); //--- Destroy the points button
   obj_Btn_SELL.Destroy(); //--- Destroy the sell button
   obj_Btn_ENTRY.Destroy(); //--- Destroy the entry button
   obj_Btn_BUY.Destroy(); //--- Destroy the buy button
   obj_Btn_SELLSTOP.Destroy(); //--- Destroy the sell stop button
   obj_Btn_BUYSTOP.Destroy(); //--- Destroy the buy stop button
   obj_Btn_SELLLIMIT.Destroy(); //--- Destroy the sell limit button
   obj_Btn_BUYLIMIT.Destroy(); //--- Destroy the buy limit button
}

//--- Function to destroy close section objects
void destroySection_Close() {
   obj_Btn_CLOSE_ALL.Destroy(); //--- Destroy the button to close all positions
   obj_Btn_CLOSE_ALL_SELL.Destroy(); //--- Destroy the button to close all sell positions
   obj_Btn_CLOSE_ALL_BUY.Destroy(); //--- Destroy the button to close all buy positions
   obj_Btn_CLOSE_LOSS_SELL.Destroy(); //--- Destroy the button to close losing sell positions
   obj_Btn_CLOSE_LOSS_BUY.Destroy(); //--- Destroy the button to close losing buy positions
   obj_Btn_CLOSE_PROFIT_SELL.Destroy(); //--- Destroy the button to close profitable sell positions
   obj_Btn_CLOSE_PROFIT_BUY.Destroy(); //--- Destroy the button to close profitable buy positions
   obj_Btn_CLOSE_ALL_LOSS.Destroy(); //--- Destroy the button to close all losing positions
   obj_Btn_CLOSE_ALL_PROFIT.Destroy(); //--- Destroy the button to close all profitable positions
   obj_Btn_CLOSE_PENDING.Destroy(); //--- Destroy the button to close pending orders
}

//--- Function to destroy information section objects
void destroySection_Information() {
   obj_Lbl_ACC_NUMBER.Destroy(); //--- Destroy the account number label
   obj_Btn_ACC_NUMBER.Destroy(); //--- Destroy the account number button
   obj_Lbl_ACC_NAME.Destroy(); //--- Destroy the account name label
   obj_Btn_ACC_NAME.Destroy(); //--- Destroy the account name button
   obj_Lbl_ACC_TYPE.Destroy(); //--- Destroy the account type label
   obj_Btn_ACC_TYPE.Destroy(); //--- Destroy the account type button
   obj_Lbl_ACC_LEVERAGE.Destroy(); //--- Destroy the account leverage label
   obj_Btn_ACC_LEVERAGE.Destroy(); //--- Destroy the account leverage button
   obj_Lbl_ACC_EQUITY.Destroy(); //--- Destroy the account equity label
   obj_Btn_ACC_EQUITY.Destroy(); //--- Destroy the account equity button
   obj_Lbl_ACC_BALANCE.Destroy(); //--- Destroy the account balance label
   obj_Btn_ACC_BALANCE.Destroy(); //--- Destroy the account balance button
   obj_Lbl_TIME.Destroy(); //--- Destroy the server time label
   obj_Btn_TIME.Destroy(); //--- Destroy the server time button
}

Здесь мы просто используем соответствующие объекты и вызываем метод Destroy, чтобы избавиться от определенных элементов. После этого мы вызываем функции на обработчике событий OnDeinit.

//+------------------------------------------------------------------+
//| Expert deinitialization function                                 |
//+------------------------------------------------------------------+
void OnDeinit(const int reason) {
   //--- Start of the deinitialization function

   destroySection_Main_Panel(); //--- Call function to destroy the main panel section
   destroySection_Trade(); //--- Call function to destroy the trade section
   destroySection_Close(); //--- Call function to destroy the close section
   destroySection_Information(); //--- Call function to destroy the information section
   
   ChartRedraw(0);
   
   //--- End of deinitialization function
}

Всё получилось. Мы создали нужную нам панель с необходимыми кнопками навигации и компонентами. Таким образом, цель первой части серии достигнута. Теперь нам нужно заставить кнопки реагировать на нажатия, а также автоматически обновлять их по мере необходимости. Займемся этим в следующих частях.


Заключение

В этой статье мы сосредоточились на настройке базовой структуры для создания интерактивной панели на MetaQuotes Language 5 (MQL5) с использованием класса Controls. Мы рассмотрели пошаговое создание основных компонентов, таких как кнопки, текстовые метки и поля редактирования, убедившись, что каждый элемент четко определен и визуально оформлен. Кроме того, мы показали, как настраивать текст, цвета и размеры, чтобы панель имела привлекательный и профессиональный вид. Благодаря такому структурированному подходу мы создали ядро полнофункционального интерфейса, который можно расширять и адаптировать в зависимости от конкретных торговых требований.

В следующей части мы улучшим эту панель, добавив ей отзывчивости и интерактивности, что позволит ей динамически реагировать на действия пользователя и торговые действия в MetaTrader 5. Мы рассмотрим, как внедрить события нажатия кнопок, управлять обновлениями данных в реальном времени и внедрять механизмы обратной связи для повышения удобства использования панели. Это позволит превратить текущий статичный интерфейс в мощного торгового помощника, обеспечивающего бесперебойную торговлю в реальном времени. Оставайтесь с нами!

Перевод с английского произведен MetaQuotes Ltd.
Оригинальная статья: https://www.mql5.com/en/articles/16084

Прикрепленные файлы |
Последние комментарии | Перейти к обсуждению на форуме трейдеров (2)
Line00
Line00 | 20 мая 2025 в 09:17

Недавно приступил к изучению MQL5, сталкивался с всевозможными трудностями. Эта статья доступна для понимания новичками. Всё изложено кратко и понятно. Хочется поблагодарить автора за профессионализм. Во время изучения статьи, кроме обучения по созданию Панели, получил ещё несколько полезных навыков для освоения программирования. Большая благодарность автору! С нетерпением ожидаю Part 2.

С уважением к Автору,

Б.В. Долгих

Allan Munene Mutiiria
Allan Munene Mutiiria | 20 мая 2025 в 19:11
Line00 изучать MQL5 и столкнулся со всевозможными трудностями. Эту статью легко понять новичкам. Все кратко и понятно. Хотелось бы поблагодарить автора за профессионализм. В процессе изучения статьи, помимо того, что я научился создавать Панель, я получил еще несколько полезных навыков для освоения программирования. Большое спасибо автору! С нетерпением жду второй части.

С уважением к автору,

Б.В. Долгих

Конечно. Очень рады. Спасибо.

Переосмысливаем классические стратегии (Часть IX): Анализ на нескольких таймфреймах  (II) Переосмысливаем классические стратегии (Часть IX): Анализ на нескольких таймфреймах (II)
В сегодняшнем обсуждении мы рассмотрим стратегию анализа на нескольких таймфреймах, чтобы узнать, на каком таймфрейме наша модель искусственного интеллекта работает лучше всего. Наш анализ приводит нас к выводу, что месячный и часовой таймфреймы дают модели с относительно низким уровнем ошибок по паре EURUSD. Мы использовали это в своих интересах и создали торговый алгоритм, который делает прогнозы с помощью искусственного интеллекта на месячном таймфрейме и совершает сделки на часовом таймфрейме.
Движение цены: Математические модели и технический анализ Движение цены: Математические модели и технический анализ
Прогнозирование движений валютных пар является важным фактором успеха в трейдинге. Данная статья посвящена исследованию различных моделей движения цены, анализу их преимуществ и недостатков, а также практическому применению в торговых стратегиях. Мы рассмотрим подходы, позволяющие выявлять скрытые закономерности и повышать точность прогнозов.
Интеграция MQL5 с пакетами обработки данных (Часть 3): Улучшенная визуализация данных Интеграция MQL5 с пакетами обработки данных (Часть 3): Улучшенная визуализация данных
В этой статье мы рассмотрим расширенную визуализацию данных, включая такие функции, как интерактивность, многослойные данные и динамические элементы, позволяющие трейдерам более эффективно изучать тренды, закономерности и корреляции.
Нейросети в трейдинге: Обобщение временных рядов без привязки к данным (Базовые модули модели) Нейросети в трейдинге: Обобщение временных рядов без привязки к данным (Базовые модули модели)
Продолжаем знакомство с фреймворком Mamba4Cast. И сегодня мы погрузимся в практическую реализацию предложенных подходов. Mamba4Cast создавался не для долгого прогрева на каждом новом временном ряде, а для мгновенного включения в работу. Благодаря идее Zero‑Shot Forecasting модель способна сразу выдавать качественные прогнозы на реальных данных без дообучения и тонкой настройки гиперпараметров.