Menu
CoddyTech

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éé.

challenge icon

Défi

Facile

L’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 public TMP_Text nommé zoneText. La scène associe ZoneText à un champ portant exactement ce nom.
  • À chaque image, le texte affiche Zone: Beach tant que la coordonnée x de l’explorateur est inférieure à 2, et Zone: 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
    }
}
quiz iconTestez-vous

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