Interface PyGAME
→ Si vous avez besoin d'aide, n'hésitez pas a vous connecter sur IRC >>> Salon de discussion #arm <<< <-
Introduction et premiers pas
Pygame est une bibliothèque libre multiplate-forme qui facilite le développement d'applications graphiques "temps réel" avec le langage de programmation Python.
Elle est distribuée selon les termes de la licence GNU LGPL.
Construite sur la bibliothèque SDL, elle permet de programmer la partie multimédia (graphismes, son et entrées au clavier, à la souris ou au joystick, d'un écran tactile...), sans se heurter aux difficultés des langages de bas niveaux comme le C et ses dérivés. Afin d'utiliser un langage de haut niveau (en l'occurrence le Python) pour la structure du programme.
Pygame, en plus d'adapter la SDL au Python, fournit également un petit nombre de fonctions spécifiques au développement d'applications graphiques, nous permettant de créer des interfaces graphiques pour votre écran tactile du raspberryPi2 ou 3.
Nous proposons d'afficher une zone avec des éléments graphiques, de détecter des évènements sur certaines zones et déclencher des actions matérielles ou logicielles.
Dans un premier temps vous pouvez développer sur votre pc le code pour la partie graphique, tant que vous ne faites pas appel aux GPIO !
Installation de PyGAME sur Debian/Raspbian/Linux
$ su
# apt-get update
# apt-get upgrade
# apt-get install python-pygame
Dans le cas du RaspberryPi3, j'utilise un écran tactile 7" avec une résolution de 800x480.
Nous aurons besoin d'une font (police) pour notre texte, et vous pouvez vous en procurer en vérifiant les copyrights ici : https://www.dafont.com/fr/
Adoptons une convention pour l'architecture de nos dossiers :
Dossier_Racine : (contient les programmes python) | +-- Dossier_Fonts : (contient les polices/fonts utilisées) | +-- Dossier_Img : (contient les images "png" affichées sur notre interface) | +-- Dossier_Src : (contient les sources vectorielles des images crées. Fichiers SVG crées avec le logiciel gratuit Inkscape)
Allons y !
exemple :
1 Création de notre premier affichage texte
Voir l'exemple >>> Hello World <<< pour afficher un texte.
Exemple avancé: l'affichage d'un Timer partie 1 le mode texte !
2 Éléments graphiques
Les éléments graphiques sont empilés les uns sur les autres par ordre chronologique.
La dernière image chargée cachant la première chargée, l'utilisation du format PNG nous permettra de gérer la transparence si besoin.
Voir l'exemple >>> Hello World Graphique <<< pour insérer une image !
