Comment réaliser une interface graphique sur un écran TFT ?
Objectifs
- On souhaite utiliser un écran TFT/LCD, incluant également une partie tactile, des cartes Disco-F746NG, pour réaliser une interface graphique permettant de piloter un système.
Matériel
- Carte DISCO-F746NG
Pré-requis
Exemples
Exemple réalisé par des étudiants
#include "F746_GUI.hpp" #include "mbed.h" int main() { const string TITRE_ENGL = " Control Panel for the RED Light"; const string TITRE_FRANC ="Tableau de controle de la voie ROUGE" ; Label TITRE_ACCUEIL_FRANC(240, 40, TITRE_FRANC, Label::CENTER, Font16); const int NUMBER_BUTTONS = 3; const int NOMBRE_LANGUES = 2; const string NOMS_BOUTONS_FRANC[NUMBER_BUTTONS] = {"Mode Continu", "Mode Sinusoidal", "Mode Musique"}; const string NOMS_BOUTONS_ENGL[NUMBER_BUTTONS] = {"Continueous Mode", "Sine", "Music"} ; const string NOMS_LANGUES[NOMBRE_LANGUES] = {"English", "French"}; ButtonGroup BoutonsModes(10, 100, 145, 100, NUMBER_BUTTONS, NOMS_BOUTONS_FRANC, 10,2,3,-1, Font12, LCD_COLOR_WHITE, 0xFF003538, LCD_COLOR_RED, LCD_COLOR_DARKRED); Button BoutonRetour(400,210,70,50,"Retour",Font12,LCD_COLOR_WHITE, GuiBase::ENUM_BACK, LCD_COLOR_BLUE, LCD_COLOR_DARKBLUE ) ; Button ChoixLangue (80,210,70,50,"Langue",Font12,LCD_COLOR_WHITE, GuiBase::ENUM_BACK, LCD_COLOR_YELLOW, LCD_COLOR_YELLOW) ; ButtonGroup Langues (150,210,70,50, NOMBRE_LANGUES, NOMS_LANGUES, 5, 10, 2, -1, Font12, LCD_COLOR_WHITE, GuiBase::ENUM_BACK, LCD_COLOR_YELLOW); ButtonGroup BoutonsModes_ENGL(10, 100, 145, 100, NUMBER_BUTTONS, NOMS_BOUTONS_ENGL, 10,2,3,-1, Font12, LCD_COLOR_WHITE, 0xFF003538, LCD_COLOR_RED, LCD_COLOR_DARKRED); Button BoutonRetour_ENGL (400,210,70,50,"Back",Font12,LCD_COLOR_WHITE, GuiBase::ENUM_BACK, LCD_COLOR_BLUE, LCD_COLOR_DARKBLUE ) ; BoutonRetour.Erase() ; Langues.EraseAll(); BoutonsModes_ENGL.EraseAll() ; BoutonRetour_ENGL.Erase() ; int langue_choisie = 1 ; while(1){ int num ; int num_langue ; if (BoutonsModes.GetTouchedNumber(num)) { if (langue_choisie ==0) { BoutonRetour_ENGL.Draw() ; BoutonsModes_ENGL.DrawAll() ; //BoutonRetour_ENGL.Activate() ; //BoutonsModes_ENGL.ActivateAll() ; } switch (num) { case 0: BoutonsModes.Activate(0); BoutonsModes.Inactivate(1); BoutonsModes.Inactivate(2); BoutonRetour.Activate() ; BoutonRetour.Draw() ; if (langue_choisie ==0) { BoutonsModes_ENGL.Draw(0); BoutonRetour_ENGL.Draw(); BoutonsModes_ENGL.Inactivate(1); BoutonsModes_ENGL.Inactivate(2); } break; case 1: BoutonsModes.Inactivate(0); BoutonsModes.Activate(1); BoutonsModes.Inactivate(2); BoutonRetour.Activate(); BoutonRetour.Draw() ; if (langue_choisie ==0) { BoutonsModes_ENGL.Draw(1); BoutonRetour_ENGL.Draw(); BoutonsModes_ENGL.Inactivate(0); BoutonsModes_ENGL.Inactivate(2); } break; case 2: BoutonsModes.Inactivate(0); BoutonsModes.Inactivate(1); BoutonsModes.Activate(2); BoutonRetour.Activate(); BoutonRetour.Draw(); if (langue_choisie ==0) { BoutonsModes_ENGL.Draw(2); BoutonRetour_ENGL.Draw(); BoutonsModes_ENGL.Inactivate(1); BoutonsModes_ENGL.Inactivate(0); } break; } } if (BoutonRetour.Touched()){ BoutonsModes.ActivateAll() ; BoutonRetour.Erase() ; if (langue_choisie ==0) { BoutonsModes_ENGL.DrawAll() ; BoutonsModes_ENGL.ActivateAll() ; } } if (ChoixLangue.Touched()){ BoutonsModes.EraseAll() ; Langues.DrawAll(); ChoixLangue.Inactivate() ; } if (Langues.GetTouchedNumber(num_langue)) { if (num_langue==0) { lcd.Clear(GuiBase::ENUM_BACK); Label TITRE_ACCUEIL_ENGL(240, 40, TITRE_ENGL, Label::CENTER, Font16); BoutonsModes_ENGL.DrawAll(); //Button boutonTEST(240, 100, 145,100,"Mode Continu",Font20, LCD_COLOR_GREEN, LCD_COLOR_WHITE, LCD_COLOR_RED, LCD_COLOR_WHITE); //Button BoutonRetour_ENGL (400,210,70,50,"Back",Font12,LCD_COLOR_WHITE, GuiBase::ENUM_BACK, LCD_COLOR_BLUE, LCD_COLOR_DARKBLUE ) ; // ButtonGroup Langues (130,110,70,50, NOMBRE_LANGUES, NOMS_LANGUES, 5, 10, 1, -1, Font12, LCD_COLOR_WHITE, GuiBase::ENUM_BACK, LCD_COLOR_YELLOW); BoutonRetour.Erase() ; Langues.EraseAll(); ChoixLangue.Draw() ; ChoixLangue.Activate(); langue_choisie = 0 ; } else { lcd.Clear(GuiBase::ENUM_BACK); Label TITRE_ACCUEIL_FRANC(240, 40, TITRE_FRANC, Label::CENTER, Font16); BoutonsModes.DrawAll() ; BoutonRetour.Draw(); ChoixLangue.Draw(); BoutonRetour.Erase() ; Langues.EraseAll(); ChoixLangue.Activate(); langue_choisie = 1 ; } } } }
Exemple réalisé lors du projet PIMS – WDM – en 2019, par Morgane LARDENNOIS, Rosemary COLAERT, Audrey MENAESSE et Etienne JUMPERTZ
Exemple F746_GUI
Exemple réalisé par Mikami.
#include "F746_GUI.hpp" #include "mbed.h" int main() { Label obj10(240, 2, "Demo: GUI parts, 2018/03/12", Label::CENTER, Font16); Label obj11(240, 20, "Button, ButtonGroup, Label, NumericLabel, BlinkLabel,", Label::CENTER); Label obj12(240, 32, "SeekBar, SeekbarGroup, NumericUpDown", Label::CENTER); Button button1(10, 54, 30, 35, "1"); Button button2(42, 54, 30, 35, "2"); const int NUMBER_BUTTONS = 4; const string STR1[NUMBER_BUTTONS] = {"Button1", "Button2", "Button3", "Activate"}; ButtonGroup bGroup1(168, 54, 66, 35, NUMBER_BUTTONS, STR1, 2, 2, 3, 1, Font12, LCD_COLOR_WHITE, 0xFF003538, 0xFFB70068, 0xFFFF7FFF); NumericLabel bTouch(240, 112, "", Label::LEFT, Font12, LCD_COLOR_MAGENTA); // Fonction pas encore comprise // Control status of bGroup2 ButtonGroup bGroup2(168, 150, 66, 40, 3, (string[]){"0", "1", "2"}, 5, 5, 3); bGroup2.InactivateAll(); // Switching buttons to control barH active or inactive ButtonGroup bGroup3(78, 54, 40, 35, 2, (string[]){"ON", "OFF"}, 0, 0, 2); bGroup3.TouchedColor(0); Button doNotTouch(250, 220, 120, 40, "Don't Touch", Font12, GuiBase::ENUM_TEXT, GuiBase::ENUM_BACK, LCD_COLOR_DARKGREEN, LCD_COLOR_RED); // Using default value for argument (Horizontal) SeekBar barH(20, 250, 200, -5, 5, 0, "-5", "", "5"); NumericLabel numLabel1(80, 205, "%5.1f", barH.GetValue()); NumericLabel numLabel2(130, 205, "%3d", (int)barH.GetValue()); NumericLabel numLabel3(160, 205, "%3d"); // SeekbarGroup (vertical) SeekbarGroup barV(410, 130, 121, 2, 45, -6, 6, 2, SeekBar::Vertical, 0xFFA0FFC0); Array<numericlabel *> numLabel4(2); for (int n=0; n<2; n++) numLabel4[n] = new NumericLabel(410+n*45, 104, "%4.1f", barV.GetValue(n), Label::CENTER); NumericLabel numLabel5(455, 92, "%1d", barV.GetIntValue(0), Label::CENTER); // Test of left-, cenrer-, and right-justified Label leftJustified(420, 54, "ABC", Label::LEFT); Label centerJustified(420, 64, "ABC", Label::CENTER); Label rightJustified1(420, 74, "ABC", Label::RIGHT); // NumericalUpDown NumericUpDown nUd(3, 10, 190, 100, 999, 10); while (true) { if (button1.Touched()) button2.Draw(); if (button2.Touched()) button1.Draw(); int num; if (bGroup1.GetTouchedNumber(num)) bTouch.Draw("Button%d touched", num+1); if (num == 3) bGroup2.ActivateAll(); if (bGroup2.GetTouchedNumber(num)) switch (num) { case 0: button1.Activate(); bGroup1.Activate(1); bGroup1.DrawAll(); break; case 1: button1.Inactivate(); bGroup1.Inactivate(1); break; case 2: bGroup1.EraseAll();//for (int n=0; n<4; n++) bGroup1.Erase(n); for (int n=0; n<2; n++) { barV.Draw(n, 0); // reset seekbar numLabel4[n]->Draw("%4.1f", barV.GetValue(n)); } break; } if (barH.Slide()) { numLabel1.Draw("%5.1f", barH.GetValue()); int8_t x = (int8_t)barH.GetValue(); numLabel2.Draw("%3d", x); numLabel3.Draw(barH.GetIntValue()); } int sbNum; if (barV.GetSlidedNumber(sbNum)) { if (sbNum == 0) numLabel4[sbNum]->Draw("%4.1f", barV.GetValue(sbNum)); else numLabel4[sbNum]->Draw("%4.1f", barV.GetValue(sbNum)); if (sbNum == 1) numLabel5.Draw("%1d", barV.GetIntValue(sbNum)); } // If "doNotTouch" button touched, trapped into endless loop if (doNotTouch.Touched()) BlinkLabel warning(250, 200, "You must reset", Label::LEFT, Font16); // SeekBar active inactive switching if (bGroup3.Touched(0)) { barH.Activate(); barV.ActivateAll(); } if (bGroup3.Touched(1)) { barH.Inactivate(); barV.InactivateAll(); } if (nUd.Touched()) {} // Example of NumericalUpDown wait(0.02f); } } </numericlabel
| MInE | Prototyper | Prototyper avec Nucleo et MBED |
Nucléo – Réaliser une interface graphique sur écran TFT / 3