Unité

Utilisation des boutons dans l’interface utilisateur Unity

Page mise à jour :
Date de création de la page :

Environnement de vérification

Windows
  • Fenêtres 11
Éditeur Unity
  • 2020.3.25f1

Conditions préalables à cette astuce

Les réglages suivants ont été effectués à l’avance comme condition préalable à l’explication de ces conseils.

Au début

Un bouton peut être utilisé comme un objet sur lequel l’utilisateur clique seul, ou il peut être utilisé pour faire un choix, tel que « oui » ou « non ». Si vous voulez être un peu plus élaboré, vous pouvez utiliser un bouton comme objet pour sélectionner un élément de liste tel qu’un menu.

En plus de cela, il peut également être utilisé à des fins de débogage et lorsque vous cliquez sur un bouton pour modifier arbitrairement l’état.

Cliquez sur le bouton pour modifier le texte

Si vous cliquez simplement sur le bouton, vous effectuerez un certain traitement. Cette fois, chaque fois que vous cliquez sur le bouton, le nombre de texte augmentera de 1.

Placement et configuration de l’interface utilisateur

Ajoutez du texte et des boutons de la hiérarchie à la vue.

Vous pouvez le placer n’importe où tant que vous le placez dans un endroit où vous pouvez le voir. Comme il est difficile de voir dans l’état initial, des paramètres tels que « couleur du texte blanc », « modifier la taille », « augmenter la taille de la police », etc. sont définis. Le contenu du texte sera modifié automatiquement plus tard, vous pourrez donc le laisser comme « Nouveau texte ».

Le réglage des caractères du bouton est divisé en « Bouton » et « Texte », alors sélectionnez Texte et définissez-le.

Ajout de scripts

Sélectionnez le dossier Scenes de votre projet, cliquez avec le bouton droit sur un espace vide, puis sélectionnez Script C# pour l’ajouter. À l’origine, il est préférable de créer le script dans un dossier séparé, mais je vais l’omettre dans le but de vérifier l’opération.

Le nom du fichier doit être facile à comprendre. Saisissez autant de caractères alphanumériques que possible. ButtonClick Dans ce cas, il est défini sur .

Une fois créé, double-cliquez sur le script C# pour ouvrir l’éditeur de script. Si votre éditeur de script est Visual Studio, vous devriez voir quelque chose comme ceci :

Start, La méthode n’est pas nécessaire cette fois-ci, alors supprimez-la, Update réécrivez-la et enregistrez-la comme suit.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;    // 追加

public class ButtonClick : MonoBehaviour
{
  /// <summary>カウントアップするテキストオブジェクト。</summary>
  [SerializeField] Text CountText;

  public void OnClick()
  {
  }
}

La syntaxe de C# n’est pas le sujet principal de cette astuce, je ne vais donc pas l’expliquer. S’il vous plaît, étudiez par vous-même. Seules les descriptions spécifiques à Unity sont abordées.

MonoBehaviour Les champs écrits dans les classes dont héritent pourront être définis dans l’éditeur Unity. CountText Ici, nous définissons un objet texte appelé Pour qu’il puisse s’afficher, il public doit être publié avec . SerializeField Cependant, si vous ajoutez l’attribut, vous public pourrez l’afficher dans l’éditeur avec une accessibilité autre que . C’est une meilleure description si vous ne voulez pas y accéder à partir d’autres classes autant que possible, autrement que dans le but de le configurer dans l’éditeur.

OnClick Des méthodes sont fournies pour décrire ce qu’il faut faire lorsqu’un clic est sur un bouton. public Celle-ci doit être définie dans .

Pièce jointe à partir de l’éditeur Unity

Revenez à l’éditeur Unity et sélectionnez dans la hiérarchie EventSystem .

EventSystem inspecteur apparaîtra, alors déposez le script C# que vous venez de créer dans la zone « Ajouter un composant » ci-dessous. Le script est maintenant prêt à fonctionner.

En fait, ce script peut être attaché à n’importe quel objet, et Button il doit être attaché à l’objet. Dans cette astuce, nous allons ajouter à pour le rendre uniformément facile à comprendre EventSystem . Button Bien sûr, il n’y a aucun problème à l’attacher à . Cependant, il est préférable de ne pas l’attacher à un objet complètement sans rapport, car cela causerait de la confusion.

Si vous regardez le script que vous avez ajouté, vous pouvez voir que l’élément « Compter le texte » est affiché. Une fois que vous avez publié un champ de cette manière, vous pourrez définir la valeur à partir de l’éditeur Unity. Nous voulons accéder à l’objet texte lorsque nous cliquons sur le bouton, alors faites-le glisser depuis la hiérarchie Text et Count Text déposez-le sur . Cela vous permettra d’y accéder à tout moment depuis votre script.

Ensuite, sélectionnez dans la hiérarchie Button et cliquez sur + sous Sur clic dans l’inspecteur Button .

Ensuite, un élément sera ajouté.

Dans l’élément en bas à droite, j’ai supprimé un script attaché à la EventSystem hiérarchie. Puisque nous devons mettre l’objet auquel le script est attaché ici, Si vous attachez un script à un bouton, vous devez inclure un bouton.

Si vous cliquez sur « Aucune fonction », le script joint s’affichera, alors ButtonClick sélectionnez . Sélectionnez la méthode que vous y avez créée OnClick . Maintenant, lorsque vous cliquez sur le bouton, la OnClick méthode est appelée.

Sortie du journal d’un simple clic

Je vais sortir le journal pour confirmer que cela fonctionne. Vous pouvez vérifier que cela fonctionne juste en écrivant une ligne, et cela sera très utile pour le débogage futur, il est donc préférable de s’en souvenir.

ButtonClick Ouvrez le script et OnClick ajoutez ce qui suit à .

public void OnClick()
{
  // コンソール ログを出力
  Debug.Log("ボタンが押されました！");
}

Une fois que vous êtes entré et enregistré, lancez le jeu et cliquez sur le bouton.

Chaque fois que vous cliquez dessus, un message apparaît dans l’onglet de la console. Maintenant, vous pouvez voir que cela fonctionne.

Modifier le texte en cliquant sur un bouton

Maintenant que vous pouvez déplacer les boutons, l’objectif de cette astuce a été atteint. Maintenant que j’ai placé l’objet texte, je veux modifier le texte à chaque fois que je clique sur le bouton.

Réécrivez le script comme suit.

// 省略

public class ButtonClick : MonoBehaviour
{
  /// <summary>カウントアップするテキストオブジェクト。</summary>
  [SerializeField] Text CountText;

  /// <summary>クリックカウント。</summary>
  private int _counter = 0;

  public void OnClick()
  {
    // コンソール ログを出力
    Debug.Log("ボタンが押されました！");

    // カウントを増やす
    _counter++;

    // カウントした数を表示する
    CountText.text = _counter.ToString();
  }
}

Le contenu consiste simplement à incrémenter le nombre de 1 chaque fois que vous cliquez et définissez le nombre sur l’objet texte.

Lancez le jeu et assurez-vous que le nombre augmente à chaque clic.

Aligner la caméra (2D) avec le canevas
Utilisation de la liste déroulante de l’interface utilisateur Unity