fbpixel
Synthétiseur de voix eSpeak sur Raspberry Pi

Synthétiseur de voix eSpeak sur Raspberry Pi

Il est possible de faire parler votre Raspberry Pi en utilisant un synthétiseur de voix comme eSpeak afin d ‘en faire un assistant intelligent. Grâce à ce tutoriel vous pourrez faire parler votre robot ou votre application.

Matériel

  • Raspberry Pi 3 avec Raspberry Pi OS
  • Connexion internet et accès distant

Vérifier les périphériques Audio

Nous allons tout d’abord vérifier les périphériques audio disponibles

aplay -l

Sélectionner le périphérique audio

Par défaut le son sort sur le port jack ou HDMI. Si vous souhaitez brancher un casque il vous faut sélectionner la sortie correspondante sur l’interface graphique du Raspberry Pi ou avec sudo raspi-config.

Vérifier l’audio

Nous allons dans un premier temps vérifier que l’audio fonctionne correctement et que le périphériques audio est bien pris en compte.

aplay /usr/share/sounds/alsa/*

Installation du synthétiseur vocale espseak

sudo apt-get install espeak

Pour tester l’installation espeak, il suffit de rentrer la commande suivante:

espeak "Hello World"

Vous pouvez aussi installer le package python et l’utiliser directement dans un script.

sudo apt-get install python3-espeak
from espeak import espeak
espeak.synth("hello world")

Pour obtenir la liste des voix disponiibles, entrez la commande

espeak --voices

Utiliser eSpeak dans un script Python avec Subprocess

Vous pouvez lancer des commandes shell à partir d’un script Python en utilisant la librairie subprocess.

from time import sleep
import subprocess

def say(something, voice='fr+f1'):
	print("espeak -v {} {}".format(voice,something))
	subprocess.call(['espeak', '-v%s' % (voice), something])
    
text=[u"bonjour",u"aurevoir",u"a bientot", u"sa va", u"merci"]
textf=u"bienvenu admine, comment allez-vous aujourd'hui?"

for t in text:
	say(t)
	sleep(0.5)

say(textf)

Install pyttsx3

Pour utiliser le synthétiseur vocale avec Python nous allons utiliser le paquet pyttsx3

Pour installer le paquet Python pyttsx3, entrez la commande suivante:

pip3 install pyttsx3

Choisissez la voix que vous souhaitez

for i,voice in enumerate(voices):
	print("----------------{}".format(i))
	print(voice.id)
	engine.setProperty('voice', voice.id)  # changes the voice
	print(voice.age)
	print(voice.gender)
	print(voice.languages)

Code txt2speech

#!/usr/bin/python3.4
# -*-coding:Utf-8 -*

from time import sleep
import pyttsx3 as pyttsx
engine = pyttsx.init()
voices = engine.getProperty('voices')

print(voices)

engine.setProperty('voice', voices[0].id)  # changes the voice
	
#engine.setProperty('voice', voices[14].id)  # changes the voice
voiceNum=0
#Fr=[0 1 6 7 8 14] #6 = AC
"""
for voice in voices:
	print(voiceNum)
	voiceNum=voiceNum+1
	print(voice.id)
	engine.setProperty('voice', voice.id)  # changes the voice
	print(voice.age)
	print(voice.gender)
	print(voice.languages)
	print(voice.name)
"""

text=[u"bonjour",u"aurevoir",u"a bientot", u"sa va", u"merci"]
textf=u"bienvenu admine, comment allez-vous aujourd'hui?"

#rate = engine.getProperty('rate')
engine.setProperty('rate', 120)

#volume = engine.getProperty('volume')
#engine.setProperty('volume', volume)

for t in text:
	engine.say(t)
	sleep(0.5)

engine.say(textf)


engine.runAndWait()

Vous devriez entendre votre Rapsberry Pi parler!

Ajouter d’autres voix

Il vous est possible de créer et d’ajouter une voix personnalisée en vous inspirant de voix existantes et en lisant bien la documentation. Cela vous permettra de vous concentré sur certaines phrases et prononciation. Puis, une fois que vous maitrisez le paramétrage, vous pourrez à terme avoir une voix qui vous convient.

Améliorer le résultat avec les voix MBROLA

Vous pouvez utiliser un autre synthétiseur de voix un peu plus performant que eSpeak et installer de nouvelle voix avec MBROLA. Dans notre cas, nous installons une voix féminine française. Vous pouvez trouver la voix qui vous convient dans la liste des voix disponibles.

Vérifier si mbrola estt. La commande suivante vous donnera les voix disponibles

apt-cache search mbrola
mkdir espeak
cd espeak
wget https://raspberry-pi.fr/download/espeak/mbrola3.0.1h_armhf.deb -O mbrola.deb
sudo dpkg -i mbrola.deb
rm mbrola.deb

Une fois mbrola installé, vous pouvez installer de nouvelles voix

sudo apt-get install mbrola-fr4

espeak -v mb-fr4 "bonjour admin, comment allez-vous?"

N.B.: Pour installer le paquet mbrola, j’ai dû mettre à jour l’OS vers la version 11 (bullseye). Vous pouvez vérifier la version de l’os avec la commande cat /etc/os-release

Visiblement, les voix mbrola ne peuvent pas être utilisées avec pyttsx3. Nous utilisons donc subprocess

from time import sleep
import subprocess

def say(something, voice='mb-fr4'):
	print("espeak -v {} {}".format(voice,something))
	subprocess.call(['espeak', '-v%s' % (voice), something])
    
text=[u"bonjour",u"aurevoir",u"a bientot", u"sa va", u"merci"]
textf=u"bienvenu admine, comment allez-vous aujourd'hui?"

for t in text:
	say(t)
	sleep(0.5)

say(textf)

Sortie audio HMDI

Si vous souhaitez utiliser la sortie audio HDMI et qu’il n’y a aucun son, il peut être nécessaire de modifier le fichier config.txt

sudo nano /boot/config.txt

Décommentez la ligne hdmi_drive=2

Sources

Accès à distance au Raspberry Pi avec NoMachine

Accès à distance au Raspberry Pi avec NoMachine

Nous allons voir dans ce tutoriel comment accéder au bureau du Raspberry Pi à distance à l’aide de NoMachine. Il peut être très intéressant de communiquer avec son microordinateur Raspberry Pi à distance que ce soit pour éviter de se promener avec un écran, un clavier et une souris ou si vous l’utilisez dans un mode headless. Cela permet aussi de profiter des logiciels et de la navigation internet de l’ordinateur tout en travaillant sur le Raspberry Pi.

Matériel

  • Ordinateur
  • Raspberry Pi 3B+ (Configurer avec Raspbian et connecté au Wifi)

Installation de NoMachine sur Raspberry Pi

Avant de télécharger NoMachine, vérifiez la configuration de votre Raspberry Pi en tapant uname -a ou cat /proc/cpuinfo

pi@raspberrypi:~ $ cat /proc/cpuinfo
processor	: 0
model name	: ARMv7 Processor rev 4 (v7l)
BogoMIPS	: 38.40
Features	: half thumb fastmult vfp edsp neon vfpv3 tls vfpv4 idiva idivt vfpd32 lpae evtstrm crc32 
CPU implementer	: 0x41
CPU architecture: 7
CPU variant	: 0x0
CPU part	: 0xd03
CPU revision	: 4

Télécharger NoMachine à partir de ce lien. Choisissez le paquet compatible avec votre version de Raspberry pi et d’OS

Vous pouvez ensuite installer le logiciel à l’aide du terminal dans le dossier de téléchargement

$ cd Downloads
$ sudo dpkg -i nomachine_4.6.12_1_armv6hf.deb

Une fois le logiciel installé, l’icône devrait apparaitre en haut à droite du bureau

Installation de NoMachine sur votre ordinateur

Vous pouvez télécharger le logiciel d’accès NoMachine en suivant ce lien.

Se connectez à distance au Raspberry Pi

Tout d’abord, dans le menu NoMachine du Raspberry Pi, sélectionnez l’option “bureau partagé”.

Si l’ordinateur et le Raspberry Pi sont connectés sur le même réseau, le Raspberry Pi devrait être visible lorsque vous lancez le logiciel sur l’ordinateur.

Le logiciel demande le login et mot de passe du Raspberry Pi pour autoriser la connexion (par défaut login pi, mdp: raspberrypi).

Une fois le mot de passe et login sont renseignés, le bureau distant devrait s’afficher.

Pour configurer la fenêtre et les paramètres de NoMachine, vous pouvez aller dans le menu qui se trouve sur le Raspberry Pi

Vous avez alors accès à différentes option sur l’affichage l’utilisation du microphone, périphérique, etc.

Issue: Configurer la langue du clavier NoMachine

Dans certains cas, le clavier virtuel ^peut être mal configuré et sortir “qwerty” à la ^place de “azerty” alors que la configuration semble correcte sur le Raspberry Pi et sur votre ordinateur. Pour résoudre ce problème, entrez la commande suivante dans le terminal avec comme option la langue désirée (ici fr pour French).

setxkbmap -model pc105 -layout fr

Vous devez exécuter cette commande à chaque démarrage du Raspberry Pi. Une autre possibilité est d’ajouter la commande au démarrage du serveur pour l’exécuter automatiquement

sudo nano /etc/xdg/lxsession/LXDE-pi/autostart

et placer la ligne de commande à la fin du fichier

Applications

Sources

Programmez un ESP8266 avec MicroPython

Programmez un ESP8266 avec MicroPython

Nous avons vu que le NodeMCU ESP8266 était facilement programmable à l’aide de l’IDE Arduino. Nous allons voir comment le programmer avec MicroPython. L’intérêt d’utiliser Python pour programmer un ESP8266 est de l’utiliser à son plein potentiel.

Avant de suivre ce tutoriel, il vous faut, au préalable, installer Python 3.

Nous allons voir dans ce tutoriel comment configurer l’ESP8266 comment utiliser un terminal pour tester des commandes Python. Enfin, nous verrons deux méthodes pour charger et lancer des scripts Python sur le microcontrôleur.

Présentation de MicroPython

MicroPython est une implémentation de Python 3 créée pour le fonctionner dans l’environnement des microcontrôleurs et leurs contraintes. Il possède un sous-ensemble des librairies Python ainsi que des librairies pour s’interfacer avec le hardware de bas niveau ainsi que les interfaces réseau. (ex: Wifi)

Cartes supportant MicroPython:

  • ESP32 Boards (ex: NodeMCU ESP32)
  • PyBoard
  • Micro:Bit
  • Teensy 3.X
  • WiPy – Pycom

Installer le firmware sur l’ESP8266

Pour utiliser MicroPython, nous allons effacer la mémoire flash de l’ESP8266 et installer le firmware. Pour cela, nous allons nous servir de l’outil esptool (.py ou .exe selon ce que vous souhaitez utiliser)

  • Installer esptool.py
python3 -m pip install esptool

ou esptool.exe (disponible a l’installation du package esp sur Arduino IDE)

  • Effacer la mémoire flash (Attention: le nom du port peut être différent du vôtre)
python3 -m esptool --port COM9 erase_flash
  • Télécharger le firmware, puis, entrer la ligne de code suivante (Attention: le nom du port et l’adresse du fichier peuvent être différents des vôtres)
python3 -m esptool --port COM9 --baud 460800 write_flash --flash_size=detect 0 C:\Users\ADMIN\Downloads\esp8266-20210202-v1.14.bin

Pour pouvoir communiquer et programmer l’ESP avec MicroPython, il nous faut installer un terminal. Nous allons voir, ici, l’utilisation de PuTTy et de TeraTerm.

Installer le Terminal TeraTerm sur Windows

Télécharger et installer TeraTerm

Ouvrir TeraTerm puis sélectionner le port série correspondant au microcontrôleur.

Configurer, ensuite, la communication série dans Setup> Serial Port …

Vous pouvez maintenant utiliser le terminal pour entrer des commandes Python et les exécuter sur l’ESP8266

Installation du terminal PuTTy

Télécharger et installer PuTTy

Ouvrir Putty puis sélectionner le port série correspondant au microcontrôleur.

Configurer, ensuite, la communication série. Pour pouvoir communiquer avec l’ESP8266, il faut sélectionner None dans Flow control sous Serial

Vous pouvez maintenant utiliser le terminal pour entrer des commandes Python et les exécuter sur l’ESP8266

Les terminaux PuTTy et TeraTerm sont deux bonnes options pour tester quelques commandes Python mais pas pour réaliser un programme complet.

Créer un script Python et le télécharger avec ampy

Nous allons écrire un code simple afin de tester le téléversement d’un code sur ESP8266. Il y a deux fichiers qui sont traités différemment par l’ESP8266 : boot.py et main.py. Par défaut, seul le boot.py est présent. Le boot.py s’exécute en premier puis le main.py est exécuté à son tour. Si vous souhaitez créer un script qui s’exécute au démarrage vous devez l’appeler main ou le lancer dans main. Si vous ne souhaitez pas qu’il s’exécute au démarrage appellez-le autrement.

import sys
import time

def main():
    print("Program is running ")
    time.sleep(0.5)

if __name__=="__main__":
  print("{} initialized".format(sys.platform))
  while(1):
    try:
      main()
    except KeyboardInterrupt:
      print("Program stopped")
      sys.exit(0)

Nous allons ensuite installer ampy qui va nous permettre de charger un fichier sur le microcontrôleur.

python3 -m pip install adafruit-ampy

Une fois ampy installé, vous pouvez l’utiliser dans une invite de commande avec la fonction “put” pour charger un fichier en spécifiant son chemin et son nom.

ampy -d 0.5 --port COM9 put <file_directory>\main.py

N.B.: Si vous rencontrez l’erreur “ampy.pyboard.PyboardError: could not enter raw repl”, vous pouvez augmenter le délai à 1 ou 2 (i,e “-d 1” ou “-d 2”)

Si vous vous connectez à l’ESP8266 avec un terminal, vous verrez alors le programme qui s’exécute. (vous pouvez arrêter le script avec Ctrl+C)

Le script main.py va s’exécuter à chaque redémarrage. Pour le supprimer, entrez la commande suivante dans le terminal

import os
os.remove('main.py')

Utilisation de l’IDE uPyCraft

Lorsqu’on développe un code et qu’il est nécessaire de le tester, il est compliqué de passer par l’invite de commande pour le charger à chaque essai. Il existe un IDE pour Python, similaire à l’IDE Arduino: uPyCraft que vous pouvez utiliser comme éditeur et comme terminal pour vous interfacer avec le microcontrôleur.

  • Dans Tools> Preferences, vérifiez la configuration du port série
  • Dans Tools>Serial, sélectionnez le port série utilisé par le microcontrôleur

Une fois le microcontrôleur connecté à l’interface, vous pouvez utiliser la console comme terminal

Vous pouvez aussi créer et éditer un fichier contenant le script Python. Une fois le code écrit, vous pouvez le charger et l’exécuter en appuyant sur F5. Pour valider le téléversement du code, il peut être nécessaire d’appuyer sur le bouton reset de la carte. Vous pouvez arrêter le code en appuyant sur Ctrl+C dans la console.

N.B.: Vous pouvez redémarrer le code sans faire un reset, en entrant la commande

exec(open('main.py').read(), globals())

Supprimer le fichier

Si vous souhaitez que le script ne se déclenche pas au redémarrage, il faut supprimer le code main.py en utilisant la commande dans un terminal ou dans l’IDE

os.remove('main.py')

Remettre la configuration par défaut

Pour pouvoir programmer le microcontrôleur avec Arduino IDE, vous devez supprimer le fichier main.py s’il existe et téléverser un code Arduino. Cela aura pour effet de recharger le bootloader dans la flash.

Pour utiliser de nouveau MicroPython, il faudra effacer la flash et charger le firmware.

Sources

Programmez un ESP8266 avec MicroPython

Programmez un ESP32 avec MicroPython

Nous avons vu que le NodeMCU ESP32 était facilement programmable à l’aide de l’IDE Arduino. Nous allons voir comment le programmer avec MicroPython. L’intérêt d’utiliser Python pour programmer un ESP32 est de l’utiliser à son plein potentiel.

Avant de suivre ce tutoriel, il vous faut, au préalable, installer Python 3.

Nous allons voir dans ce tutoriel comment configurer l’ESP32, comment utiliser un terminal pour tester des commandes Python. Enfin, nous verrons deux méthodes pour charger et lancer des scripts Python sur le microcontrôleur.

Présentation de MicroPython

MicroPython est une implémentation de Python 3 créée pour le fonctionner dans l’environnement des microcontrôleurs et leurs contraintes. Il possède un sous-ensemble des librairies Python ainsi que des librairies pour s’interfacer avec le hardware de bas niveau ainsi que les interfaces réseau. (ex: Wifi)

Cartes supportant MicroPython:

  • ESP8266 Boards (ex: NodeMCU ESP8266)
  • PyBoard
  • Micro:Bit
  • Teensy 3.X
  • WiPy – Pycom
  • Raspberry Pi Pico

Installer MicroPython avec Thonny IDE

La méthode la plus simple pour installer et utiliser MicroPython sur ESP32 (et autre microcontrôleur) est d’utiliser le logiciel Thonny IDE. En effet vous pouvez installer le firmware à partir de l’interface du logiciel et l’utiliser pour développer votre code et le téléverser sur la carte.

Télécharger le firmware correspondant à votre microcontrôleur.

Pour installer le firmware, allez dans le menu “Run” et sélectionnez “Select interpreter…”

Appuyer ensuite sur “Install or update firmware” en bas à droite

Sélectionnez votre carte et le fichier contenant le firmware précédemment téléchargé. Puis appuyez sur “Install”

Une fois le firmware installé, vous pouvez entrer des commandes Python dans la console.

Vous pouvez aussi écrire votre script et le lancer sur la carte depuis Thonny. Copiez le code suivant dans l’éditeur

import sys
import time

def main():
    print("Program is running ")
    time.sleep(0.5)

if __name__=="__main__":
  print("{} initialized".format(sys.platform))
  while(1):
    try:
      main()
    except KeyboardInterrupt:
      print("Program stopped")
      sys.exit(0)

Pour lancer le script, allez dans “Run>Run current script” ou F5. Renommer le script main.py

Le code devrait se lancer automatiquement

Lorsque vous redémarrez l’IDE, vous pouvez ouvrir les fichiers présents sur la carte que vous pouvez retrouver avec la commande

import os
os.listdir()

N.B.: Pour pouvoir programmer le microcontrôleur avec Arduino IDE, vous devez téléverser un code Arduino. Cela aura pour effet de recharger le bootloader dans la flash.

Installer le firmware sur l’ESP32 par lignes de commande

Pour utiliser MicroPython, nous allons effacer la mémoire flash de l’ESP32 et installer le firmware. Pour cela, nous allons nous servir de l’outil esptool (.py ou .exe selon ce que vous souhaitez utiliser)

  • Installer esptool.py
python3 -m pip install esptool

ou esptool.exe (disponible a l’installation du package esp sur Arduino IDE)

  • Effacer la mémoire flash (Attention: le nom du port peut être différent du vôtre)
python3 -m esptool --chip esp32 --port COM9 erase_flash
  • Télécharger le firmware, puis, entrer la ligne de code suivante (Attention: le nom du port et l’adresse du fichier peuvent être différents des vôtres)
python3 -m esptool --chip esp32 --port COM9 --baud 460800 write_flash -z 0x1000 C:\Users\ADMIN\Downloads\esp32-idf3-20210202-v1.14.bin

Pour pouvoir communiquer et programmer l’ESP avec MicroPython, il nous faut installer un terminal ou un IDE. Nous allons voir, ici, l’utilisation de PuTTy et de TeraTerm.

Utilisation de différents outils pour communiquer et programmer votre ESP32

Une fois votre microcontrôleur configuré avec Micropyhton, vous pouvez utiliser différents outils pour programmer en Python. Des terminaux comme TeraTerm ou Putty et des IDE comme VS Code, uPyCraft ou Thonny.

Installer le Terminal TeraTerm sur Windows

Télécharger et installer TeraTerm

Ouvrir TeraTerm puis sélectionner le port série correspondant au microcontrôleur.

Configurer, ensuite, la communication série dans Setup> Serial Port …

Vous pouvez maintenant utiliser le terminal pour entrer des commandes Python et les exécuter sur l’ESP32

Installation du terminal PuTTy

Télécharger et installer PuTTy

Ouvrir Putty puis sélectionner le port série correspondant au microcontrôleur.

Configurer, ensuite, la communication série

Vous pouvez maintenant utiliser le terminal pour entrer des commandes Python et les exécuter sur l’ESP32

Les terminaux PuTTy et TeraTerm sont deux bonnes options pour tester quelques commandes Python mais pas pour réaliser un programme complet.

Créer un script Python et le télécharger avec ampy

Nous allons écrire un code simple afin de tester le téléversement d’un code sur ESP32. Il y a deux fichiers qui sont traités différemment par l’ESP32 : boot.py et main.py. Par défaut, seul le boot.py est présent. Le boot.py s’exécute en premier puis le main.py est exécuté à son tour. Si vous souhaitez créer un script qui s’exécute au démarrage vous devez l’appeler main ou le lancer dans main. Si vous ne souhaitez pas qu’il s’exécute au démarrage appelez-le autrement.

import sys
import time

def main():
    print("Program is running ")
    time.sleep(0.5)

if __name__=="__main__":
  print("{} initialized".format(sys.platform))
  while(1):
    try:
      main()
    except KeyboardInterrupt:
      print("Program stopped")
      sys.exit(0)

Nous allons ensuite installer ampy qui va nous permettre de charger un fichier sur le microcontrôleur.

python3 -m pip install adafruit-ampy

Une fois ampy installé, vous pouvez l’utiliser dans une invite de commande avec la fonction “put” pour charger un fichier en spécifiant son chemin et son nom.

ampy -d 0.5 --port COM9 put <file_directory>\main.py

N.B.: Si vous rencontrez l’erreur “ampy.pyboard.PyboardError: could not enter raw repl”, vous pouvez augmenter le délai à 1 ou 2 (i,e “-d 1” ou “-d 2”)

Si vous vous connectez à l’ESP32 avec un terminal, vous verrez alors le programme qui s’exécute. (vous pouvez arrêter le script avec Ctrl+C)

Le script main.py va s’exécuter à chaque redémarrage. Pour le supprimer, entrez la commande suivante dans le terminal

import os
os.remove('main.py')

Utilisation de l’IDE uPyCraft

Lorsqu’on développe un code et qu’il est nécessaire de le tester, il est compliqué de passer par l’invite de commande pour le charger à chaque essai. Il existe un IDE pour Python, similaire à l’IDE Arduino: uPyCraft que vous pouvez utiliser comme éditeur et comme terminal pour vous interfacer avec le microcontrôleur.

  • Dans Tools> Preferences, vérifiez la configuration du port série
  • Dans Tools>Serial, sélectionnez le port série utilisé par le microcontrôleur

Une fois le microcontrôleur connecté à l’interface, vous pouvez utiliser la console comme terminal

Vous pouvez aussi créer et éditer un fichier contenant le script Python. Une fois le code écrit, vous pouvez le charger et l’exécuter en appuyant sur F5. Pour valider le téléversement du code, il peut être nécessaire d’appuyer sur le bouton reset de la carte. Vous pouvez arrêter le code en appuyant sur Ctrl+C dans la console.

N.B.: Vous pouvez redémarrer le script sans faire un reset, en entrant la commande

exec(open('main.py').read(), globals())

Supprimer le fichier

Si vous souhaitez que le script ne se déclenche pas au redémarrage, il faut supprimer le code main.py en utilisant la commande dans un terminal ou dans l’IDE

import os
os.remove('main.py')

Remettre la configuration par défaut

Pour pouvoir programmer le microcontrôleur avec Arduino IDE, vous devez supprimer le fichier main.py s’il existe et téléverser un code Arduino. Cela aura pour effet de recharger le bootloader dans la flash.

Pour utiliser de nouveau MicroPython, il faudra effacer la mémoire flash et charger le firmware.

Sources

Créer une interface graphique avec Processing

Créer une interface graphique avec Processing

Nous allons voir dans ce tutoriel comment construire une interface graphique avec Processing. Il existe plusieurs outils pour créer une interface graphique:

  • langage de programmation (C, C++, Python, Java, etc.)
  • Langage Web (HTML/CSS/PHP/Javascript)
  • Logiciel (LabView, Processing, etc.)

Le logiciel Processing utilise un langage similaire à celui d’Arduino et permet de créer des logiciel pour PC ou des application pour smartphone. Ce qui en fait un outil très puissant et simple de prise en main lorsqu’on travaille déjà avec des Arduino.

Installation de Processing

Rendez vous sur le site de téléchargement de Processing.org et téléchargez la version qui correspond à votre ordinateur.

Vous pouvez ensuite décompresser l’archive zip à l’endroit où vous souhaitez enregistrer le logiciel. Dans le dossier dézippé, vous trouverez un fichier EXE exécutable. Double-cliquez sur ce fichier pour ouvrir Processing.

Code simple

Comme pour Arduino, nous utiliserons une fonction setup qui s’exécutera une seule fois au démarrage du programme et une fonction draw qui s’exécutera en boucle comme la fonction loop(). Nativement, il y a des fonctions pour gérer la fenêtre du logiciel, afficher du texte ou des images, créer des formes géométriques et gérer les interactions du clavier et de la souris.

color ac_black=color(51,51,51);
color ac_green=color(58,170,53);

PFont f1;
PImage logo;

void setup()
{
  
  size(800, 600);   // set the window size 
 
  surface.setTitle("AranaCorp - Simple Interface"); // set window title
  background(0); // set background to black
  //background(ac_black); // set background to color color
  smooth();
  
  logo = loadImage("https://www.aranacorp.com/wp-content/uploads/logo-100.png");
  //logo = loadImage("/img/logo-araignee1-RVB-72dpi.png");
  surface.setIcon(logo); //ad app icone
  
  image(logo,width-100,0,100,100); //add image
  
  // text
  f1 = createFont("Arial",30,true);
  textFont(f1);
  fill(ac_green);
  textAlign(CENTER); //RIGHT LEFT
  text("Hello world",width/2,height/2);
  
  
  // line
  stroke(255);     //stroke color
  strokeWeight(4);
  line(10,10,width/2, height*2/3); 
      
  // Rectangle
  fill(ac_black,100);
  stroke(255,0,0);
  strokeWeight(2);
  rectMode(CENTER);
  rect(width/2,height/2,width*2/3,height*2/3);
  
  // Circle
  fill(ac_black,100);
  stroke(0,0,255);
  strokeWeight(2);
  circle(width/2,height/2,width*2/3);
  println("Interface initialized");
}

void draw(){
  println("draw is running!");
  delay(500);
}

Résultat

Créer une interface responsive

Dans l’interface précédente, les dimensions de la fenêtre sont figés. Si vous souhaitez pouvoir modifier les dimensions de la fenêtre et que l’interface apparaisse correctement, il va falloir faire un design responsive! Pour cela les dimensions critiques doivent être définies en fonction des dimensions de la fenêtre width et height. De plus, le code définissant les formes doit être placer dans la fonction draw() afin de prendre ne compte le changement de dimensions.

Code Responsive

color ac_black=color(51,51,51);
color ac_green=color(58,170,53);

PFont f1;
PImage logo;

void setup()
{
  
  size(800, 600);   // set the window size 
  surface.setResizable(true);
  surface.setTitle("AranaCorp - Simple Interface"); // set window title
  background(0); // set background to black
  //background(ac_black); // set background to color color
  smooth();
  
  logo = loadImage("https://www.aranacorp.com/wp-content/uploads/logo-100.png");
  //logo = loadImage("/img/logo-araignee1-RVB-72dpi.png");
  
  println("Interface initialized");
}

void draw(){
  drawInterface();
  println("width : "+str(width));
  println("height : "+str(height));
  
}

void drawInterface(){
  surface.setIcon(logo); //ad app icone
  
  image(logo,width-100,0,100,100); //add image
  
  // text
  f1 = createFont("Arial",30,true);
  textFont(f1);
  fill(ac_green);
  textAlign(CENTER); //RIGHT LEFT
  text("Hello world",width/2,height/2);
  
  
  // line
  stroke(255);     //stroke color
  strokeWeight(4);
  line(10,10,width/2, height*2/3); 
      
  // Rectangle
  fill(ac_black,100);
  stroke(255,0,0);
  strokeWeight(2);
  rectMode(CENTER);
  rect(width/2,height/2,width*2/3,height*2/3);
  
  // Circle
  fill(ac_black,100);
  stroke(0,0,255);
  strokeWeight(2);
  circle(width/2,height/2,width*2/3);
}

Résultat

Si on modifie les dimensions de la fenêtre, les formes géométriques change de taille et de position également. La taille du texte et de l’image ne sont pas modifiés car ils ne dépendent pas de la taille de la fenêtre.

Utilisation de la libraire controlP5

Pour créer une interface avec des boutons ou des zones de texte, vous pouvez créer vos propres objets avec des classes. Il existe des librairies pour vous simplifier la vie comme la librairie ControlP5 qui contient des widgets.

  • bouton
  • zone de texte
  • menu déroulant
  • case à cocher
import controlP5.*;
ControlP5 cp5;

color ac_black=color(51, 51, 51);
color ac_green=color(58, 170, 53);

PFont f1, f2;
PImage logo;

Button btn;
ScrollableList sl;
CheckBox chck;
Textfield txt;

void setup()
{
  cp5 = new ControlP5(this);
  size(800, 600);   // set the window size 
  surface.setTitle("AranaCorp - Simple Interface"); // set window title

  logo = loadImage("https://www.aranacorp.com/wp-content/uploads/logo-100.png");
  //logo = loadImage("/img/logo-araignee1-RVB-72dpi.png");

  f1 = createFont("Arial", 30, true);
  f2 = createFont("Arial", 15, true);

  drawInterface();
  drawWidgets();

  println("Interface initialized");
}

void draw() {

}

void drawInterface() {
  background(0); // set background to black
  //background(ac_black); // set background to color color
  smooth();

  surface.setIcon(logo); //ad app icone

  image(logo, width-100, 0, 100, 100); //add image

  // text
  textFont(f1);
  fill(ac_green);
  textAlign(CENTER); //RIGHT LEFT
  text("AC Processing GUI", width/2, 50);

  // line
  stroke(255);     //stroke color
  strokeWeight(4);
  line(100, 50+10, width-100, 50+10); 

  // Rectangle
  fill(ac_black, 100);
  stroke(ac_green);
  strokeWeight(2);
  rectMode(CENTER);
  rect(width/2, height/2+30, width-40, height-120);
}

void drawWidgets() {
  // Button
  fill(ac_black, 100);
  stroke(ac_green);
  strokeWeight(2);
  btn=cp5.addButton("Click")
    .setValue(26)
    .setPosition(width/2-80/2, 150)
    .setSize(80, 25)
    .setColorBackground( color( 200, 0, 0 ) ) //default color
    .setColorForeground( color( 255, 0, 0 ) ) // mouse-over
    .setColorActive( color(0, 150, 0 ) ); //button pressed 

  //Scrollable List
  String clist[]={"COM1", "COM2", "COM3"};
  sl=cp5.addScrollableList("COM")
    .setPosition(width/2.-200/2, 200)
    .setSize(200, 100)
    .addItems(clist)
    .setItemHeight(22)
    .setBarHeight(20)
    .setBackgroundColor(color(190))
    .setColorBackground(color(60))
    .setColorActive(color(255, 128))
    .setFont(f2)
    .close() 
    // .setType(ScrollableList.LIST) // currently supported DROPDOWN and LIST
    ;
  sl.getCaptionLabel().getStyle().marginLeft = 3;
  sl.getCaptionLabel().getStyle().marginTop = 3; 


  // Checkbox
  chck = cp5.addCheckBox("checkBox")
    .setPosition(width/2-10, 250)
    //.setColorBackground(color(255))
    .setColorForeground(color(255))
    .setColorActive(ac_green)
    .setColorLabel(color(255))
    .setSize(20, 20)
    .setItemsPerRow(1)
    .setSpacingColumn(30)
    .setSpacingRow(20)
    .addItem("enable", 1)
    ;   

  // Text field
  txt=cp5.addTextfield("input")
    .setPosition(width/2-100, 300)
    .setSize(200, 40)
    .setFont(f2)
    .setFocus(true)
    .setColorBackground(color(255, 255, 255))
    .setColor(color(0))
    ;
}

public void Click(int theValue) {
  println("a button was clicked: "+theValue);
}

void COM(int n) {
  print("ScrollableList event :  ");
  println(n, cp5.get(ScrollableList.class, "COM").getItem(n).get("name"));

  drawInterface();
}

void checkBox(float[] a) {
  print("Checkbox event :  ");
  println(a);
}

public void input(String theText) {
  // automatically receives results from controller input
  println("a textfield event : "+theText);
}

Interface initialized
ScrollableList event :  0 COM1
ScrollableList event :  2 COM3
Checkbox event :  [0] 1.0
Checkbox event :  [0] 0.0
a textfield event : qegert
a button was clicked: 26

Bonus: Créer un fichier executable .EXE

Une fois que votre interface est développée, il est facile de la compiler et de la partager en utilisant la fonction “Export” du logiciel Processing. Pour cela allez dans le menu “Fichier” et sélectionnez “Export…”. Vous pouvez ensuite choisir l’OS que vous souhaitez et si vous voulez rajouter une distribution de Java dans l’exécutable.

Deux dossiers vont apparaitre dans le dossier du script dans lequel se trouve des exécutables pour les versions 32 et 64bits de Windows.

De cette manière, vous pourrez créer et partager facilement des interface graphique avec Processing.

Applications

  • Développer des interfaces graphiques pour communiquer via le port USB avec des Arduino, Raspberry Pi et NodeMCU
  • Créer des applications pour smartphone et communiquer via Bluetooth avec les cartes type Arduino
  • Créer des interfaces graphiques pour communiquer sans-fil avec des Arduino, Raspberry Pi et NodeMCU

Sources