Unityアセットストア セール情報まとめはこちら
Unityアセットストア セール

今年最大級のセール ブラックフライデーセール開催!
約300のアセットが最大50%オフ!
24時間ごとに変わるフラッシュディールは最大70%オフ!
効率的に開発して、好きなゲームを作ろう

販売ページはこちら
ゲーム制作

【Unity】InputFieldを使用して名前入力欄を実装する方法

Unity アイキャッチ
記事内に広告が含まれています。
スポンサーリンク
赤かぶくん
赤かぶくん

ランキング機能を実装しようと思うんだけど、名前入力欄の作り方がわからない。

やり方を教えてほしい。

まつぼん
まつぼん

そんなお悩みにお答えします!

PlayFabでランキング機能を実装する際に、名前入力欄が欲しくなりますよね。

これはUnityのUIであるInputFieldを使うと実装できます。

本記事では、UnityでInputFieldを使用した名前入力欄を実装する方法をご紹介します。

スポンサーリンク

環境

Unity バージョン:2020.3.46f1

スポンサーリンク

InputFieldとは

InputFieldとは、簡単に言えば文字を入力するUIのことです。

Unity公式マニュアルはこちらです。

Input Field - Unity マニュアル
Input Field は見える UI 制御ではなく、編集可能な Text を作成する方法です。他の相互作用する UI のように、それ自体が見える UI 要素ではないので、 1 つ以上の視覚 UI 要素と組み合わせなければいけません。
スポンサーリンク

InputField 実装方法

InputFieldを設置するには、UIを追加します。

Hierarchy内で、右クリック → UI → InputFieldを選択。

すると、入力欄が作成されます。

とても簡単に実装できましたね。

InputField入力欄
スポンサーリンク

InputField 大きさ変更

入力欄の大きさを変更するには、InspectorのRectTransformから設定します。

お好みの大きさに変更してください。

スポンサーリンク

InputField Placeholderの文字変更

InputFieldにテキストが入力されていない場合に表示されます。

「名前入力」などのコメントを表示したいときに使用しましょう。

テキストを入力すると表示されなくなります。

以下のTextに「名前入力」と打ち込むと、

「Enter Text…」の表記が、

InputField入力欄

「名前入力」に変更されます。

スポンサーリンク

InputField Textの文字を前もって入力する

InputFieldにテキストを事前に入力したいときは、Textへ文字を入力します。

注意点としては、LineTypeはSingleLineだと日本語入力でエラーが出るので、MultiLineNewlineを選択しましょう。

これで日本語を表示することができました。

スポンサーリンク

InputField Textの文字数を制限する

InputFieldのTextの文字数を制限したいときは、CharacterLimitの数字を変更しましょう。

0は無制限に入力可能ですが、長すぎると管理上不便なので、私は8文字に設定しています。

お好みでどうぞ。

スポンサーリンク

InputField Textに入力した名前をランキングに送信する

On Value Chenged (String)は、InputFieldに入力した文字が変更されたタイミングで関数が呼び出されます。

On End Edit (String)は、InputFieldへの入力が完了したタイミングで関数が呼び出されます。

私は、On End Edit (String)に名前を更新する関数を登録して、ランキングにデータを送るように設定しています。

スポンサーリンク

InputField Textに入力した名前を再起動時にも表示する

再起動時にも入力欄に同じ名前を表示できるようにします。

例として、EasySaveを使用したコードはこちらです。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class SaveNameManager : MonoBehaviour
{
    //InputField型の変数を用意
    public InputField inputField;

    void Start()
    {
        //デフォルトの名前をユーザー、名前の変更があればそれを呼び出す
        inputField.text =ES3.Load("Name", defaultValue: "ユーザー");
    }

    public void SaveName()
    {
        //名前を保存
        ES3.Save("Name", inputField.text);
    }
}

このスクリプトをOn End Edit (String)に登録してください。

InputFieldへの入力が完了したタイミングでSaveName関数が呼び出されます。

InputFieldのテキスト(入力が反映されるテキスト)は、Text型を参照するとなぜか変更できません。なので、上記のとおりInputField型の変数を宣言しましょう。

スポンサーリンク

【Unity】InputFieldを使用して名前入力欄を実装する方法 まとめ

まとめアイキャッチ

本記事では、UnityでInputFieldを使用した名前入力欄の実装方法について紹介しました。

ランキングを実装する場合、名前入力欄は必須になります。

UnityのUIであるInputFieldを使うと、とても簡単に名前入力欄を作ることができるので、ぜひやってみてください。

本記事が、皆さんの参考になれば幸いです。

タイトルとURLをコピーしました