Galerie d'interfaces utilisateur écrites en MQL - page 16

 
Nikolai Semko #:

Je vois, Peter.
Ce n'est pas pratique pour un développeur, bien sûr, car il y a beaucoup de code et de mouvements inutiles.
Il y a beaucoup de code et de mouvements inutiles, mais la variante avec un pointeur sur une fonction est bien meilleure.

Pourquoi n'est-ce pas pratique ? Vous l'essaierez et vous tirerez des conclusions.))

1. Le constructeur imprime lui-même tous les gestionnaires d'éléments, il suffit de les connecter.

2. Intellisense fournit les fonctions nécessaires, il suffit de choisir.)))

3. Toutes les règles sont simples, il n'est pas difficile de s'en souvenir.

Seul l'éditeur visuel peut être plus facile, mais c'est pour plus tard.

P.S. Après une pause de 4 ans, j'ai réalisé votre tâche en 10 minutes. Le reste du temps, j'ai essayé de comprendre pourquoi votre fonction ne fonctionnait pas, et ensuite j'ai tourné le gif. )))
 
Реter Konow #:
Pourquoi est-ce inconfortable ? Tu l'essaieras et tu en tireras des conclusions.))

1. Tous les gestionnaires d'éléments sont imprimés par le constructeur lui-même, il suffit de les insérer.

2. Intellisense fournit les fonctions nécessaires, il suffit d'en choisir une.))

3. Toutes les règles sont simples et faciles à mémoriser.


Seul l'éditeur visuel pourrait être plus facile, mais cela viendra plus tard.

P.S. Après une pause de 4 ans, j'ai réalisé votre tâche en 10 minutes. Le reste du temps, j'ai essayé de comprendre pourquoi votre fonction ne fonctionnait pas, puis j'ai filmé le gif. )))

Je constate que le fichier Internal_API.mqh qu'un développeur devra écrire est plutôt volumineux et complexe.



Combien de lignes de code y aura-t-il dans une telle tâche avec un seul bouton ? Il est important pour un développeur de développer son interface graphique de la manière habituelle, en créant un objet. Par exemple, j'ai une telle tâche comme suit :

#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();
}

tout ce qui concerne la création et la personnalisation de l'interface graphique est surligné en jaune.
Chaque nouvel élément de l'interface graphique correspond à une ligne de code + une fonction de gestion d'événement de cet élément.



Dossiers :
 
Nikolaï, j'ai déjà tout expliqué.

1. Le fichier est imprimé automatiquement lors de l'enregistrement de l'interface graphique construite.

2. Personne ne l'écrit spécialement.

3. Le fichier contient des gestionnaires de contrôles prêts à l'emploi que l'utilisateur a déclarés dans le langage de balisage.

4.. Les gestionnaires reçoivent les événements d'interface du moteur.

5. L'utilisateur insère uniquement son code dans les gestionnaires.

C'est tout. Je ne vais pas me répéter, désolé.

 
Реter Konow contrôles que l'utilisateur a déclarés dans le langage de balisage.

4.. Les gestionnaires reçoivent les événements d'interface du moteur.

5. L'utilisateur n'insère son code que dans les gestionnaires.

Voilà, c'est tout. Je ne vais pas me répéter, désolé.



OK vous n'avez pas fourni ce fichier, c'est pour cela que je fais des suppositions. Nous allons attendre la version avec tous les fichiers, pour pouvoir la tester en direct.

 
En ce qui concerne la question du nombre de lignes de code.

Lorsque j'ai résolu votre problème, j'ai inséré 2 lignes provenant d'intellisense dans le handler. C'est ce que montre l'image. Je n'ai écrit que le nom des couleurs entre parenthèses. Et deux lignes de fonction (au lieu de la vôtre). Rien d'autre.
 
Je "nettoie" le code avant la sortie, je "reconstruis" le moteur, j'enlève les choses inutiles (si je peux les trouver), tout en me rappelant comment tout fonctionnait.

En général, je le mettrai en ligne bientôt.
 
Реter Konow # :
Je "nettoie" le code avant la sortie, je "reconstruis" le moteur, j'enlève les choses inutiles (si je peux les trouver), tout en me rappelant comment tout fonctionnait.

En général, je le mettrai en ligne bientôt.

J'attends avec impatience votre publication, je veux comprendre vos idées de codage.

 
Nikolai Semko # :

Peter, je ne te comprends pas. Vous n'avez pas répondu aux questions.
Il est important que les programmeurs sachent comment interagir avec leur interface graphique lorsqu'ils travaillent.
Voici un exemple de mon interface graphique. J'ai cliqué sur le raccourci du thème clair/foncé et cet événement a immédiatement déclenché la fonction permettant de changer les couleurs et les lignes d'arrière-plan. Comment réaliser cette interaction ?


Que signifie "L'utilisateur n'interagira PAS (du tout) avec mon code . " ?
Le programmeur doit interagir, non pas avec le code, mais avec les événements qui doivent générer ce code.

Après tout, l'interface graphique n'est pas un programme indépendant. L'interface graphique doit finalement interagir avec le programme principal du développeur. Qu'il s'agisse d'un indicateur ou d'un EA.

L'interface graphique que vous montrez dans vos photos est impressionnante, pouvez-vous nous dire comment vous l'avez réalisée ?

 
hini #:

J'attends avec impatience votre publication, je veux comprendre vos idées de codage.

D'accord.

Je vais faire une petite mise au point à propos de la version. Après une pause de quatre ans, la dernière version du moteur a été perdue. Cela n'a pas été découvert tout de suite. L'ancienne version fonctionne, mais nécessite une mise à jour vers la version du constructeur. Pour cela, je dois aller assez loin dans le code, que j'avais un peu oublié. Cependant, ce n'est pas un gros problème et cela sera terminé.

A cause du retard pris par le moteur, j'ai décidé que la publication serait divisée en 2 parties. Tout d'abord, je vais montrer le constructeur. Ceux qui le souhaitent pourront se familiariser avec le langage de balisage et écrire l'interface graphique nécessaire. Après un certain temps, je donnerai au public le moteur mis à jour. Ensuite, j'aiderai à connecter l'interface graphique créée et elle fonctionnera avec des Expert Advisors ou des indicateurs personnalisés. Tout le monde apprendra alors les principes simples du travail avec le langage de balisage et les méthodes de connexion de l'interface à leurs applications.

Il est plus facile de faire une version en deux parties parce que le constructeur est presque prêt à être publié et que le moteur nécessite quelques modifications.

Bien sûr, je fournirai des exemples de code de balisage et des instructions supplémentaires pour l'écrire en même temps que la publication du constructeur.

Attendez le week-end pour en savoir plus).
 
J'aimerais ajouter une précision à ce qui précède : après la sortie du designer, ceux qui veulent concevoir leur GUI à la volée directement à partir de ME.

1. Pour ce faire, ils ouvriront le fichier d'inclusion "KIB-source.mqh" de la version release.

2. Ils le sauvegarderont dans le dossier indicators et le compileront ensuite.

3. En conséquence, ils verront un nouvel indicateur appelé "KIB-source.ex5" dans les branches du navigateur MT5 et le lanceront sur un graphique libre.

4. L'utilisateur créera dans le navigateur MT5 un dossier "Include" pour les fichiers contenant le code de balisage. pour les fichiers contenant le code de balisage.

Par exemple, MQL5\include\My_GUI\Project_1\.....

Dans ce dossier, il stockera les fichiers contenant l'interface de ses projets. Il y écrira, modifiera, expérimentera et concevra l'interface utilisateur à partir du code de balisage.

5. Il est important de préciser qu'en travaillant avec le langage de balisage lors de la construction de l'interface utilisateur, le résultat est affiché sur le graphique MT5, où l'indicateur "KIB-source.ex5" et l'Expert Advisor (constructeur) "KIB.ex5", que je fournirai dans la première version. Ils doivent tous deux se trouver sur le même graphique.

De plus (très important), pendant la compilation du fichier "KIB-source.mq5" ouvert en parallèle dans ME, (avec les fichiers du projet GUI personnalisé), tout le code de balisage est envoyé au constructeur sur le même graphique et il reconstruit complètement l'interface graphique. Cela prend de 200 ms à 1000 ms en fonction du nombre de fenêtres et d'éléments dans l'interface. Et l'utilisateur voit immédiatement le résultat des modifications apportées. Tout se passe très rapidement et presque en temps réel - vous apportez des modifications au code de balisage, vous compilez "KIB-source.mq5" et, en une fraction de seconde, vous voyez le résultat sur le graphique MT5. Il est donc souhaitable de travailler sur deux moniteurs. MT5 est ouvert sur l'un et ME sur l'autre.

6. L'intérêt du langage de balisage réside dans sa simplicité et dans la possibilité de créer des modèles d'éléments et de fenêtres qui peuvent être facilement copiés d'une fenêtre ou d'un projet à l'autre.

7. J'aimerais ajouter que le concepteur est une source ouverte dans l'archive. Par conséquent, l'utilisateur devra effectuer les tâches suivantes : 1. ouvrir l'archive

1. ouvrir l'archive
2. Placer le dossier KIB dans le dossier MQL5.
3. Placez le fichier CONNECTION.mqh de l'archive dans le dossier MQL5\include\ (ne le placez pas dans des sous-dossiers).
4. Placez le fichier KIB.mq5 dans le dossier MQL5\Experts\, ouvrez-le dans ME, compilez-le et sauvegardez-le pour que le Conseiller Expert KIB.ex5 apparaisse dans le navigateur MT5.
5. Téléchargez ce conseiller expert sur le même graphique que l'indicateur KIB-source.mq5.
6. Après cela, le fichier constructeur KIB.mq5 dans ME peut être fermé. Il ne sera plus nécessaire.


Tout est prêt à fonctionner.