{{ :suivant.png?nolink&30|}} {{ :retour.png?nolink&30|}} [[brainpad:accueilbp2|{{ :iconemaison.jpg?nolink&30|Sommaire BP2}}]]
===== Brainpad 2 : Jeu - le sapin de noël=====
[Mise à jour le : 4/9/2020]
{{ :brainpad:makecode.png?nolink&50|}} {{ :netmf43:brainpadico.png?nolink&100}}
==== Présentation ====
> Création et animation d'un sprite.
==== Création du sprite ====
Pour coder l'exemple ci-dessous, aller dans **Avancé** -> **Extension** et sélectionner **Jeu** pour ajouter les menus SPRITES, CONTRÔLEUR, SCENE et INFO. Puis sélectionner le bloc "Créer" dans SPRITES.
{{ :brainpad:sprite1.png?nolink&500 |}}
> L'extension "jeu" vous permet d'ajouter des objets images à l'écran.
Sélectionner {} JavaScript et modifier le code comme ci-dessous.
mySprite = sprites.create(img`
. . . . . . . . . . . . . . . .
. . . . . . . 1 . . . . . . . .
. . . . . . 1 1 1 . . . . . . .
. . . . . 1 1 1 1 1 . . . . . .
. . . . 1 1 1 1 1 1 1 . . . . .
. . . . . . 1 1 1 . . . . . . .
. . . . . 1 1 1 1 1 . . . . . .
. . . . 1 1 1 1 1 1 1 . . . . .
. . . 1 1 1 1 1 1 1 1 1 . . . .
. . . . . 1 1 1 1 1 . . . . . .
. . . . 1 1 1 1 1 1 1 . . . . .
. . . 1 1 1 1 1 1 1 1 1 . . . .
. . 1 1 1 1 1 1 1 1 1 1 1 . . .
. 1 1 1 1 1 1 1 1 1 1 1 1 1 . .
. . . . . . . 1 . . . . . . . .
. . . . . . . 1 . . . . . . . .
`, SpriteKind.Player)
{{ :brainpad:sprite2.png?nolink&500 |}}
Nous avons simplement créé et affiché le sprite. Nous sommes maintenant prêts à le déplacer !
==== Déplacement du sprite ====
Nous allons créer une variable __**Pos**__ et l'initialiser avec la valeur 50 puis nous l'incrémenterons dans une boucle. L’arbre se déplacera alors d'une position : 51, 52, 53, 54, 55… etc. À un moment donné, l'arbre se déplacera en dehors de l'écran.
{{ :brainpad:sprite3.png?nolink&500 |}}
Pour que le sprite se déplace latéralement à l'écran, on peut utiliser un test pour vérifier "si" l'arbre a atteint le bord, puis inverser le déplacement. Étant donné que la largeur de l'écran est de 128 pixels, on vérifie que la position de l'arbre est inférieure à 110. Le moyen le plus simple consiste à contrôler sa direction par une valeur positive lorsqu'il se déplace à droite et négative lorsqu'il se déplace à gauche. Appelons cette variable __**Dirr**__.
{{ :brainpad:sprite4.png?nolink&500 |}}
L'arbre vient de rebondir… mais il est sorti du côté gauche de l'écran ! Nous résolvons ceci en vérifiant la position de l’arbre. Si elle est inférieure à 10, nous inversons la direction.
{{ :brainpad:sprite5.png?nolink&500 |}}
La variable Dirr permet de contrôler la vitesse. En affectant 5 à Dirr, on observe que l'arbre se déplace 5 fois plus vite. Cet exemple est une bonne introduction aux vecteurs.
Le programme **Sapin de Noël** est **téléchargeable** [[https://webge.fr/doc/wikis/code/GHI/Makecode/BP2/MKD_BP2_Sapin_Noel.zip|ici]]
==== En savoir plus sur les vecteurs ====
mathinsight.org