NOMBRES - Curiosités, théorie et usages

 

Accueil                           DicoNombre            Rubriques           Nouveautés      Édition du: 28/01/2022

Orientation générale        DicoMot Math          Atlas                   Actualités                       M'écrire

Barre de recherche          DicoCulture              Index alphabétique        Références      Brèves de Maths

      

Informatique

 

Débutants

Programmation

Programmation

 

Glossaire

Informatique

Glossaire

Algorithme

 

 

 

INDEX

 

Informatique

 

Multimédia

 

Ordinateur

 

Index (portail)

Scratch

Maple

Maxima

Python

Processing

Animations

 

Sommaire de cette page

>>> Téléchargement

>>> Fondamental – L'espace de travail

>>> Mon premier programme

>>> Traitement permanent

>>> Structure complète d'un programme

>>> Bilan

>>> Trucs à savoir

>>> Index programmation avec Processing

 

 

 

 

 PROGRAMMATION

PROCESSING – Toute première approche

 

Processing est un langage de programmation:

*    simple et accessible même pour un débutant en programmation;

*    disponible gratuitement;

*    utilisé pour réaliser des dessins, des jeux, des œuvres d'art, etc.

*    qui comprend les outils mathématiques pour réaliser les transformations et les animations.

Cette page vous indique les trucs de départ que les habitués ont intégrés, sans réaliser que le novice en avait besoin pour se lancer.

 

Note: Ce logiciel est le plus simple possible. Néanmoins, je recommande à toute personne n'ayant jamais programmé ou aux plus jeunes de commencer avec Scratch et son abord particulièrement ludique.

Vous trouverez rapidement grand plaisir à réaliser des programmes vivants avec ces premières pages. Notamment, vous serez vite capables de réaliser un jeu de raquette (pong) et confectionner vos propres images fractales.

 

 

 

Quelques réalisations avec Processing

Voir Autres réalisations et leurs animations sur OpenProcessing

 

 

Téléchargement

Se rendre sur le site: http://www.processing.org/downloading

Cliquez sur votre version de système. Généralement Windows 64 bits. Au besoin, vérifiez avec le Panneau de configuration / Paramètres système:

Cliquez OK sur la fenêtre montrant:

Le téléchargent se lance. Vérifiez que tout se passe bien en cliquant sur:

"Processing" vous sollicite pour un don facultatif. Fermer la page sans action spéciale, sauf si vous voulez participer.

Cliquez sur le fichier:

Ce programme est décompressé dans le répertoire que vous voulez (Program files, de préférence).

Ouvrir votre répertoire et le dossier pour y retrouver les fichiers décompressés:

Cliquez sur processing. Votre logiciel est prêt !

 

 

Fondamental – L'espace de travail

Ce qu'il faut savoir

La fenêtre de travail qui s'ouvre comporte deux zones: la zone programme et la zone  surveillance, dédiée aux messages d'erreur.

 

Lors de l'exécution du programme (Marche), la fenêtre "dessin" s'ouvre et présente le résultat du traitement.

 

Après installation, commencez par cliquer sur  Marche. La fenêtre de dessin (vierge) doit s'ouvrir; preuve que tout va bien.

 

 

Mon premier programme

Instructions

 

size définit la taille de la fenêtre de dessin.

 

fill définit la couleur de remplissage.

 

rect commande le dessin d'un rectangle (coordonnées du point de départ et taille en largeur et hauteur).

 

Dessin de deux carrés colorés

 

 

Écriture

 

Tapez simplement les instructions indiquées.

Ne pas oublier de terminer chacune par un point-virgule.

Autant d'espace que vous voulez.

Retour à la ligne à votre convenance pour la clarté du programme.

Respectez la casse (lettres minuscules ou majuscules).

 

 

Copier-coller les programmes

 

size (200, 200);

fill (0, 0, 255);

rect (10, 10, 50, 50);

fill (0, 255, 0);

rect (100, 100, 50, 50);

 

Vous pouvez copier ce code et le coller dans la zone programme.

Ceci est valable pour tous les programmes présentés sur ces pages.

 

Coordonnées

 

Les points de l'écran sont des pixels.

Vous trouverez la taille maximale de votre écran en Panneau de configuration / Affichage. Généralement:

Commencez avec size (500,500), c'est déjà intéressant pour vos premières applications.

Comme en maths, la première coordonnée (x) est en horizontal et la seconde (y) est en vertical) … sauf que pour y, on descend !

 

 

 

Traitement permanent

Structure de base d'un programme

Deux fonctions:

 

*    Initialisation de la zone de dessin (setup): instructions exécutées une fois pour toutes.

 

*    Actualisation (draw: dessiner): instructions exécutées en boucle, en permanence.

 

Allure générale d'un programme

  VOID veut dire: annuler, vider.

 

Intérêt d'une exécution permanente

 

Ce programme exécute un tracé selon le déplacement de la souris.

 

Setup: on fixe la taille de l'image avec size et la couleur du fond de l'image avec background. La vitesse de répétition est contrôlée avec frameRate.

 

Draw: avec smooth (facultatif), on exige un tracé soigné (traits lissés).

 

Le tracé s'effectue en dessinant une ligne (line) entre la position actuelle de la souris (mouseX, mouseY) et la position juste précédente (pmouseX, pmouseY).

 

 

Tracé à mai levée

 

 

Dès que la souris "survole" l'image, elle laisse une trace noire.

 

Note: Il est possible d'annuler les répétitions en spécifiant noLoop (); dans la zone de setup.

Le code à copier-coller

 
void setup() { 
  size (200, 200);  // taille image
  background (0, 255, 255);   // couleur du fond image
  frameRate(30);  // rythme du renouvellement image
}
void draw(){
  smooth(); //  exige un dessin soigné (lissé)
  line (mouseX, mouseY, pmouseX, pmouseY); 
  // ligne en (x et y) de la souris à (x et y) de la souris juste avant
}

 

Les mots d'anglais

 

void
vide
draw
dessiner
setup
initialisation
smooth
lisse
background
arrière-plan
line
ligne
frame
trame image
mouse
souris
rate
rythme
 
 
  

 

 

Structure complète d'un programme

 

Structure complète d'un programme

À cette structure générale en deux parties, nous devons en ajouter deux autres. Ce qui donne:

 

*      Déclaration des variables: déclaration d'existence et nature, avec valeur éventuelle du départ;

*      Initialisation de la zone de dessin (setup)

*      Commande de dessin (draw); et

*      La définition des fonctions utilisées. Une fonction est un module de programme destiné à être utilisé plusieurs fois sans avoir à le répéter explicitement. Exemple: dessiner une étoile, une fleur, une fenêtre, etc.

 

 

Voir Explication de ce programme

   

 

 

Bilan

Nous savons installer Processing, un logiciel gratuit.

Comme dans Scratch, nous disposons d'une zone d'édition du programme et d'une zone de présentation des dessins (ou autres résultats de traitement).

Tout programme comporte des instructions d'initialisation suivi des instructions d'exécution des dessins, lesquelles son répétées sans arrêt de manière à exécuter immédiatement les ordres à la souris ou au clavier.

Les spécificités des commandes seront abordées au fur et à mesure des exemples sur ce site ou en visionnant les tutoriels accessibles sur Internet.

Pour sauvegarder ou ouvrir un fichier, comme d'habitude, cliquez sur l'onglet fichier.

 

Trucs à savoir

Taille des caractères du programme: faire
Fichier / Préférences / Taille de la police dans l'éditeur

Inhiber une instruction pour tester son effet ou mettre un commentaire dans le programme avec //

Suivre l'évolution d'une variable durant la mise au point du programme avec print (variable). Lecture dans la zone surveillance, en bas. Il faudra employer l'instruction text pour afficher le texte dans l'image.

Connaitre le détail des instructions: clic droit sur l'instruction puis cherchez dans la doc.

Utilisez l'onglet: Modifier / Mise en forme automatique. Bien pratique !

 

Symboles utiles à connaitre:

V += 10

ajoute 10 à V

==

Pour test d'égalité

V ++

ajoute 1 à V

!=

Pour test de différence

V – = 10

retire 10 à  V

?

Choix

V – – 

retire 1 à  V

//

Commentaire

V *= 10

multiplie V par 10

%

Modulo

V /= 10

divise V par 10

&&

ET logique

||

OU logique

 

Liste des instructions, voir: Reference Processing

 

 

 

Programmes Processing – Index

>>> Première approche – Installation, environnement de travail

>>> Mes premier pas – Connaissances des notions de base

>>> Mes premiers programmes d'animation

>>> Fonctions paramétrables

>>> Manipulation des dessins individuellement

>>> Arbre de Pythagore

>>> Tapis de billes ondulant

>>> Jeu de Pong (raquette)

>>> Pyramide fractale

>>> Arbre fractal

>>> Ensemble de Julia – Fractales

>>> Ensemble de Mandelbrot – Fractales avec zoom

Voir Programmes tous langagesIndex

 

 

 

 

 

Sur ce site

Retour

*         ProgrammationIndex  (Maple, Python, tableur …)

Suite

*            Processing – Mes premiers pas

Voir

*         Python – Approche pour débutant

*         Scratch – Apprendre à programmer simplement

*         Historique de l’aventure informatique

*         Maple – Apprendre à programmer (maths)

Cette page

http://villemin.gerard.free.fr/aInforma/PROCESNG/Process.htm

 

Externe

Processing

*           Tutoriel: Processing – C'est un exemple; il en existe bien d'autres

*           Une méthode rapide ludique et efficace pour enseigner les base de la programmation par le codage du jeu Pong sous Processing – Damien Muti – 2017 – Excellente introduction pour tous ceux qui veulent disposer des bases académiques pour poursuivre.

*           OpenProcessingNombreuses réalisations avec Processing

*           Category: Processing – Rosetta Code – Logithèques des programmes de base dans une multitude de langages

*           Introduction to Processing | Java – GeeksforGeeks

Livres

*           À la conquête des maths Python (et Processing) – Peter Farell – Eyrolles – 2020

*           {Processing} // S'initier à la programmation créative – Jean-Michel Géridan et Jean-Noël Lafargue – Dunod – 2016