Egui, une GUI en mode immédiat écrite en Rust

 (egui.rs)
10 points par GN⁺ 2024-12-27 | 1 commentaires | Partager sur WhatsApp
  • egui est une bibliothèque GUI en mode immédiat (Immediate Mode) écrite en Rust, qui fonctionne sur le web et en environnement natif
  • Sur le web, elle est compilée en WebAssembly et rendue via WebGL, tandis qu’en natif elle prend en charge diverses plateformes comme Mac, Linux et Windows
  • Elle est implémentée entièrement en Rust pur, sans DOM, HTML, JS ni CSS
  • Elle est conçue pour être facile à utiliser, hautement portable et offrir de bonnes performances

Caractéristiques principales

1. Mode immédiat (Immediate Mode)

  • Une approche qui simplifie la création d’interfaces GUI et rend le flux du code plus concis
  • Exemple : 
    if ui.button("Save").clicked() {
    my_state.save();
}
  • Il n’est pas nécessaire de stocker l’état du bouton ni d’utiliser des callbacks
  • Le mode immédiat améliore l’ergonomie et réduit la complexité, au prix de légères limites en matière de mise en page et de performances

2. Compatibilité multiplateforme

  • Web : fonctionnement via WebAssembly et WebGL
  • Natif : prise en charge de Mac, Linux, Windows, Android, etc.
  • Possibilité d’intégration avec des moteurs de jeu (par exemple avec Bevy)

3. Intégration avec l’écosystème Rust

  • Fournit le framework officiel eframe :
  • Permet d’écrire des applications web et natives avec le même code
  • Dépendances légères :
  • egui n’utilise qu’un minimum de dépendances Rust comme ab_glyph et ahash
  • Les dépendances plus lourdes sont séparées dans des crates distinctes (egui_extras, etc.)

Fonctionnalités principales

  • Widgets : boutons, sliders, cases à cocher, boutons radio, édition de texte, sélecteur de couleurs, etc.
  • Mise en page : prise en charge des dispositions horizontales, verticales, en colonnes et du retour à la ligne automatique
  • Édition de texte : multiligne, copier-coller, prise en charge des emoji
  • Fenêtres : déplacement, redimensionnement, réduction/fermeture
  • Rendu : texte avec anticrénelage, rendu de formes
  • Accessibilité : prise en charge des lecteurs d’écran via l’intégration d’AccessKit

Avantages et inconvénients

  • Avantages
    • Simplicité : permet d’écrire une GUI avec un code concis, sans callbacks
    • Portabilité : le même code peut s’exécuter sur le web et en environnement natif
    • Ergonomie : aucun problème de synchronisation entre l’état de l’application et l’état de la GUI
  • Inconvénients
    • Complexité de mise en page : la nature du mode immédiat demande un travail supplémentaire pour les layouts complexes
    • Utilisation CPU : comme l’ensemble du layout doit être recalculé à chaque frame, les performances peuvent baisser sur de grandes interfaces

Public visé

  • Développeurs souhaitant créer rapidement une GUI simple
  • Utilisateurs voulant ajouter une GUI à un moteur de jeu ou à un projet basé sur Rust
  • Créateurs d’applications devant prendre en charge à la fois le web et les environnements natifs

Explication complémentaire sur le mode immédiat

  • Contrairement au mode conservé (retained mode) basé sur les callbacks, le mode immédiat traite l’état directement à chaque frame
  • Exemple : if ui.button("Save").clicked() { save(); }
  • Avantage : le flux de code est plus simple et il n’y a pas de problème de synchronisation d’état
  • Inconvénient : le calcul de mise en page est plus complexe et peut affecter les performances sur de grandes interfaces

À lire aussi

1 commentaires

 
GN⁺ 2024-12-27
Avis Hacker News

  • J’ai essayé de comprendre des problèmes de mathématiques en utilisant un framework Rust, mais le cycle edit-compile-run est trop long, ce qui a rendu la tâche difficile. Je me demande si le fait de diviser le projet en modules pourrait améliorer la situation

  • Si le navigateur ne prend pas en charge le rendu sous-pixel, les bibliothèques de rendu d’interface basées sur canvas sont désavantagées par rapport au DOM, sauf sur les appareils à haute résolution. La bibliothèque egui est également consciente de ce problème

  • La page de démo compilée pour le navigateur est techniquement impressionnante, mais il est difficile d’imaginer les possibilités des applications utilisant egui. Je me demande s’il existe des exemples intéressants qui exploitent egui

  • À Noël, en me comportant de façon naughty, j’ai forcé le déballage d’un Option au lieu de faire du pattern matching, ce qui a provoqué une erreur. Cela se produit sur la version mobile de Brave

  • La prise en charge de l’internationalisation est limitée. Par exemple, si l’on colle le mot arabe « hello », il s’affiche sous forme de carrés

  • Je me demande ce que signifie « mode immédiat ». La méthode pour ajouter des widgets à l’interface utilise .add(). Je me demande si le fait d’avoir une API builder fluide pour ces widgets en fait du « mode immédiat »

  • Je me demande comment déboguer ce type d’interface dans un navigateur web. Est-ce qu’on peut le déboguer comme du JavaScript ou du WebAssembly en C++ ?

  • Il y a un problème avec le redimensionnement des fenêtres. Dans l’exemple « Highlighting », si l’on clique sur la zone de saisie dans le coin inférieur droit, la flèche diagonale devient une flèche verticale et il n’est possible de redimensionner que verticalement. Dans d’autres exemples par défaut aussi, on a l’impression qu’un redimensionnement vertical et horizontal simultané devrait être possible, mais le redimensionnement vertical ne fonctionne pas

  • La réactivité à la saisie est très lente. Si l’on tape rapidement, l’entrée ne suit pas. Il est impossible de sélectionner et de copier du texte, ce qui est un gros problème pour une implémentation de GUI personnalisée. Je souhaite à tous de très bonnes fêtes de fin d’année