On est de retour avec Winston. Nous avons à présent une variable X et une Y pour la position de Winston. Donc nous pouvons bouger sur les côtés en haut et en bas, woo! Vraiment bien. Maintenant, réinitialisons ces variables avec 200 et 200 et voyons comment fonctionne ce programme. Alors commençons ici, nous avons la variable eyeSize. C'est utilisé pour contrôler le dimension des yeux, parce que les yeux ont tous une largeur de 40 pixels et une hauteur de 40 pixels. Et puis nous avons les variables X et Y, et elles définissent le centre du visage. Et vous les voyez utilisés dans cette commande ellipse ici, qui dessine ce grand cercle jaune. Et ici en bas, pour les yeux, le X et le Y sont aussi utilisés. Et ici, les yeux sont positionnés relativement au centre du visage. Donc peut-être que celui-ci est à 50 pixels du gauche du centre et celui-ci est à 100 pixels de la droite du centre. OK. Pas mal et c'est pourquoi nous pouvons bouger Winston de haut en bas. Maintenant, je veux pouvoir contrôler plus de chose sur le visage de Winston avec des variables donc je veux comprendre ce que nous pouvons, dans ce programme, enregistrer en tant que variables pour ce faire je vais passer en revu chaque ligne de code et regarder celle que l'on appelle des nombres codés en dur et ces nombres qui sont juste des nombres littéraires non des variables ou dépendant de variables donc commençons par ici dans cette première ellipse nous avons 300 et 300 pour la largeur et la hauteur ce sont des nombres littéraires donc faisons une variable pour ceux-ci. Appelons la faceSize et enregistrons 300 maintenant nous avons juste à écrire faceSize, faceSize OK ? Alors continuons et oublions les couleurs maintenant les commandes d'ellipse sont à la fois des variables ou dépendant de variables donc je vais les laisser comme ceci pour l'instant et prenons la commande de la bouche qui est dépendante de X et Y mais qui sont juste des nombres littéraires 150 et 150 disons donc mouthSize, c'est un bon nom, égale 150 on va remplacer ça par mouthSize et mouthSize Ok, donc maintenant nous avons les dimensions des formes enregistrés comme des variables tout en haut, ce qui veut dire qu'il est très simple pour nous de changer les dimensions comme ça, ou comme ça, Wooooo Winston à faim ! et peut-être maintenant, comme ceci, Winston avait faim et il a mangé beaucoup de Donuts et ensuite il devient super gros Ok bon, il y a quelque chose que je n'aime pas à propos du programme pour l'instant donc si je transforme le visage en tout petit cela commence à être drôle parce que les yeux et la bouche sortent du visage et à un certain point cela ne semble même plus être relié au visage ou n'est-ce plus un visage du tout ? Bon alors ce qu'il s'est réellement passé c'est que lorsque je change faceSize je veux que les yeux et la bouche Je veux que leur dimensions changent également, donc si je change faceSize jusqu'à la moitié je veux que la bouche soit aussi diminué de moitié ce qui veut dire que je veux calculer mouthSize et eyeSize comme des fractions de faceSize OK réinitialisons les variables et je vais vous montrer ce à quoi je pense. Je commence par mouthSize donc maintenant faceSize est égale à 300 et mouthSize est égale à 150 donc si l'on réfléchis ils sont relatifs l'un à l'autre disons que faceSize est deux fois plus grand que mouthSize ou que mouthSize est deux fois plus petit que faceSize et on peut écrire ce code comme ceci une fois et demi faceSize OK donc cette ligne de code dit que l'on veut prendre la valeur de faceSize la multiplier par sa moitié et enregistrer ceci dans mouthSize comme ça nous pourrons changer ceci qui interprètera ce qu'est la moitié et deviendra mouthSize parfait ! Voilà ce que nous voulons Maintenant eyeSize donc faceSize est égale à 300 et eyeSize est égale à 40 donc nous avons besoins 40 divisé par 300 de faceSize ce qui donne 4 sur 30 que nous pouvons simplifier par 2 sur 15 donc disons que 2 sur 15 fois faceSize (par ailleurs si vous êtes débutants avec les fractions et que les maths vous semblent compliqués vous pouvez apprendre d'avantages sur les fractions sur Khan Academy et revenir à ce chapitre lorsque vous vous sentirez prêts) revenons à nos moutons OK donc réduisons le visage à nouveau Haha! Regardez ! La bouche et les yeux se redimensionnent proportionnellement au visage mais vous remarquerez probablement quelque chose qui cloche les yeux et la bouche s'écartent toujours du visage même s'ils sont bien plus proportionnels. C'est parce que nous avons toujours des nombres codés en dur dans les commandes des ellipses ces nombres qui devraient en fait être des fractions de variables. Voilà, je vais vous montrer pour l'ellipse de l'oeil nous avons X moins 50 pour la position X ce qui veut toujours dire X moins 50 même si nous modifions faceSize en dessous de 50 pixels et ça n'a aucun sens car cela veut dire que l'oeil gauche ne sera plus dans le visage. Donc on devrait avoir X moins une fraction de la dimension du visage et nous pouvons définir une fraction de la même façon 50 relativement aux 300 d'origine donc 50 sur 300, 5 sur 30, 1 sur 6 donc 1 sur 6 fois faceSize et ici nous avons également 50 donc nous pouvons faire la même chose la même ligne de code ici nous avons 100 sur 300 qui deviendra 1/3 de faceSize ici nous avons 60 qui finira par 1/5 de faceSize et ici nous avons un autre 50 qui sera 1/6 de faceSize et ici 40 qui deviendra 2 sur 15 donc 2 sur 15 faceSize Ok réessayons Oh regardez ça ! Regardez ! C'est magnifique ! Trop bien. Ok bon récapitulons nous avons créés cette variable qui stocke les dimensions du visage et qui n'enregistre qu'un nombre et nous avons les variables mouthSize et eyeSize et nous les avons calculés avec des fractions de faceSize pour être certains que leurs valeurs changent toujours avec la base de celle-ci et toutes les autres sont calculées également sur la base de faceSize pour être certains que cette position à l’intérieur du visage change si faceSize change. Whoo! Très bien. Donc maintenant que l'on comprend bien comment créer des variables qui dépendent des valeurs d'autres variables on peut faire beaucoup plus avec nos programmes Célébrons cela en rendant Winston énorme ! Yeaaah ! Allez Winston !