Canvas et texte
Fait partie de la section Créer de vrais jeux du Journey Unity de Coddy. Leçon 1 sur 56.
Unity affiche à l’écran du texte, des boutons et des barres avec son système d’interface utilisateur. Dans Unity 6, GameObject > UI > Text - TextMeshPro ajoute un objet texte nommé Text (TMP) ; la première fois, Unity demande d’importer les TMP Essentials, dont le texte a besoin pour sa police. Si la scène ne comporte pas encore de Canvas, Unity en crée un et y place le texte, ainsi qu’un EventSystem par lequel passent les clics sur l’interface. Le Canvas affiche ses enfants par-dessus l’image de la caméra, à un emplacement fixe de l’écran, où que regarde la caméra. Réglez son Canvas Scaler sur Scale With Screen Size, 1920 x 1080, Match 0.5, comme dans chaque scène de ce cours, et la disposition conserve ses proportions quelle que soit la taille de l’écran.
Le composant du texte est TextMeshPro - Text (UI). Les scripts le stockent dans un champ de son type de base TMP_Text, issu de l’espace de noms TMPro, et modifient ce qu’il affiche via sa propriété text, une chaîne. Ce script nomme le niveau au démarrage :
using UnityEngine;
using TMPro;
public class LevelIntro : MonoBehaviour
{
public TMP_Text titleText;
void Start()
{
titleText.text = "World 2: Ice Caves";
}
}Faites glisser l’objet Text (TMP) depuis la Hierarchy vers l’emplacement Title Text dans l’Inspector ; Unity place alors son composant texte dans le champ. Sans using TMPro;, le nom TMP_Text est inconnu et le script ne compile pas (CS0246). Si l’emplacement reste vide, le premier titleText.text déclenche une UnassignedReferenceException. Ce que le script écrit remplace le Text Input saisi dans l’Inspector, qui vaut New Text pour un texte fraîchement créé.
Défi
FacileL’explorateur parcourt l’île avec les flèches gauche et droite, comme le fait déjà Explorer.cs. Affiche sa position dans ZoneText en haut de l’écran, où le texte « Nouveau texte : » apparaît encore :
- Ajoute
using TMPro;et un champ publicTMP_TextnommézoneText. La scène associe ZoneText à un champ portant exactement ce nom. - À chaque image, le texte affiche
Zone: Beachtant que la coordonnée x de l’explorateur est inférieure à 2, etZone: Jungleà partir de 2.
Appuie sur Play, avance sur l’herbe puis reviens, et enfin appuie sur Check.
Essayez vous-même
using UnityEngine;
public class Explorer : MonoBehaviour
{
public float speed = 4f;
void Update()
{
float move = Input.GetAxisRaw("Horizontal");
transform.Translate(move * speed * Time.deltaTime, 0f, 0f);
// Affiche la zone dans ZoneText : Zone: Beach pour x inférieur à 2, Zone: Jungle à partir de 2
}
}
Cette leçon comprend un petit quiz. Commencez la leçon pour y répondre et suivre votre progression.
Toutes les leçons de Créer de vrais jeux
1Texte à l’écran
Canvas et texteAfficher le scoreFormater les nombresUn compte à reboursRécapitulatif : compteur de vitesse4Scènes et niveaux
Charger une scèneRedémarrer le niveauNiveau suivantConserver entre les scènesRécapitulatif : sélection du niveau7Contrôle du temps
Mettre en pause avec timeScaleRalentiTemps non mis à l’échelleRécapitulatif : Bullet Time10Projet : jeu de plateforme en 3D
Le parcoursPlateformes mobiles2Boutons et écrans
Boutons et onClickLambdasRelier les éléments dans l’InspectorActiver et désactiver les panneauxBarres de santéRécapitulatif : boutique d’améliorations5Sauvegarder avec PlayerPrefs
Enregistrer un nombreCharger avec une valeur par défautMeilleur scoreEnregistrer les paramètresRécapitulatif : les pièces à la banque