Gallery of UIs written in MQL - page 16

New comment
 
Nikolai Semko #:

I see, Peter. Thank you.
It is not convenient for a developer, of course. There is a lot of unnecessary code and movements.
Still, the variant with a pointer to a function is much better.

Why is it inconvenient? You'll try it and then you'll draw conclusions.))

1. The constructor prints all element handlers by itself, just connect them.

2. Intellisense provides the necessary functions, just choose.)))

3. All the rules are simple, it's not hard to remember.

Only the visual editor can be easier, but that's later.

P.S. After a 4-year break I completed your task in 10 minutes. The rest of the time I was trying to understand why your function didn't work, and then I was shooting the gif. )))
 
Реter Konow #:
Why is it uncomfortable? You'll try it and then you'll draw conclusions.))

1. All element handlers are printed by the constructor itself, just plug them in.

2. Intellisense provides the necessary functions, just choose one.))

3. All the rules are simple and easy to memorise.

Only the visual editor can be easier, but that's later.

P.S. After a 4-year break, I completed your task in 10 minutes. The rest of the time I was trying to figure out why your function didn't work, and then shooting the gif. )))

I see that your Internal_API.mqh file that a developer will have to write is rather large and intricate. How many lines of code will there be in it in such a task with one button?

It is important for a developer to develop his GUI in the usual way, by creating an object.

For example, I have such a task as follows:

#resource "//Images//eclipse-alt.png" as uchar eclipse_alt[] // загружаем в ресурс изображение иконки с файла png
#include  <My\IconsMenu.mqh>

//+------------------------------------------------------------------+
IconsMenu menu(5,15,1,ANCHOR_RIGHT_UPPER,true,27, CheckBox, 0x00EEEEEE); // создаем меню
//+------------------------------------------------------------------+
void TimerMenu() { // таймер необходим для всплывающей подсказки
   menu.Timer();
}
//+------------------------------------------------------------------+
int OnInit() {
   InitMenu();
   return(INIT_SUCCEEDED);
}
//+------------------------------------------------------------------+
void OnDeinit(const int reason) {
}
//+------------------------------------------------------------------+
void OnTick() {
}
//+------------------------------------------------------------------+
void OnChartEvent(const int id,
                  const long &lparam,
                  const double &dparam,
                  const string &sparam) {
   menu.ChartEvent(id,lparam,dparam,sparam);
}
//+------------------------------------------------------------------+
void InitMenu() {
   menu.SetTimerFunction(TimerMenu); // установка функции таймера
   bool dark_mode = W.Color!=0;      // определяем текущую цветовую схему чарта
   menu.AddPng(eclipse_alt,"dark/light theme",ChangeColorScheme,dark_mode); // создаем элемент кнопки-иконки
   menu.Draw();
}
//+------------------------------------------------------------------+
void ChangeColorScheme (bool checked) {
   struct ColorScheme {
      uint           background;
      uint           foreground;
      uint           grid;
      uint           bar;
      uint           bull;
      uint           bear;
      uint           volume;
   };
   static const ColorScheme c[2] = {{0x00000000,0x00DDAAAA,0x00804040,0x0000FF00,0x00000000,0x00FFFFFF,0x0032CD32},
      {0x00FFFFFF,0x00000000,0x00C0C0C0,0x00000000,0x00FFFFFF,0x00000000,0x00008000}
   };
   int clr_scheme = checked?1:0;

   if (checked) {
      menu.clr_off = 0x00606060;
      menu.clr_hover = 0x30808080;
   } else {
      menu.clr_off = 0x00EEEEEE;
      menu.clr_hover = 0x30FFFFFF;
   }
   menu.ChangeColorAll();
   menu.Draw();

   ChartSetInteger(0,CHART_COLOR_BACKGROUND,c[clr_scheme].background);
   ChartSetInteger(0,CHART_COLOR_FOREGROUND,c[clr_scheme].foreground);
   ChartSetInteger(0,CHART_COLOR_CHART_LINE,c[clr_scheme].bar);
   ChartSetInteger(0,CHART_COLOR_CHART_DOWN,c[clr_scheme].bar);
   ChartSetInteger(0,CHART_COLOR_CHART_UP,c[clr_scheme].bar);
   ChartSetInteger(0,CHART_COLOR_CANDLE_BULL,c[clr_scheme].bull);
   ChartSetInteger(0,CHART_COLOR_CANDLE_BEAR,c[clr_scheme].bear);
   ChartSetInteger(0,CHART_COLOR_GRID,c[clr_scheme].grid);
   ChartSetInteger(0,CHART_COLOR_VOLUME,c[clr_scheme].volume);
   ChartRedraw();
}

everything that concerns creation and customisation of GUI is highlighted in yellow. You don't need to do anything else.
Each new GUI element is one line of code + event handler function from this element.



Files:
SimplestGUI.mq5  7 kb
SimplestGUI.ex5  244 kb
 
Nikolai, I've already explained everything.

1. The file is printed automatically when saving the built GUI.

2. Nobody writes it specially.

3. Inside the file are ready handlers of controls that the user has declared in the markup language.

4.. The handlers receive interface events from the engine.

5. The user only inserts his code into the handlers.

That's all. I won't repeat myself, sorry.

 
Реter Konow controls that the user has declared in the markup language.

4.. Handlers receive interface events from the engine.

5. The user only inserts his code into the handlers.

That's it. I won't repeat myself, sorry.

OK
you didn't provide this file, that's why I make assumptions.
We'll wait for the version with all files, so we can test it live.

 
About the question of how many lines of code.

When solving your problem, I inserted 2 lines from intellisense into the handler. Shown in the picture. I only wrote the name of the colours in brackets. And two lines of function (instead of yours). Nothing else.
 
I'm "cleaning up" the code before the release, "rebuilding" the engine, removing unnecessary things (if I can find them), at the same time remembering how everything worked.

In general, I'll put it up soon.
 
Реter Konow # :
I'm "cleaning up" the code before the release, "rebuilding" the engine, removing unnecessary things (if I can find them), at the same time remembering how everything worked.

In general, I'll put it up soon.

Looking forward to your release, I want to understand your coding ideas.

 
Nikolai Semko # :

Peter, I don't understand you. You didn't answer the questions.
It is important for programmers to know how to interact with your GUI while working.
Here is an example of my GUI. I clicked the light/dark theme shortcut and this event immediately triggered the function to change background colours and lines. How do you do this interaction?


What does it mean " The user will NOT interact (at all) with my code . "?
The programmer needs to interact, not with the code, but with the events that should generate this code.

After all, GUI is not a separate independent program. The GUI must ultimately interact with the developer's main program. Whether it is an indicator or EA.

The GUI you show in your pictures is awesome, can you tell us how you achieved it?

 
hini #:

Looking forward to your release, want to understand your coding ideas.

Okay. (chuckles)

I'll make a little clarification about the release. After a 4-year break, the latest version of the engine was lost. It wasn't discovered right away. The old version is working, but requires an upgrade to the builder version. For this I have to go deep enough into the code, which I had forgotten a bit. However, it's not a big deal and it will be finished.

Because of the delay with the engine, I decided that the release will be divided into 2 parts. First, I will show the constructor. Those who wish will familiarise themselves with the markup language and write the necessary GUI. After some time I will give the public the updated engine. After that I will help to connect the created GUI and it will work together with custom Expert Advisors or indicators. Then everyone will learn simple principles of working with the markup language and methods of connecting to the interface to their applications.

It is easier to make a two-part release because the constructor is almost ready for release, and the engine requires a little modification.

Well, of course, I will provide examples of markup code and additional instructions for writing it together with the release of the constructor.

Wait for it on the weekend).
 
I would like to add a clarification to the above: after the release of the designer, those who want to design their GUI on the fly directly from ME.

1. To do this, they will open the "KIB-source.mqh" inclusion file from the release build.

2. They will save it in the indicators folder and compile it after that.

3. As a result, they will see a new indicator called "KIB-source.ex5" in the MT5 navigator branches and throw it on a free chart.

4. The user will create in the MQL5 navigator\include\... folder for files with markup code.

For example, MQL5\include\My_GUI\Project_1\.....

In this folder he will store files with the interface of his projects. In them he will also write, edit, experiment and design UI on markup code.

5. It is important to specify that while working with the markup language when building the UI, the result is displayed on the MT5 chart, where the indicator "KIB-source.ex5" and the Expert Advisor (constructor) "KIB.ex5", which I will provide in the first release. They should both be on the same chart.

Further (very important), during compilation of the "KIB-source.mq5" file opened in parallel in ME, (together with the files of the custom GUI project), all the markup code is sent to the constructor on the same chart and it completely rebuilds the GUI anew. It takes from 200ms to 1000ms depending on the number of windows and elements in the interface. And the user immediately sees the result of the changes made. Everything happens very quickly and almost in real time - you make changes to the markup code, compile "KIB-source.mq5" and in a split second you see the result on the MT5 chart. Therefore, it is desirable to work on two monitors. MT5 is open on one and ME on the other.

6. The convenience of the markup language is in its simplicity and the ability to create templates of elements and windows that can be easily copied between windows or projects.

7. I would like to add that the designer is open source in the archive. Therefore, the user will have the following tasks:

1. Open the archive.
2. Place the KIB folder in the MQL5\include\ folder.
3. Place the CONNECTION.mqh file from the archive into the MQL5\inlude\ folder (do not put it into subfolders).
4. Put the KIB.mq5 file into the MQL5\Experts\ folder, open it in ME, compile and save it so that the KIB.ex5 Expert Advisor appears in the MT5 navigator.
5. Upload this Expert Advisor to the same chart as the indicator KIB-source.mq5.
6. After that, the KIB.mq5 constructor file in ME can be closed. It will no longer be needed.


Everything is ready to work.


1...91011121314151617181920212223...63
New comment