A2 · Episode 3 · 4:59
Moving Characters in Scratch
This episode teaches how to select a sprite (monkey) from the Scratch library, remove the default cat, set a precise starting position using coordinate values, and use the 'go to x y' block with the green flag event to ensure consistent initialization every time the program runs.
Source:ericgrisperez / tube-numerique-educatif.apps.education.fr · License:CC BY 4.0
Transcript
Bonjour à tous, aujourd'hui dans cette vidéo Scratch,
Hello everyone! In today’s Scratch video,
nous allons apprendre à placer un personnage à l'écran et le déplacer avec les
we’ll learn how to place a character on the screen and move it using keyboard keys.
touches du clavier.
(We’ll learn how to place a character on the screen and move it using keyboard keys.)
Première chose que nous allons faire, c'est changer de lutin.
The first thing we’ll do is change the sprite.
Nous n'allons pas travailler avec le chat Scratch,
We won’t use the default Scratch cat sprite,
mais nous allons chercher un autre lutin dans la bibliothèque.
but instead choose another one from the sprite library.
Pour cela, vous appuyez sur l'icône du petit chat et vous appuyez sur la loupe.
To do this, click the cat icon, then click the magnifying glass.
Dans la bibliothèque, nous allons chercher dans la catégorie Animaux
In the sprite library, go to the ‘Animals’ category,
le lutin qui s'appelle Monkey, donc symbolisé par un singe qui est juste là.
and find the sprite named ‘Monkey’, represented by this monkey here.
Vous cliquez sur le lutin et il va venir se placer à l'écran.
Click on it, and it will appear on the stage.
Nous n'avons plus besoin du chat,
We no longer need the cat,
donc vous allez sur le lutin en cliquant dessus et vous appuyez sur la petite
so click on the cat sprite, then click the small trash can icon.
poubelle. Celui- ci disparaît.
It disappears.
Nous voici avec notre singe, donc qui situe sur notre écran.
Here we are—with our monkey now displayed on the stage.
Nous allons lui donner une position de départ.
Next, we’ll set it an initial position.
Moi j'aimerais que les pieds du lutin touchent le bord de l'écran.
I’d like the sprite’s feet to just touch the bottom edge of the screen.
Comment faire?
How do we do that?
Nous avons vu dans une vidéo précédente que Scratch fonctionnait avec une grille
As we saw in a previous video, Scratch uses a Cartesian coordinate grid,
repère orthonormé qui nous permet, grâce aux coordonnées,
which lets us precisely position our sprite using coordinates.
de placer notre lutin. Donc ici, si je veux placer mon lutin,
So if I want to place my sprite exactly,
ça va être difficile de lire par rapport à la grille, et nous avions vu en
it’s hard to read exact positions just by looking at the grid.
astuce que Scratch me fournissait directement les coordonnées lorsque je déplace mon
But we learned a handy trick: Scratch displays the sprite’s coordinates in real time as we drag it.
lutin. Ici je le déplace en maintenant mon clic gauche,
Here, I’m dragging the sprite while holding down the left mouse button,
et je vois les coordonnées se mettre à jour.
and I see the coordinates updating live.
Je vais simplement emmener mon lutin en bas de l'écran pour faire en sorte que les
I’ll simply drag my sprite all the way to the bottom of the screen,
pieds touchent le bord.
so its feet just touch the bottom edge.
Voilà. Ici je vois que mon lutin se trouve en x zéro et y moins 108.
There we go. Here I see my sprite is at x = 0 and y = -108.
Nous savons que la grille fait 180 pixels du centre de l'écran.
We know the grid extends 180 pixels upward from the screen’s center.
vers le haut et 180 pixels de plus du centre de l'écran vers le bas.
and another 180 pixels downward from the screen’s center.
Alors pourquoi est- ce que y est à- 108 et non à- 180?
So why is y at -108 instead of -180?
C'est tout simplement si on se souvient que le pixel analysé par Scratch se situe au
It’s simply because, if we recall, the pixel Scratch analyzes is
centre de notre lutin.
located exactly at the center of our sprite.
Donc il faut toujours imaginer qu'autour de notre lutin se situe un rectangle,
So we must always imagine a rectangle surrounding our sprite,
et que si je rejoins les diagonales de mon rectangle,
and if we draw its two diagonals,
je vais retrouver un point au centre de celui- ci,
they intersect at the exact center of that rectangle,
et c'est ce point- là qui est analysé par Scratch.
and it’s precisely this point that Scratch analyzes.
Donc ici on voit que le- 108, le centre de notre lutin, se situe au
So here we see that -108—the y-coordinate of our sprite’s center—
niveau de son cou.
lies at the level of its neck.
Il vaut mieux déplacer son lutin et récupérer les coordonnées directement données
It’s better to move the sprite and directly read off the coordinates Scratch provides.
par Scratch. Nous allons maintenant faire en sorte que le lutin,
Next, we’ll ensure the sprite always starts
au début de mon jeu, commence toujours à la même place.
at the same position when the game begins.
Car ici, si je le déplace avec ma souris ou si un joueur le déplace
Because right now, if I drag it with my mouse—or if a player accidentally moves it with the mouse—
malencontreusement à la souris, lorsque je vais relancer mon jeu,
then when I restart the game,
il sera alors cette position et ses pieds ne toucheront plus terre.
it will remain there, and its feet won’t touch the ground anymore.
Donc la première chose à faire sera de placer le lutin à l'endroit où vous souhaitez
So the first step is to place the sprite where you want it to start,
qu'il commence, puis nous allons aller chercher sa position.
then retrieve its current position.
Si nous allons dans la rubrique des mouvements,
If we go to the ‘Motion’ category,
je vais retrouver un bloc intéressant qui s'appelle aller à.
we’ll find a useful block called ‘go to’.
Aller à me permet d'aller à des coordonnées x et y automatiquement.
The ‘go to’ block lets us automatically jump to specific x and y coordinates.
Par exemple, je vois dans ce bloc aller à x moins un et y moins 107 que ces
For example, in this ‘go to x = -1, y = -107’ block, I see that these
coordonnées sont exactement les mêmes que celles analysées par Scratch.
coordinates exactly match those analyzed by Scratch.
Donc si je prends ce bloc que je mets dans la partie des scripts,
So, if I take this block and place it in the Scripts area,
si je bouge malencontreusement mon lutin, que j'appuie sur ce bloc,
and then accidentally move my sprite, then click this block,
il viendra se remettre automatiquement
it will automatically return to its original position.
à sa place. Par contre, il faut bien faire attention,
However, you must be careful:
ce bloc ne se met pas à jour si votre bloc est déjà sorti.
this block won’t update automatically if your sprite has already moved away.
Par exemple, ici, je bouge mon lutin,
For example, here I move my sprite,
je vois ici que les coordonnées ont changé, j'ai x 99 et y 45.
and I see here that the coordinates have changed: x is 99, y is 45.
Ce bloc, par contre, est resté à- 1- 107,
But this block still shows -1 and -107,
et le bloc dans la catégorie mouvement, lui, s'est bien mis à jour,
whereas the block in the Motion category has correctly updated,
x 99 y 45. Donc avant de déplacer le bloc dans la partie des scripts,
to x 99, y 45. So before dragging the block into the Scripts area,
on commence par placer son personnage à la bonne place,
we first place our character at the correct position,
puis seulement on va chercher le bloc dans la catégorie mouvement.
and only then do we select this block from the Motion category.
Ce bloc est très utile, mais il ne marche pas tout seul.
This block is very useful, but it doesn’t run automatically.
Il faut à chaque fois que je vienne appuyer dessus pour que celui- ci se déclenche.
Each time, I must click it manually for it to trigger.
Donc pour initialiser un programme,
So, to initialize a program,
nous utiliserons systématiquement un bloc d'événements qui servira de chapeau à
we’ll always use an Events block as the ‘hat’ (starting block) for each of our programs.
chacun de mes programmes.
Every program starts with it.
Dans la catégorie événements, nous allons retrouver celui que nous utiliserons le
In the Events category, we’ll find the one we use most often—
plus souvent, le drapeau vert.
the green flag.
Le drapeau vert est situé au- dessus de la scène.
The green flag is located above the stage.
Quand un joueur va venir essayer mon jeu, il commencera par appuyer sur le
When a player tries my game, they’ll first click
drapeau vert qui déclenchera l'ensemble des programmes qui ont pour chapeau le
the green flag, which triggers all programs whose hat is the green flag.
drapeau vert. Je prends donc ce bloc d'événements et je viens le superposer à
So I take this Events block and stack it on top of the other block.
l'autre. Je vois ici que les deux blocs vont s'accrocher,
I see here that the two blocks snap together.
donc à chaque fois que j'appuierai sur drapeau vert, le singe
That means each time I click the green flag,
viendra se mettre à sa place.
the monkey will return to its starting position.
Ici, je mets mon singe n'importe où, le joueur arrive,
Here, I place my monkey anywhere; when the player arrives,
il appuie sur le drapeau vert et le singe se met bien à sa place.
they click the green flag, and the monkey snaps perfectly into place.