-
Voici le programme qui dessine Winston,
auquel j'ai ajouté du texte.
-
Ce que je veux faire, c'est de placer mes
Winston en dessous de chaque texte
-
pour que cela corresponde à
chaque période de sa vie.
-
Mais pour l'instant, il est placé
un peu partout,
-
car la fonction place Winston à une
position aléatoire pour faceX et faceY.
-
On veut changer ça et pourvoir indiquer
à la fonction à quelle position dessiner Winston.
-
Ainsi, quand on appellera la fonction, il suffira
d'indiquer à quelle position le dessiner,
-
comme pour les rectangles ou les ellipses.
-
OK. En fait, je veux pouvoir dessiner un Winston ici...
et ici.... aussi ici... et le dernier là !
-
Je ne veux plus de position aléatoire à chaque appel.
-
Pour faire ça, on va créer des paramètres
à notre fonction...
-
à la fois, au moment de la définition
(tout en haut... ici)
-
et aussi au moment de l'appeler...
en bas...ici.
-
Dans "drawWinston()", on va lui passer
faceX et faceY,
-
et il pourra utiliser ces
valeurs au lieu de les générer aléatoirement.
-
Commençons par voir ce qu'on va lui
passer comme valeurs au moment de l'appel.
-
On veut le positionner sous chaque bloc de texte.
-
Donc on va passer des valeurs qui sont proches
des "x" et "y" utilisés pour le texte.
-
Probablement juste 10 pixels
plus bas pour le "y".
-
Le premier sera à peu près à 10 et 30,
puis... 200 et 30...
-
puis, 10 et 230... et enfin, 200 et 230.
-
J'ai utilisé ceux des textes
et juste ajouté 10 au "y" pour l'avoir un peu en dessous.
-
OK. Winston, lui, n'a pas bougé !
-
C'est parce qu'on n'a pas indiqué
à la fonction d'utiliser les paramètres.
-
Elle utilise donc toujours les valeurs aléatoire.
-
Donc pour lui dire de plutôt utiliser les paramètres,
-
on doit ajouter les noms des paramètres
entre les parenthèses... ici.
-
On va les appeler faceX et faceY... et les séparer
par une virgule.
-
On les appelle comme ça, car on utilise déjà ces
noms dans la fonction.
-
Cela nous évite de modifier
le code existant.
-
Mais, même en faisant ça,
Winston est toujours n'importe où !
-
Si vous regarder au début du code de la fonction,
-
vous voyez qu'on écrase toujours la valeur de
faceX et faceY par des valeurs aléatoires !
-
Il faut donc qu'on enlève ces deux lignes, là.
-
Et voilà ! maintenant la fonction utilise
les valeurs de faceX et faceY,
-
qu'on lui a passé au moment de l'appel.
-
Je n'ai pas bien positionné
mes Winston pour l'instant,
-
car j'ai oublié que les valeurs de "x" et "y"
pour les textes représentent le coin supérieur gauche
-
Alors que pour le visage,
ça représente le centre du visage de Winston.
-
Donc je vais changer ça un peu...
-
Je vais changer pas mal le "x"... et le "y" pareil...
avec l'outil c'est plus facile...
-
Donc, ce que je fais maintenant, c'est juste changer
les valeurs des paramètres de ma fonction.
-
Je n'ai plus à modifier la fonction elle-même.
-
Car elle va juste utiliser les valeurs que je lui passe.
OK ? Exactement comme avec ellipse() et rect().
-
OK. Je les ai positionnés, mais en fait, il est trop grand.
-
Ils se superposent. Il prend trop de place.
-
Comme j'ai fais une fonction pour le dessiner,
je peux modifier leur taille d'un coup,
-
juste en changeant une ligne de code !
-
Essayons de prendre la valeur 190, Yeah !
Il va maigrir d'un coup... 190.
-
C'est pas mal ! et si je modifie encore
un peu leur position, ça ira mieux.
-
Cool ! Bon.
Revoyons un peu ce que ce code fait.
-
On a définit une fonction appelée
"drawWinston()",
-
Cette fonction accepte 2 valeurs,
qu'on a nommées faceX et faceY.
-
Ces valeurs sont portées par ces deux variables
qu'on peut utiliser dans le reste de la fonction.
-
Exactement comme si on les
avait déclarées en haut normalement,
-
Et on peut appeler cette fonction
où on veut (après l'avoir déclarée)
-
et lui passer des valeurs
différentes en paramètre à chaque fois.
-
On vient de voir un truc super utile
avec les fonctions.
-
Quand on a du code qu'on pense
pouvoir ré-utiliser,
-
il suffit de le mettre dans une fonction.
-
Ensuite, on peut lui passer des paramètres
-
pour la personnaliser ou changer
son comportement.
-
C'est comme une recette.
-
Vous écrivez la recette pour un gâteau.
Mais si vous avez besoin d'en faire 4,
-
Vous n'avez pas à tout ré-inventer...
il suffit de tout multiplier par 4.
-
A vous de trouver le code que vous pouvez ré-utiliser !
