Programmation d’un stm32 via touchgfx & stm32 Cube IDE

Programmation d’un stm32 via touchgfx & stm32 Cube IDE

SOMMAIRE :

1.     Introduction : Motivations et objectifs

2.     TouchGFX : La structure MVP.

3.     Création d'une interface graphique à l'aide de TouchGFX

4.     STM32 Cube IDE : Importer un projet généré par TouchGFX.

5.     Mise en œuvre de la liaison Model -> ScreenX

6.     Mise en œuvre de la liaison ScreenX -> Model

7.     Théorie sur l’interfaçage entre la GUI et la partie hardware

8.     Commande du hardware depuis la GUI

9.     Commande du hardware depuis la GUI

1.   Introduction : Motivations et Objectifs

Mes motivations :

• Création d’un outil mémo pour faciliter la transition entre les différents projets sur lesquels je bosse (professionnellement ou pour mes loisirs).
• Présenter au monde des makers une solution accessible et complémentaire à l’Arduino et au Raspberry Pi, en essayant d’offrir un support inexistant aujourd’hui pour les amateurs.

Les objectifs :

Je ne vais pas présenter dans le détail les deux logiciels : TouchGFX et STM32 Cube IDE car je ne suis pas un spécialiste et puisque des tutoriels plutôt complets sont déjà disponibles. Cependant mon objectif principal et de vous présenter comment les combiner pour créer un projet d’interface homme-machine complet. Pour cela le tutoriel s’articulera autour de la réalisation d’une IHM bidirectionnelle qui pourra être utilisée comme structure de départ à tous vos futurs projets.

Quelques petites remarques avant de commencer (si si j'ai bientôt fini mon blabla, courage !   ) :

• C'est la première fois que je passe de l’autre côté de l’écran et que j’essaie de partager mes quelques connaissances donc soyez indulgents. Je suis bien entendu à l’écoute de toute remarques constructives ou compléments d’infos utiles à la compréhension du sujet.
• Ce tutoriels s'adresse aux personnes curieuses possédant déjà quelques connaissances en programmation C/C++.
• Une vidéo sera peut-être réalisée un jour pour toucher un publique plus large.

2.   TouchGFX : La structure MVP

Le logiciel TouchGFX permet de créer facilement des interfaces graphiques pour les produits utilisant des microcontrôleurs stm32, je ne vous expliquerais pas comment l'utiliser car il existe pleins de choses existantes bien faites, cependant je vais m'attarder sur un point crucial à la bonne compréhension du tutoriel :  l'architecture MVP.

L’architecture MVP (= Model View Presenter) est très répandue dans le développement d’interface graphique. Cette architecture permet la division du code en plusieurs parties ce qui facilite son utilisation, sa portabilité (réutilisation dans d’autres projets) et sa maintenabilité. La division du code permet également de tester séparément la partie logique et la partie visuelle.

Cette architecture se compose de 3 classes :

•  La classe Model = interface de données, elle sert également de lien entre la partie non-UI* (=Backend system) et la partie UI du projet : c’est le cœur de l’interface graphique. 
•  La classe View = interface passive qui affiche les données et acquiert les informations de l’utilisateur (via les différents widgets de touchgfx ex : zone de texte, image, bouton, menu déroulant, curseur…)
•  La classe Presenter = interface entre les classes Model et View

(*) UI = Interface utilisateur.

Pour avoir des informations sur l'utilisations de TouchGFX, je vous conseille les liens suivants (c'est en anglais) :

- Une vidéo démo de ce qu'offre TouchGFX : https://www.youtube....eature=emb_logo

-  https://support.touc...uction/welcome/ , l'onglet "Tutorials" du support technique du logiciel est très intéressant pour rentrer rapidement dans le vif du sujet.

3.   Création d'une interface graphique à l'aide de TouchGFX

La première étape de la réalisation du projet sera la création de l'interface graphique de celle-ci,si vous avez pris le temps de vous documentez un minimum à propos du logiciel cette partie ne devrait pas vous poser de problème :

Nous allons créer une interface composée d'un bouton à bascule (= Toggle Button) qui pilotera une des LEDs présente sur la carte. Une image complétera l'interface, le bouton poussoir utilisateur présent sur la carte de développement commandera son affiche ou non sur l'écran.

Cette application qui à première vue parait simple, pourra vous servir dans le futur comme structure de base à vos futurs projets car elle englobe les aspects essentiels (contrôle de la partie hardware par le software et inverse, mise en oeuvre d'une routine d'interruption externe ...).

NB : Il est important de prendre le temps de bien définir vos besoins avant de passer à la réalisation de vos projets (quels types de widgets, lister les liens entre la partie interface graphique et le reste, combien d'écrans sont nécessaires dans le cas d'une application avec menu par exemple, définir les liens entre ces écrans etc..). Mais en tant qu'amateurs expérimentés de robotique je vous fais confiance sur ce point, vous savez vous organiser et résistez à la tentation de foncer tête baissée dans vos projets fous   .

To be continued...