Créer des menus LCD personnalisés sur Arduino avec XOD – Sans coder
Composants et fournitures
| Composant | Quantité |
|---|---|
| Arduino UNO | 1 |
| Shield LCD/Keypad DFRobot pour Arduino | 1 |
Applications et services en ligne
- Environnement XOD
À propos du projet
Les processeurs des cartes Arduino ne sont plus ceux de grand-père : ils ont une puissance sérieuse et peuvent surveiller et contrôler de nombreux capteurs et actionneurs simultanément. L'IDE de programmation graphique XOD pour Arduino simplifie le prototypage rapide, mais à mesure que la complexité grandit se pose la question du contrôle utilisateur et de la gestion de l'information : comment organiser l'affichage des données du processus et permettre à l'utilisateur de le contrôler logiquement. Des boutons et interrupteurs dédiés suffisent pour des projets simples, mais on manque vite de moyens logiques pour les agencer (ou de place sur le boîtier). De nombreux designs utilisent un afficheur pour ce retour d'information — même un four micro-ondes a un petit écran pour régler les paramètres et entrer les temps de cuisson. Si trop de « plongées dans les menus » pour accéder à des réglages obscurs peut nuire à l'expérience utilisateur, les interfaces à menus sont une réalité pour tout type de projet.
Les frameworks logiciels pour développer des interfaces à menus en C/C++ pour microcontrôleurs ont souvent une courbe d'apprentissage raide et sont difficiles à faire évoluer rapidement, car tout interagit avec tout. L'objectif de ce projet est d'utiliser l'environnement de programmation graphique XOD pour offrir la capacité de prototyper rapidement des interfaces à menus pour projets Arduino-compatibles, via un style glisser-déposer / WYSIWYG. Les paramètres d'entrée/sortie de la structure de menu générée sont modulaires et génériques, utilisables avec diverses sources d'entrée (interrupteurs, boutons, encodeurs) et produisent une séquence de sorties textuelles brutes qui peuvent être envoyées vers divers types d'affichage supportés par XOD, dont les modules LCD multi-lignes utilisés dans cet exemple.
Si vous ne connaissez pas l'environnement XOD utilisé ici, consultez d'abord les tutoriels sur xod.io.
Exemple simple : diagramme de patch XOD

Section contrôleur de menu
À droite de l'écran d'édition XOD, quatre nœuds sont connectés en cascade. De haut en bas :
- Un nœud d'entrée analogique, connecté à une entrée analogique de l'Arduino. Dans mes tests, j'utilise un Arduino Uno (ATMega328 8 bits, 16 MHz) avec un shield LCD/keypad 16×2. Le clavier du shield est relié via les broches du shield à l'entrée analogique « A0 » de l'Arduino ; le matériel génère des tensions différentes selon la touche pressée.
- Hormis le bouton « reset » du clavier qui ne passe pas par le sketch, ce type de shield offre quatre flèches directionnelles (haut, bas, gauche, droite) et un bouton « select ». Le deuxième nœud décode les tensions correspondant à chaque touche et émet des impulsions selon le bouton pressé. Une entrée « timeout » permet d'ajuster le débouncing du clavier.
- Le troisième nœud est un contrôleur de menu, qui accepte les impulsions du panneau de commande et gère la logique de navigation dans l'arborescence de menus et les sélections qui génèrent des mises à jour d'état.
- Actuellement, il accepte une entrée de type Nombre (tout paramètre modifiable depuis un contrôle externe, ex. potentiomètre). Quand un menu « feuille » est sélectionné (réception d'une impulsion sur son entrée « Invoke »), le nœud de l'écran actuel émet une impulsion sur sa sortie et envoie une modification de paramètre. Deux entrées String permettent d'afficher un écran de démarrage (splash screen) à la mise sous tension.
- Le quatrième nœud est un module standard de contrôleur LCD 16×2 de la bibliothèque XOD, mais tout type d'affichage pour lequel un module existe peut être utilisé.
Section arborescence de menu
En haut de la capture, une structure en arbre qui, une fois compilée et sa « racine » finale connectée à l'entrée correspondante du contrôleur de menu, génère automatiquement un menu navigable tel que vu dans le designer graphique. Trois types de nœuds de menu sont implémentés :
- Feuille (leaf) : menu final, sans ports d'entrée orange — représente une action ou un paramètre contrôlable par l'utilisateur.
- Branche (branch) : avec entrée et sortie, l'utilisateur choisit parmi plusieurs sous-menus enfants.
- Concaténation (concat) : regroupe des sous-menus et les alimente dans l'entrée d'un menu branche, pour former un groupe d'options.
Le câblage de ces nœuds devrait être explicite depuis le diagramme. Sélectionner « invoke » sur un menu branche fait descendre dans son groupe de sous-menus, au lieu de générer une sortie comme une feuille. Sous-sous-menus, etc. sont possibles ! Structures complexes limitées principalement par la RAM et la Flash du modèle d'Arduino utilisé.
Section sortie
Dans cet exemple, la section sortie connecte les menus feuilles au matériel externe via les broches de sortie de l'Arduino. Chaque menu feuille a une sortie de type Impulsion connectée à un bascule via un bus, pour basculer sa broche numérique associée. Cet arrangement peut commander des relais ou LEDs, mais les sorties Impulsion sont très générales : l'impulsion générée en sélectionnant « Invoke » sur un menu feuille pourrait mettre à jour un nœud tampon XOD interne où la donnée du paramètre (venant de l'entrée paramètre du contrôleur de menu) est conservée pour usage futur.
Problèmes connus
- Testé et fonctionnel sur Arduino Uno tel quel, mais quelques points non résolus à la date limite du projet.
- Il doit y avoir au moins un menu branche dans l'arbre pour que le sketch compile, ce que la plupart des projets voudront de toute façon.
- L'entrée « top » du contrôleur de menu (retour à l'écran titre) n'est pas encore implémentée, mais sera facile à ajouter.
- Les afficheurs 4 lignes sont supportés par le nœud contrôleur, mais l'interface menu feuille à 4 lignes de texte n'est pas encore écrite.
- Beaucoup d'efforts ont réduit l'empreinte mémoire, mais le transpileur XOD stocke les chaînes constantes de façon non optimale pour la RAM. Les interfaces à menus ont beaucoup de texte. Une astuce a été développée : des nœuds de type « flash-string » ont été ajoutés au patch pour éviter que les longues chaînes ne consomment la RAM précieuse. Espérons que XOD l'optimisera dans une mise à jour, mais l'astuce fonctionne pour l'instant.
- L'utilisation des nœuds flash-string n'est pas trop pénible mais nécessite de dupliquer le patch et le code pour chaque nouvelle chaîne stockée en Flash, et de cliquer dans le code C++ du nœud pour éditer la chaîne :

- L'entrée « ID » des nœuds feuille et branche n'a pas encore de fonction. L'idée serait d'associer des numéros d'ordre à chaque groupe de sous-menus pour que l'utilisateur suive sa position, mais cela demande plus de réflexion pour l'automatiser en C++.
Travaux en cours
- Tests de bogues supplémentaires et tests sur d'autres cartes Arduino (ARM, etc.).
- Les types de nœuds menu actuels sont limitants ; plus de variété d'entrées/sorties serait souhaitable.
- Continuer à réduire l'empreinte RAM, peut-être via plus de méta-programmation à la compilation et stockage maximal en Flash plutôt qu'assemblage/concaténation des composants d'arbre à l'exécution.
Deuxième exemple (19/02/2019)
Cette seconde capture montre comment utiliser le contrôleur de menu pour prendre une valeur externe ou interne comme entrée, afficher la valeur actuelle et la précédente sur une page de menu désirée, et sélectionner une nouvelle valeur pour la stocker dans un tampon.

À droite, le nœud contrôleur de menu reçoit la sortie d'un compteur alimenté par un nœud « clock ». Cela pourrait être toute donnée interne ou une valeur externe (ex. potentiomètre sur entrée analogique). La sortie du compteur est aussi envoyée à un nœud de formatage de chaîne, concaténée avec du texte d'affichage pour montrer la valeur courante sur la deuxième ligne du LCD quand cette page de menu est affichée.
Les sorties « invoked » et « param » du menu feuille « A » vont vers un nœud « buffer » de la bibliothèque standard XOD. La sortie du buffer revient vers un arrangement similaire, avec un nœud « defer » pour casser les boucles de rétroaction dans XOD. La valeur stockée dans le buffer s'affiche sur la première ligne du LCD.
Quand le contrôleur de menu reçoit une impulsion « invoke » du contrôleur de clavier, le nœud A-out sort la valeur du paramètre d'entrée du contrôleur (ici la valeur du compteur) et une impulsion « invoked » qui active la mise à jour du buffer et stocke le nouveau paramètre. L'affichage se met à jour automatiquement pour refléter la nouvelle valeur stockée.
La sortie du buffer peut ensuite être routée vers n'importe quels autres nœuds pour modifier leur comportement selon la nouvelle valeur choisie par l'utilisateur :

Code
Bibliothèque XOD Menu System
https://xod.io/libs/bitrex/xod-menu-system-11
Ajoutez bitrex/xod-menu-system aux bibliothèques du sketch via Fichier → Ajouter des bibliothèques… dans l'environnement XOD.
No preview (download only).
Schémas
Ouvrir directement avec l'IDE XOD : xodmenusystemrev1_1_4-1-19_fLVYrcSgbX.xodball
Processus de fabrication
- Construire un décodeur DTMF avec un Arduino seul – Aucun CI supplémentaire nécessaire
- Créer un système Ambilight spectaculaire pour moniteur avec Arduino
- Construire un dispositif de lévitation ultrasonique avec Arduino – Guide étape par étape
- Créer des animations et jeux sur LCD avec Arduino UNO
- Construire un Voltmètre Intelligent avec Arduino et Smartphone – Projet DIY Facile
- Moniteur de Fréquence Cardiaque IoT en Temps Réel avec Arduino et MAX30100
- Serveur Web Arduino Uno WiFi : Commander une LED via Navigateur
- Compteur de stationnement intelligent : Suivi véhicule en temps réel avec Arduino, Processing et PHP
- Automatiser le Jeu Chrome Dino avec Arduino et LDR