はじめに
前回の記事では、ランダムな数値を生成し、それを一定間隔で表示・非表示にする方法を解説しました。本記事では、プレイヤーが解答を入力するための仕組み(InputFieldの実装) について詳しく説明します。
この記事で学べること
- UnityのInputFieldを活用してプレイヤーの入力を受け取る方法
- スクリプトで入力値を取得し、処理する方法
- 入力が完了したときのイベント処理
- 「GameManager」スクリプトによるプロジェクト管理
UnityのInputFieldとは?
InputField
は、プレイヤーが文字や数値を入力するためのUIコンポーネントです。フラッシュ暗算アプリでは、表示された数値の合計をプレイヤーに入力してもらうため、この機能を利用します。
InputFieldの設置と基本設定
本章に入る前に前章で作成したProblemTextとGamePlayViewは邪魔になるので、非表示にしておきます。また、BackGroundの子オブジェクトにGameObject「GameInputView」を作成しておきます。

InputFieldの追加
- GameInputViewの子オブジェクトとして「UI」→「Input Field – TextMeshPro」を作成
- Placeholder に「Input Answer…」と記入
Text
の初期値を空に設定
※ テキストは中央表示、Font Sizeを「20」、FontStyleを「B」に変更しています。名前はご自由に変更してください。

ボタンの追加(送信ボタン)
- GameInputViewの子オブジェクトとして「UI」→「Button – TextMeshPro」を作成
- Buttonの子オブジェクトのTextMeshProに「OK」と設定
※ 今回は日本語は入力しないでください。

GameManagerでプロジェクトを管理する方法
ここまで出来たら、先にプロジェクトのビュー表示を管理しましょう。
まず、「GameManager」(全体を管理するクラス)というスクリプトを作成します。作成が終われば、以下のソースコードを入力してください。(ちなみにスクリプトを作成すると歯車マークになります。)
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class GameManager : MonoBehaviour
{
public FlashAnzanManager flashAnzanManager;
//シリアライズ化(他スクリプトから変更不可だがインスペクターで設定可能)
[SerializeField]
private GameObject gamePlayView;
[SerializeField]
private GameObject gameInputView;
[SerializeField]
private GameObject gameResultView;
void Start()
{
//初期設定(SetActiveで表示、非表示できる)
gamePlayView.SetActive(true);
flashAnzanManager.problemText.gameObject.SetActive(true); //テキストからGameObjectを参照
gameInputView.SetActive(false);
gameResultView.SetActive(false);
}
//PlayViewからInputViewへ表示を切り替える関数
public void InputFromPlay()
{
//フラッシュ暗算の処理が終わったら入力画面を表示する。
gamePlayView.SetActive(false);
flashAnzanManager.problemText.gameObject.SetActive(false);
gameInputView.SetActive(true);
}
}
入力が終わったらHierarchyで右クリック→「Create Empty」でGameManagerObjectを作成します。
GameManagerObjectに「GameManager」スクリプトをアタッチし、flashAnzanManager、gamePlayView、gameInputView、gameResultViewにそれぞれオブジェクトをアタッチしましょう。(Hierarchyから!!!)

スクリプトで入力値を取得する方法
C#スクリプトで InputField の入力内容を取得して処理する方法と回答ボタンを実装します。プロジェクトも小規模なので前回作成した、「FlashAnzanManager」スクリプトに追加します。
using System.Collections;
using TMPro;
using UnityEngine;
using UnityEngine.UI;
//フラッシュ暗算を制御する
public class FlashAnzanManager : MonoBehaviour
{
public TextMeshProUGUI problemText;
public GameObject startButton; //追加(ボタンとしてではなくゲームオブジェクトとしている)
public TMP_InputField answerInput; //回答記入
public Button answerButton; //回答決定ボタン
public GameManager gameManager; //GameManagerクラス
public int sumAnswer; //表示したテキストの合計
public int loop_Number; //表示回数
void Start()
{
//ボタンを押したら回答判定をする関数の登録
answerButton.onClick.AddListener(CheckAnswer);
//初期化
sumAnswer = 0;
}
//Startボタン機能
public void StartButtonClick()
{
//ボタンは不要なので非表示(enabledはボタンでは非表示にならない)
startButton.SetActive(false);
//コルーチンを開始
StartCoroutine(DisplayNumbers());
}
//フラッシュ暗算制御
IEnumerator DisplayNumbers()
{
for (int i = 0; i< loop_Number; i++)
{
//テキストに1~9までのランダムな数字を表示
problemText.text = AnzanCalculation.GenerateRandomNumber(1, 9).ToString();
problemText.enabled = true; // テキストを表示
sumAnswer += int.Parse(problemText.text); //合計を計算
yield return new WaitForSeconds(1.0f);
problemText.enabled = false; // テキストを非表示
yield return new WaitForSeconds(0.5f);
}
gameManager.InputFromPlay();
}
//回答の正誤判定
public void CheckAnswer()
{
if (int.TryParse(answerInput.text, out int playerAnswer))
{
if (playerAnswer == sumAnswer)
{
Debug.Log("正解!");
}
else
{
Debug.Log("不正解!");
}
}
else
{
Debug.Log("数値を入力してください。");
}
}
}
「FlashAnzanManager」スクリプトに入力できたらanswerInputと answerButton、GameManagerをアタッチしましょう。
スクリプトへの記入が終わったら、実行して確認しましょう。上手くいっていれば正しい答えを入力するとConsoleで「正解!」と出てきます。
まとめ
本記事では、
- Unityの
InputField
を使ってプレイヤーの入力を受け取る方法 - スクリプトで
InputField
の入力を取得し、正誤判定を行う方法 Button
で解答を送信する方法- GameManagerでプロジェクトを管理する方法
を解説しました。
次回は、解答の正誤判定結果を画面に表示する方法 について詳しく解説します。引き続きフラッシュ暗算アプリを作っていきましょう!