Outils et approches de développement d’interfaces graphiques embarquées

Table des matières

Introduction

Une interface utilisateur graphique intégrée est souvent considérée comme un simple « graphique sur un écran ». En pratique, c’est bien plus que cela. L’interface graphique intégrée est une combinaison d’architecture logicielle, de stratégie de rendu, de traitement des entrées et de capacités matérielles, qui travaillent ensemble pour présenter des informations et accepter l’interaction de l’utilisateur d’une manière fiable et prévisible.

Contrairement aux applications de bureau ou mobiles, les interfaces graphiques embarquées sont soumises à des contraintes strictes. Les performances limitées de l’unité centrale, la mémoire restreinte, les exigences en matière de temps réel et les longs cycles de vie des produits influencent tous la manière dont l’interface utilisateur est conçue et mise en œuvre. Par conséquent, les solutions d’interface graphique embarquée vont des interfaces légères fonctionnant sur de petits microcontrôleurs aux applications graphiques avancées fonctionnant sur des systèmes basés sur Linux.

En raison de cette diversité, le terme « interface graphique intégrée » ne décrit pas une technologie ou un flux de travail unique. Il couvre plutôt un large éventail d’approches qui diffèrent par l’endroit où le rendu a lieu, par le degré de dépendance de l’interface graphique par rapport à la plate-forme matérielle et par la flexibilité dont on dispose pour l’évolution future du système.

Trois catégories pratiques de solutions d'interface graphique embarquée

Du point de vue du système, la plupart des solutions d’interface graphique embarquée peuvent être regroupées en trois catégories pratiques. Cette classification n’est pas basée sur des produits ou des fournisseurs spécifiques, mais sur la manière dont l’interface graphique est intégrée dans l’architecture globale du système.

1. Interface graphique liée à un écosystème matériel unique

Dans cette catégorie, le cadre et les outils de l’interface graphique sont conçus spécifiquement pour une famille de processeurs ou un fournisseur de silicium. L’interface utilisateur devient une extension naturelle de l’écosystème matériel, avec des outils étroitement intégrés et des flux de travail recommandés.

2. Cadres et bibliothèques d’interface graphique multiplateforme

Ici, le cadre de l’interface graphique est largement indépendant du matériel sous-jacent. La même base de code d’interface graphique peut être réutilisée sur différents microcontrôleurs ou processeurs, à condition que des pilotes d’affichage et d’entrée appropriés soient disponibles.

3. Interface graphique avec rendu déchargé sur des contrôleurs graphiques externes

Dans cette approche, le processeur principal ne rend pas directement l’interface graphique. Le rendu est assuré par un contrôleur graphique externe dédié, tandis que le processeur principal se concentre sur la logique de l’application et le contrôle du système.

Ce modèle en trois catégories offre un moyen clair et pratique de comprendre le paysage des interfaces graphiques intégrées. Il facilite également le positionnement d’outils et de cadres spécifiques sur la base de choix architecturaux plutôt que de listes de contrôle des fonctionnalités.

Dans les sections suivantes, chaque catégorie est décrite plus en détail, avec des exemples concrets illustrant la manière dont ces approches sont utilisées dans des systèmes embarqués réels.

Interface graphique liée à un écosystème matériel unique

Dans cette catégorie, l’interface utilisateur graphique est étroitement liée à une plate-forme matérielle spécifique ou à un fournisseur de silicium. Le cadre de l’interface graphique, les outils de développement et les flux de travail recommandés sont conçus pour fonctionner ensemble dans le cadre d’un écosystème cohérent.

Cette approche offre généralement un haut niveau d’intégration entre l’interface graphique et le matériel sous-jacent. Les pilotes d’affichage, les contrôleurs tactiles, l’accélération graphique et l’utilisation de la mémoire sont alignés sur les capacités d’une famille particulière de MCU ou de SoC. Par conséquent, la courbe d’apprentissage est souvent plus douce, en particulier pour les équipes déjà familiarisées avec l’environnement de développement du fournisseur.

Les solutions d’interface graphique de cette catégorie sont généralement choisies pour des projets où.. :

• la plate-forme matérielle est fixée dès le début de la conception,
• un soutien à long terme au sein d’un seul écosystème est attendu,
• la vitesse de développement et la cohérence de la chaîne d’outils sont importantes.

Plutôt que de se concentrer sur la portabilité d’une plateforme à l’autre, ces solutions privilégient le couplage étroit et l’optimisation au sein d’un même environnement.

TouchGFX pour STM32

TouchGFX est une interface utilisateur graphique développée spécifiquement pour les microcontrôleurs STM32. Il est étroitement intégré à l’écosystème STM32 et constitue une extension naturelle du flux de développement de ST.

Du point de vue du développeur, TouchGFX combine un outil de conception d’interface utilisateur visuelle avec un cadre C++ optimisé pour le matériel STM32. Les écrans, les animations et les interactions de l’interface utilisateur sont créés dans le concepteur, tandis que la logique de l’application et la configuration du matériel sont gérées par STM32CubeMX et les outils de développement associés.

Cette intégration étroite permet de concevoir l’interface graphique avec une compréhension claire des ressources MCU disponibles, des interfaces d’affichage et des fonctions d’accélération graphique.

Caractéristiques typiques

• Cadre d’interface graphique conçu exclusivement pour STM32
• Concepteur visuel d’interface utilisateur combiné à un code C++ intégré
• Flux de travail aligné sur les outils STM32Cube

TouchGFX - Outil de sélection de cartes

Si vous voulez en savoir plus sur TouchGFX, vous pouvez trouver plus d’informations sur le site web de ST.

NXP GUI Guider

NXP GUI Guider représente une approche légèrement différente, mais toujours centrée sur le fournisseur. Bien qu’il utilise LVGL comme bibliothèque graphique sous-jacente, le flux de travail global reste étroitement lié à l’écosystème NXP.

GUI Guider fournit une interface glisser-déposer pour créer des écrans et définir le comportement de l’interface utilisateur. L’outil génère un code source basé sur LVGL, qui est ensuite intégré et construit dans l’environnement MCUXpresso SDK. Du point de vue de l’utilisateur, l’interface graphique est créée et gérée dans le cadre d’une chaîne d’outils unique fournie par le fournisseur.

Bien que LVGL lui-même soit multiplateforme, la façon dont il est utilisé ici reflète un flux de travail spécifique à la plateforme, optimisé pour les microcontrôleurs NXP et leur pile logicielle recommandée.

Caractéristiques typiques

• Création d’une interface utilisateur visuelle à l’aide d’un outil fourni par le fournisseur
• LVGL utilisé comme moteur de rendu
• Forte intégration avec le SDK MCUXpresso et les plateformes NXP

NXP Gui Guider - Nouvelle fenêtre de projet

Vous pouvez en savoir plus sur NXP Gui Guider sur le site web de NXP.

Autres approches spécifiques aux fournisseurs

On retrouve des concepts similaires dans l’ensemble de l’industrie des systèmes embarqués. De nombreux fournisseurs de circuits intégrés proposent des outils ou des cadres d’interface graphique conçus pour fonctionner au mieux au sein de leurs propres écosystèmes matériels et logiciels.

Si les outils spécifiques diffèrent, l’idée commune reste la même :

• l’interface graphique est traitée comme un élément natif de la plate-forme matérielle,
• et les exemples sont alignés sur une famille spécifique de MCU ou de SoC,
• l’optimisation et la facilité d’utilisation dans un environnement donné priment sur la portabilité.

Cette catégorie reste un choix judicieux pour les projets où la standardisation autour d’un fournisseur unique simplifie le développement et la maintenance à long terme.

Cadres et bibliothèques d'interface graphique multiplateforme

Les cadres d’interface graphique multiplateforme adoptent une approche différente de celle des solutions spécifiques à un fournisseur. Au lieu d’être étroitement liés à un écosystème matériel, ils sont conçus pour fonctionner sur plusieurs plates-formes avec un minimum de changements, voire aucun, dans la base de code de l’interface utilisateur.

Dans ce modèle, l’interface graphique devient une couche logicielle distincte qui se situe au-dessus de l’abstraction matérielle. Tant que des pilotes d’affichage, d’entrée et de synchronisation appropriés sont fournis, le même cadre peut être réutilisé sur différents microcontrôleurs, processeurs, systèmes d’exploitation et même générations de produits.

Cette catégorie est généralement choisie lorsque

• les plates-formes matérielles peuvent changer au fil du temps,
• plusieurs variantes de produits partagent une interface utilisateur commune,
• la maintenabilité et la portabilité à long terme sont des objectifs de conception importants.

Plutôt que d’optimiser pour un MCU spécifique, les frameworks multiplateformes donnent la priorité à la cohérence et à la réutilisation dans tous les environnements.

LVGL comme cadre d’interface graphique embarquée multiplateforme

LVGL est l’une des interfaces graphiques multiplateformes les plus utilisées dans le monde de l’embarqué. Il est conçu pour fonctionner sur une large gamme de systèmes, depuis les petits MCUs aux ressources limitées jusqu’aux plateformes basées sur des MPUs fonctionnant sous Linux.

D’un point de vue architectural, LVGL fournit :

• un modèle d’objet unifié pour les écrans, les widgets et les styles,
• un pipeline de rendu flexible qui peut être adapté à différents pilotes d’affichage,
• la prise en charge des systèmes nus et des systèmes d’exploitation.

Parce que LVGL est indépendant de tout fournisseur de silicium, il permet aux équipes de développement de conserver la même logique d’interface graphique tout en changeant la plate-forme matérielle sous-jacente. Cela le rend particulièrement intéressant pour les produits qui évoluent dans le temps ou qui existent dans de multiples configurations matérielles.

Caractéristiques typiques

• Cadre d’interface graphique unique pour les systèmes MCU et MPU
• Base de code portable en C
• Large gamme d’écrans, de contrôleurs tactiles et de plates-formes pris en charge

Si vous voulez en savoir plus, lisez la page Débuter avec LVGL ou consultez la documentation sur docs.lvgl.io.

Qt et Qt Quick dans les systèmes embarqués

Qt représente une approche de haut niveau pour le développement d’interfaces graphiques embarquées et est le plus souvent utilisé dans des systèmes basés sur des MPU fonctionnant sous Linux. Dans cet environnement, l’interface utilisateur est traitée comme une couche d’application à part entière plutôt que comme une extension légère du micrologiciel.

Au cœur des interfaces graphiques intégrées modernes basées sur Qt se trouve Qt Quick, un cadre construit autour de QML, un langage déclaratif pour décrire les interfaces utilisateur. Qt Quick sépare la structure visuelle, les animations et la logique d’interaction du code de l’application sous-jacente, ce qui permet à l’interface utilisateur d’évoluer indépendamment des fonctionnalités du système.

Cette approche permet :

• des mises en page flexibles et une mise à l’échelle dynamique en fonction de la taille de l’écran,
• des animations et des transitions fluides,
• le rendu accéléré par le matériel à l’aide de pipelines graphiques modernes,
• une séparation claire entre la conception de l’interface utilisateur et la logique de l’application.

Qt Quick est donc la principale technologie responsable du rendu à l’écran dans les systèmes embarqués contemporains basés sur Qt.

Création visuelle d’interface utilisateur avec Qt Design Studio

Une partie essentielle du flux de travail de l’interface graphique intégrée Qt est Qt Design Studio, qui sert d’outil principal pour la conception visuelle de l’interface utilisateur et le prototypage.

Qt Design Studio permet aux concepteurs et aux développeurs de créer des interfaces utilisateur visuellement, de définir des animations et des états, et de prévisualiser les interactions sans se concentrer sur le code d’application de bas niveau. L’outil génère des actifs QML qui peuvent être directement intégrés dans l’application embarquée.

Du point de vue du flux de travail, Qt Design Studio permet :

• la composition visuelle des écrans et des composants,
• la conception d’animations basées sur la chronologie,
• itération rapide sur l’aspect et la convivialité,
• une collaboration étroite entre les équipes chargées de la conception et du logiciel.

Qt Design Studio

Dans les projets embarqués, Qt Design Studio joue un rôle similaire à celui des concepteurs d’interfaces graphiques spécifiques aux fournisseurs que l’on trouve dans les écosystèmes MCU, mais il est adapté aux besoins des systèmes de classe Linux dotés de capacités graphiques plus avancées. Vous trouverez plus de détails sur cet environnement sur le site web de Qt.

Contexte d’intégration et de déploiement

Les applications intégrées basées sur Qt sont généralement développées et intégrées à l’aide de Qt Creator, qui sert d’IDE principal pour gérer QML, C++ et les configurations de construction. Bien que Qt Creator ne soit pas un outil de conception d’interface graphique en soi, il fournit l’environnement dans lequel les éléments d’interface créés dans Qt Design Studio sont combinés avec la logique de l’application.

Dans les produits commerciaux embarqués, Qt est souvent livré avec Qt for Device Creation, qui fournit un moteur d’exécution, une chaîne d’outils et une infrastructure de mise à jour pour les appareils Linux embarqués. Cet emballage simplifie le déploiement et la maintenance à long terme, mais n’affecte pas directement la manière dont l’interface graphique est conçue.

Quand Qt est le bon choix

Les interfaces graphiques intégrées basées sur Qt sont généralement choisies dans les cas suivants :

• l’architecture du système comprend déjà un MPU et Linux,
• l’interface utilisateur est un élément central de l’expérience du produit,
• des modèles d’interaction modernes et des visuels riches sont nécessaires,
• la conception et le développement du logiciel se déroulent en parallèle.

Bien que Qt nécessite un matériel plus performant que les frameworks axés sur les MCU, la combinaison de Qt Quick et de Qt Design Studio offre un environnement mature et évolutif pour la création d’interfaces utilisateur embarquées avancées.

Autres technologies d’interface graphique portable

Au-delà de LVGL et de Qt, il existe d’autres approches portables utilisées dans les projets embarqués, en fonction des exigences du système et de l’expertise de l’équipe.

Il s’agit notamment de

• des interfaces utilisateur basées sur le web, construites avec HTML, CSS et JavaScript et affichées à l’aide d’un navigateur intégré,
• d’autres bibliothèques d’interface graphique ouvertes ou anciennes utilisées dans des produits à long cycle de vie,
• des cadres internes personnalisés développés pour répondre à des exigences très spécifiques.

Bien que ces solutions diffèrent dans leur mise en œuvre, elles partagent un principe commun :
l’interface graphique est traitée comme une couche indépendante de la plate-forme, avec les détails spécifiques au matériel abstraits en dessous.

Interface graphique avec rendu déchargé sur des contrôleurs graphiques externes

La troisième catégorie de solutions d’interface graphique embarquée repose sur une hypothèse architecturale différente de celle des cadres spécifiques aux fournisseurs et des cadres multiplateformes. Dans cette approche, le rendu graphique n’est pas effectué par le MCU ou MPU principal, mais est délégué à un contrôleur graphique externe dédié.

Le processeur principal communique avec le contrôleur graphique à l’aide de commandes de haut niveau, tandis que le contrôleur lui-même est chargé de générer l’affichage et de gérer les entrées tactiles. Cela permet de séparer la logique de l’application de la présentation et d’éliminer la nécessité de maintenir un tampon de trame dans la mémoire principale du système.

Ces architectures sont généralement choisies lorsque

• Les ressources du MCU sont limitées ou réservées aux tâches en temps réel,
• un comportement de rendu prévisible et déterministe est nécessaire,
• la complexité du système doit être étroitement contrôlée.

Plutôt que d’augmenter les performances en augmentant les ressources de l’unité centrale ou de la mémoire, cette catégorie repose sur la décharge matérielle de la charge de travail graphique.

IHM basées sur Bridgetek EVE

La famille EVE de Bridgetek est un exemple représentatif de cette approche. Les appareils EVE agissent comme des contrôleurs d’affichage, graphiques et tactiles dédiés, gérant en interne le rendu, la synchronisation de l’affichage et le traitement tactile.

Dans un système basé sur EVE :

• le MCU hôte envoie des commandes de dessin et de contrôle,
• le contrôleur EVE établit et exécute une liste d’affichage,
• l‘entrée tactile est traitée directement par le dispositif EVE,
• le signal vidéo final est généré directement par le contrôleur EVE.

Cette architecture permet même à des MCU relativement petits de piloter des interfaces graphiques complexes et de gérer l’interaction avec l’utilisateur sans avoir à gérer des tampons de pixels, à mettre en œuvre des algorithmes tactiles ou à effectuer des opérations de rendu en temps réel.

Les caractéristiques typiques des IHM basées sur EVE sont les suivantes :

• pas de framebuffer dans la mémoire du MCU,
• traitement tactile intégré (résistif ou capacitif, selon la variante EVE),
• des performances de rendu stables, indépendamment de la charge de l’application,
• une séparation claire entre la présentation de l’interface utilisateur, le traitement du toucher et la logique de l’application.

EVE convient donc parfaitement aux IHM industrielles classiques, aux panneaux de contrôle et aux dispositifs pour lesquels une interaction tactile robuste, un comportement déterministe et la simplicité du système sont des exigences clés.

Le concepteur d’écran EVE, un élément central du flux de travail EVE

EVE Screen Designer (ESE) est un élément essentiel de l’écosystème EVE de Bridgetek, qui joue un rôle central dans la création d’interfaces utilisateur basées sur EVE.

EVE Screen Designer est un outil visuel, indépendant du matériel, utilisé pour concevoir des écrans d’interface utilisateur complets et des interactions sans avoir besoin d’accéder au matériel cible final. Les écrans sont composés à l’aide de primitives graphiques et de widgets qui correspondent directement aux commandes de la liste d’affichage d’EVE.

Du point de vue du flux de travail de développement, EVE Screen Designer permet :

• la composition visuelle des écrans de l’interface utilisateur et le flux de navigation,
• définition des interactions tactiles et du comportement à l’écran,
• prévisualisation et validation de la logique de l’interface utilisateur avant l’intégration du micrologiciel,
• la génération d’éléments d’interface utilisateur qui sont ensuite contrôlés par le code de l’application.

Comme l’ESE reflète le modèle de rendu sous-jacent d’EVE, les développeurs travaillent dans le cadre de contraintes bien définies, ce qui permet de garantir des performances prévisibles et d’éviter les problèmes d’optimisation à un stade ultérieur.

Concepteur d'écran EVE

LVGL fonctionnant sur EVE – une approche hybride

Une extension intéressante du concept EVE est le projet de référence communément appelé « LVGL fonctionnant sur EVE ». Dans cette approche hybride, LVGL est utilisé comme cadre d’interface graphique de haut niveau, tandis que le backend de rendu réel est géré par le contrôleur EVE.

Ce concept est démontré dans un référentiel public, où LVGL est adapté pour fonctionner avec les appareils Bridgetek EVE.

D’un point de vue architectural :

• LVGL fournit un modèle d’interface utilisateur portable et familier,
• EVE sert de moteur de rendu et d’interface d’affichage,
• le MCU hôte coordonne la logique de l’application et les mises à jour de l’interface utilisateur.

Ce modèle hybride illustre le fait que les trois catégories d’interfaces graphiques décrites dans cet article ne sont pas des frontières rigides, mais des éléments architecturaux qui peuvent être combinés lorsque les exigences du projet le justifient.

Une plate-forme d’affichage, plusieurs approches d’interface graphique

Du point de vue de l’affichage, les différences architecturales décrites jusqu’à présent ne nécessitent pas nécessairement un matériel d’affichage différent.

La même plate-forme d’affichage physique peut être utilisée avec :

• des solutions GUI basées sur des MCU spécifiques à un fournisseur,
• des cadres multiplateformes fonctionnant sur des MCU ou des MPU,
• les systèmes utilisant des contrôleurs graphiques externes,
• Plateformes basées sur Linux avec interfaces utilisateur Qt ou basées sur le web.

Tant que l’interface d’affichage et les caractéristiques électriques sont compatibles, le choix de la technologie de l’interface graphique reste une décision au niveau du système, et non une contrainte au niveau de l’affichage.

Cette flexibilité est particulièrement précieuse pour les produits à long cycle de vie et les familles de produits qui évoluent au fil du temps.

La place de Riverdi dans ce paysage

Riverdi se concentre sur la fourniture de solutions d’affichage qui s’intègrent harmonieusement à une large gamme d’architectures de systèmes embarqués.

Plutôt que d’être liés à un cadre d’interface graphique unique ou à une approche de rendu, les écrans Riverdi sont conçus pour prendre en charge :

• Systèmes basés sur des MCU utilisant des cadres d’interface graphique spécifiques à un fournisseur ou multiplateformes,
• Architectures basées sur EVE avec rendu déchargé,
• Plateformes MPU et Linux utilisant Qt ou des technologies web.

Cela permet aux équipes de développement de choisir ou de modifier l’approche de l’interface graphique tout en conservant une plate-forme d’affichage cohérente entre les différents projets et générations de produits.

Conclusion - choisir une architecture, pas une limitation

Le développement d’interfaces graphiques embarquées n’est pas défini par un outil ou un cadre unique, mais par un ensemble de choix architecturaux qui équilibrent les performances, la complexité et la flexibilité à long terme.

Les solutions spécifiques aux fournisseurs offrent une intégration étroite et une prise en main rapide.
Les cadres multiplateformes permettent la portabilité et la réutilisation.
Les contrôleurs graphiques externes offrent des performances prévisibles avec une charge MCU minimale.

Avec une plate-forme d’affichage bien choisie, ces approches peuvent coexister et évoluer au fil du temps, permettant aux équipes de se concentrer sur l’architecture du système et l’expérience de l’utilisateur plutôt que sur les contraintes techniques.