スポンサーリンク
スポンサーリンク
Unityゲームの作り方メモ

【Unity 2D】メッセージウィンドウの作り方

Unity

はじめに

Unityでゲームを開発している皆さん、メッセージウィンドウの作成に頭を悩ませていませんか?特に、セリフの長さに応じてウィンドウのサイズが変わり、さらにテキストを一文字ずつ表示する機能を実装したいと思っている方も多いでしょう。この記事では、そんな機能をUnityで実現する方法を、初心者にもわかりやすく説明します。

メッセージウィンドウの基本

メッセージウィンドウは、ゲーム内でキャラクターのセリフや物語を伝えるために不可欠です。Unityでは、UI(System)を使って簡単に実装することができます。まず、Unityエディタ上で「Canvas」を作成し、その中に「Text」オブジェクトを配置します。これが最も基本的なメッセージウィンドウの形です。

文字数によってウィンドウのサイズが変わる

メッセージウィンドウに使用する画像をUnityにインポートします。

私はこちらの画像を使用しました。

インポートした画像のinspector画面から吹き出しのmeshtypeをFullRectにします。

SpriteEditorで吹き出しの画像を9分割にしました。

ウィンドウのサイズが変わるときに真ん中の部分が伸びていきます。

分割サイズを決めたらapllyを押して保存します。

イメージを作成してウィンドウの画像をアタッチしました。

imagetypeをslicedにしました。

imageにContentSizeFittorとVarticalLayoutGroupを追加します。

このコンポーネントを追加すると、子オブジェクトのサイズが変わったときに

親オブジェクトのサイズを自動で変えてくれます。

ContentsizefitterをPreferredSizeに変更しました。

verticalLayoutGroupのControlChildSizeにチェックを入れました。

paddingに数値を入力すると枠とメッセージの隙間の調整ができます。

imageの子オブジェクトにテキストを配置します。

文字の長さによってウィンドウのサイズが自動的に変わるようになりました。

一文字づつ表示する

imageの子オブジェクトのテキストをTextMeshProに変更します。

C#スクリプトを作成しました。名前はMessageにしました。

作成したスクリプトをTextMeshProにアタッチしました。

using TMPro;
using UnityEngine;


public class Message : MonoBehaviour
{
    [SerializeField] 
    private TextMeshProUGUI tmpmes;
    [SerializeField]
    private string[] serifu = new string[5];
    [SerializeField]
    private int kazu;
    [SerializeField]
    private int i;
    [SerializeField]
    private int j;

    [SerializeField]
    private float waittime;
    [SerializeField]
    private float ti;

    private void Start()
    {
        //表示したいテキストを入力する

        serifu[0] = "おはようございます";
        serifu[1] = "こんにちは";
        serifu[2] = "おやすみなさい";
        serifu[3] = "おつかれさまです。";
        serifu[4] = "さようなら";

        kazu= 0;
        i = 0;
        j = 0;

        //一文字づつ表示するときの待ち時間
        waittime = 0.1f;
        ti = 0f;
    }

    private void Update()
    {
        ti += Time.deltaTime;
        kazu = serifu[i].Length;
        tmpmes.text = serifu[i];

        if (Input.GetMouseButtonDown(0))
        {
            i = i + 1;
            j = 0;
        }

        if (ti >= waittime)
        {
            j = j + 1;
            if (j > kazu)
            {
                j = kazu;
            }

            ti = 0f;
        }
        tmpmes.maxVisibleCharacters = j;
    }

}

TextMeshProのinspector画面からtmpmesを設定しました。

一文字づつ文字が表示されるようになり、クリックで次のセリフに切り替わるようになりました。

まとめ

Unityでセリフの長さに応じてサイズが変わるメッセージウィンドウを作成し、さらにセリフを一文字ずつ表示する機能を実装する方法をご紹介しました。この記事が、ゲーム開発の一助となれば幸いです。Unityは複雑に見えるかもしれませんが、基本を押さえれば誰でも素晴らしいゲームを作ることができます。挑戦してみましょう!

おすすめのアセット

スポンサーリンク
C-BA memo
タイトルとURLをコピーしました