Sélectionnez votre langue

"Je crois à la ponctualité, quoiqu'elle me rende souvent solitaire."
E. - V. Lucas

L'objectif de ce tutoriel est de découvrir le détecteur d'évènement clavier.
Nous allons construire une scène minimaliste, y ajouter un personnage tout fait, puis mettre en place le contrôle du personnage au clavier.

***

Version utilisée pour la rédaction de ce tuto (cf barre d'état) :

"UPBGE v0.3 Alpha (based on Blender v2.83.13)"


Conventions :
Les touches du clavier et les boutons de la souris sont indiqués entre '[' et ']'.
Les parcours à suivre dans l'interface utilisent '>' comme séparateur.
Quelques exemples :

[A] : touche 'A'.
[Num .] : '.' sur le pavé numérique.
[BGS] : Bouton Gauche de la Souris.
[BMS] : Bouton du Milieu de la Souris (il est possible de cliquer avec la molette !).
[BDS] : Bouton Droit de la Souris.
[Maj]+[BDS] : maintenir la touche Majuscule enfoncée et cliquer avec le Bouton Droit de la Souris.
File > Save : menu "File", puis item de menu "Save".


Notre point de départ sera le fichier obtenu à la fin du tuto précédent :

startup.blend (653 Kio)

Si vous n'en avez pas fait votre fichier de démarrage, téléchargez-le, puis ouvrez-le :
File > Open...

***

UPBGE s'ouvre sur une scène minimaliste contenant une source lumineuse, un cube et une caméra.

Pour enregistrer le fichier, faites dans le menu principal :
File > Save As...,
choisissez le dossier où vous souhaitez enregistrer, puis cliquez dans la ligne de saisie contenant "untitled.blend" (ou "startup.blend" si vous l'avez ouvert), tapez le nom sous lequel vous souhaitez enregistrer le fichier ("clavier", par exemple) et validez la saisie avec [Entrée] (l'extension ".blend" est ajoutée automatiquement).
Enfin validez l'enregistrement avec [Entrée].
Par la suite, pensez à enregistrer de temps en temps, il suffira de faire :
File > Save
En fait, la version de UPBGE utilisée ici étant marquée "Alpha", elle est potentiellement instable, il est donc fortement recommandé d'enregistrer souvent (raccourci clavier : [Ctrl]+[S]) !

Commençons par supprimer le cube :
Il doit être sélectionné (contour orange), si ce n'est pas déjà le cas, faites [BGS] sur le cube.
Amenez le curseur souris dans la Vue 3D en haut à droite (attention, la zone active, c'est-à-dire celle qui reçoit les commandes du clavier, est celle qui contient le curseur souris), puis pressez [Suppr], le cube disparait.

Pour ajouter un plan, faites dans le menu de la Vue 3D :
Add > Mesh > Plane
Un carré est créé à la position du Curseur 3D (qui se trouve initialement au centre du système de coordonnées, là où se croisent les axes X et Y).
Pour l'agrandir :
[S] (comme "Scale", Échelle), puis tapez la valeur 10 et validez avec [Entrée].

Ce plan sera notre sol.
Dans "Outliner", la petite zone en haut à droite, faites un double-clic sur "Plane" et renommez-le "Sol" :

Capture d'écran : Outliner

***

Cadrage de la caméra

Dans le menu de la Vue caméra (zone en haut à gauche), faites :
View > Sidebar,
pour afficher la barre latérale.
Le menu indique que le raccourci clavier pour cette commande est [N] :

Capture d'écran : Sidebar

Allez-y, essayez, [N] pour masquer, [N] à nouveau pour afficher.
Cette barre latérale comporte des onglets verticaux sur le côté droit, choisissez l'onglet "View".
La barre latérale contient plusieurs panneaux.
Le panneau "View" contient un sous-panneau "View Lock".
Cochez-y "Lock Camera to View" :

Capture d'écran : Lock Camera to View

Ce parcours que nous venons d'effectuer dans l'interface peut être résumé ainsi :
Vue caméra > [N] > Onglet "View" > View > View Lock > Lock Camera to View [x]
Masquez la barre latérale : [N]
Masquez la "Toolbar" (Barre d'outils) : [T]
On y verra plus clair !
"Lock Camera to View" (Verrouiller la caméra sur la vue) est un moyen très simple d'effectuer le cadrage de la caméra. En effet, si on manipule maintenant la vue (zoom, rotation, translation), la caméra est modifiée automatiquement pour correspondre à la vue.
Ainsi, dans la vue caméra, faites rouler la molette de la souris d'un cran vers le bas pour dézoomer la vue (ou [Num -]), vous pouvez remarquer, dans la vue 3D de droite, que la caméra s'éloigne du point visé.
Dézoomez 6 fois de plus, le plan tient maintenant presque entièrement dans le cadre de la caméra (délimité par un rectangle en pointillés rouges), il manque juste le coin inférieur.
Maintenez [Maj], maintenez [BMS] et bougez la souris pour décaler la vue, de manière à voir la totalité du plan :

Capture d'écran : Cadrage de la caméra

Maintenant que le cadrage est terminé, désactivez "Lock Camera to View" :
Vue caméra > [N] > Onglet "View" > View > View Lock > Lock Camera to View [ ],
pour éviter de perdre ce cadrage en manipulant la vue.
Masquez la barre latérale : [N]

***

Personnage

Nous allons maintenant ajouter le personnage.
Dans le menu de la Vue caméra, faites :
Add > Mesh > Monkey
Une tête de singe est ajoutée à la scène. Cet objet se nomme "Suzanne" (le nom de l'objet actif est affiché en haut à gauche de la vue, sous "Camera Perspective"). Suzanne est la mascotte du logiciel Blender sur lequel est basé UPBGE.

Pour mieux la voir, faites :
[Num /]
La vue "Camera Perspective" est devenue une vue "User Perspective (Local)".
Un zoom a été effectué sur l'objet sélectionné, et les autres objets ont été masqués.

Pour que les facettes se voient moins :
[BDS] > Shade Smooth

Pour affiner le maillage, dans la zone "Properties" (à droite) :
Modifier Properties > Add Modifier

Capture d'écran : Add Modifier

Choisissez :
(Generate) Subdivision Surface
Voilà qui est mieux !

Pour sortir de la vue locale et revenir à la vue caméra :
[Num /]

Pour positionner Suzanne au-dessus du plan :
[G] (pour déplacer),
puis [Z] (pour contraindre le déplacement selon l'axe Z),
tapez la valeur 5,
[Entrée].

Pour visualiser les axes de l'objet, cochez :
Properties > Object Properties > Viewport Display > Axis [x]

Capture d'écran : Axis

Pour changer le type de l'objet :
Properties > Physics Properties
Panneau "Physics" > "Physics Type:", remplacez "Static" par "Dynamic".

Puis, dans le panneau en-dessous, cochez :
[x] Collision Bounds
Et dans la liste déroulante "Bounds:", choisissez "Convex Hull" :

Capture d'écran : Physics Properties


Pour lancer la 3D interactive (démarrer le moteur de jeu), dans la vue caméra, faites [P] (comme "Play").
Suzanne, objet de type dynamique, soumis à la gravité, tombe sur le sol.
Tandis que l'objet "Sol", de type statique, non soumis à la gravité, reste immobile.
Quittez le jeu : [Échap]

***

Logic Editor

Nous pouvons à présent mettre en place l'interactivité. Pour ce faire, il faut utiliser le "Logic Editor" (zone du bas). Le "Logic Editor" est divisé en 3 colonnes :
- La colonne de gauche est celle des "Sensors", les détecteurs d'évènements.
- La colonne centrale est dédiée aux "Controllers" qui permettent de combiner les évènements, par exemple "Evènement1 Et Evènement2", ou bien "Evènement1 Ou Evènement2".
- La colonne de droite concerne les "Actuators", c’est-à-dire les actions à déclencher.

***

L'évènement Clavier

Nous allons faire en sorte de diriger Suzanne au clavier.

Commencez par ajouter un détecteur d'évènement clavier :
Add Sensor > Keyboard

Capture d'écran : Add Sensor - Keyboard 

Dans le bloc qui a été ajouté, cliquez sur le bouton vide à droite de "Key:".
Le bouton dit maintenant "Press a key" (Appuyez sur une touche), pressez la touche "Flèche vers le haut", le bouton dit maintenant "Up Arrow". Ce détecteur réagira aux pressions sur cette touche.
En haut du bloc, à droite de la liste déroulante "Keyboard", se trouve le champ "Name" qui contient la valeur "Keyboard", cliquez et renommez-le "Haut" :

Capture d'écran : Sensors - Keyboard - Haut

Maintenant ajoutez un contrôleur :
Add Controller > And
En fait nous n'avons pas besoin de combiner deux évènements, mais il faut quand même passer par un contrôleur.

Enfin ajoutez une action de type "Motion" (Mouvement) :
Add Actuator > Motion
Dans le champ "Loc:", cliquez sur "Y 0.00" et tapez la valeur : -0.04
Renommez le bloc : "Avancer".

Il ne reste plus qu'à relier les 3 blocs.
Cliquez-glissez [BGS] depuis les chainons à droite du bloc "Sensor" jusqu'aux chainons à gauche du bloc "Controller" : un connecteur est ajouté.
Faites de même pour relier le contrôleur à l'action :

Capture d'écran : Connecteurs

Lancez le jeu pour tester ce que vous avez mis en place, Suzanne doit avancer quand vous pressez la flèche vers le haut.
Et si vous avancez un peu trop, elle tombe !

Nous allons lui ajouter la possibilité de tourner à gauche.
Pour commencer, afin de faire de la place, dans chaque colonne, repliez le bloc en cliquant sur l'icone "Expanded" en haut à gauche.
Ajoutez un détecteur d'évènement clavier pour la touche "flèche à gauche", nommez-le "Gauche".
Ajoutez un contrôleur "And".
Ajoutez une action "Motion", nommez-la "Tourner à G", Rot > Z : tapez la valeur : 1
Enfin connectez ces 3 nouveaux blocs et repliez-les.

Procédez de même pour ajouter la possibilité de tourner à droite.
Rot > Z : tapez la valeur : -1

Pour finir, nous allons ajouter la possibilité de sauter.
Ajoutez un détecteur d'évènement clavier pour la touche [Espace], nommez-le "Espace".
Ajoutez un contrôleur "And".
Ajoutez une action "Motion", nommez-la "Sauter", Linear Velocity > Z : tapez la valeur : 5
Enfin connectez ces 3 nouveaux blocs.

Testez le jeu.
Suzanne peut maintenant avancer, tourner et sauter.
Elle peut même sauter très haut, si vous maintenez la touche [Espace] enfoncée, jusqu'à sortir du champ de la caméra ! Elle devrait quand même finir par retomber...
Nous allons régler ce petit problème.
Dans le détecteur d'évènement clavier "Espace", il suffit d'activer le bouton "Tap" : le contrôleur ne sera activé qu'un instant, même si le détecteur reste actif.
Testez le jeu à nouveau.
C'est mieux !
Notez tout de même que Suzanne, après avoir sauté, alors qu'elle n'est pas encore retombée sur le sol, est capable d'enchainer sur un autre saut... C'est rigolo mais pas très réaliste ! Nous verrons dans un autre tuto comment régler ce problème.
Vous pouvez maintenant replier les 3 derniers blocs :

Capture d'écran : Contrôle au clavier

 

Il est temps de voir ce que ça donne en plein écran. Dans :
Properties > Render Properties > Game Resolution,
cochez les 2 cases :
[x] Fullscreen        [x] Desktop,
puis cliquez "Standalone Start" :

Capture d'écran : Plein écran

 

Voici le fichier final :

clavier.blend (748 Kio)