truc2geek

2015/03/22

Processing : exporter des images

Filed under: Processing — Étiquettes : , , , — truc2geek @ 13:31

Processing permet de dessiner à l’écran par la programmation, et aussi d’enregistrer le résultat sous forme de fichier image, « .png » par ex.
C’est cette possibilité d’exporter des images, qu’on va voir aujourd’hui.

Démo

La formule magique tient en 4 lettres : « save ».

Voici un code minimaliste, qui se contente de dessiner un carré et exporter une image :
01.png

On lance l’exécution, voici le résultat :
02.png
Le fichier « Image.png » a bien été créé, au même niveau que le fichier « .pde ».

Vérifions l’image :
Le cadre bleu n’existe pas dans l’image, je l’ai ajouté pour bien délimiter l’image dans la « visionneuse Windows » :
03.png

Voici le lien vers ce sketche : Appli1.

Exporter plusieurs images, au fur et à mesure de l’exécution

Si on a besoin d’exporter plusieurs images, il faut nommer chaque image différemment.
On crée une fonction exporterImage(), qui va inclure un numéro dans le nom du fichier ; ce numéro sera stocké dans une variable publique, qui sera incrémentée à chaque export.

Dans le code ci-dessous, le carré se déplace vers la droite, et on exporte une image tous les 10 cycles.
Note : pour que toutes les images (jusqu’à 99 inclus) aient un nom de fichier de la même longueur, si le compteur est inférieur à 10 on ajoute un zéro devant le numéro, pour avoir : « Image01.png », « Image02.png » et ainsi de suite.

J’ai modifié le « frameRate », qui correspond tout simplement au nombre de cycles par seconde. Quand cette valeur est définie à 40, Processing exécute 40 fois par seconde le code de la fonction draw().
Or ici, pour faire une capture d’écran vidéo qui montre en même temps le sketche, et l’apparition des fichiers image dans le dossier, il fallait un rythme plus lent pour que ce soit plus clair. La valeur 5 est parfaite.
08.png

Voici la capture d’écran vidéo ; et, comment dire ça n’a rien à voir avec Processing, mais admirez l’image mise en fonds d’écran, et si vous ne connaissez pas encore ce groupe, Jim Jones Revue, découvrez-le!

Voici les premières images exportées :
Image01.png
Image02.png
Image03.png

Voici le lien vers cette 2e appli.

Exemple concret d’utilisation

Oui parce qu’à ce stade, vous pensez peut-être : « Ok, je peux exporter des images, mais dans la vraie vie, ça sert à quoi? ».

J’entends cette interrogation, et j’ai deux réponses :

  • Comment pouvez-vous être sur que la vie que vous pensez réelle, est vraiment plus réelle que ce code Processing? Même Platon a eu un doute.
  • Cette fonctionnalité permet de créer des icônes pour une application ou un site web.

Un exemple, concret donc, avec deux flèches : une vers la gauche, une vers la droite :
07.png

L’instruction « noLoop » permet d’exécuter la fonction draw() une seule fois, et pas en boucle.
Sur cette impression écran on ne voit pas le code de la fonction exporterImage(), mais c’est exactement le même que dans Appli2.

Voici les deux images générées :
11.png

Voici le lien vers ce code, nommé « Appli3 ».

L’objectif du jour est atteint, a+!

Publicités

Laisser un commentaire »

Aucun commentaire pour l’instant.

RSS feed for comments on this post. TrackBack URI

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s

Propulsé par WordPress.com.

%d blogueurs aiment cette page :