Tips

【Unity】uGUIのInputFieldで入力した文字列をプログラムに渡す

【Unity】uGUIのInputFieldで入力した文字列をプログラムに渡す

InputFieldで入力した文字列をプログラムに渡す


今回はuGUIのInputFieldをつかったテキスト入力についてです。
InputFieldに入力した文字列をプログラムに渡す方法を紹介します。めっちゃ簡単です。

InputFieldの各プロパティについての詳しい解説はこちらをご覧ください。
→【Unity】uGUIのInputFieldコンポーネントを徹底解説

※使用しているUnityのバージョンは5.5.0f3です。
[Unity_317×90]

InputField の使い方


1.InputFieldを用意する

まずHierarchyにInputFieldを配置します。
「 Create ⇒ UI ⇒ InputField 」
ws000490
※UIオブジェクトを作成すると自動的にCanvasが作成され、その子要素に入ります。
EventSystemも自動で追加されます。
ws000489
今回は位置とサイズは適当です。見えていればOK。

■InputFieldの構成

・InputFieldオブジェクト
InputFieldコンポーネントを持っています。
テキストの入力に使用するTextオブジェクトと、Placeholderオブジェクトはここで紐づける必要があります。
デフォルトで子要素と紐づいています。

・Textオブジェクト (子要素) 
Textコンポーネントをもっています。
入力されたテキストがInputFieldに渡ります。

・Placeholderオブジェクト(子要素)
フィールドに何も入力されていないときに表示されるテキストを設定できます。
入力値としては扱われないため、あくまでフォームのガイドラインとして使用します。
いらなければ消しても問題ありません。

2.スクリプト

InputManager.cs
InputFieldを管理するためのスクリプトです。
フィールドへのフォーカスや、入力値の取得、リセットを行います。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
using UnityEngine;
using System.Collections;
using UnityEngine.UI;
 
public class InputManager : MonoBehaviour {
 
    InputField inputField;
 
 
    /// <summary>
    /// Startメソッド
    /// InputFieldコンポーネントの取得および初期化メソッドの実行
    /// </summary>
    void Start() {
 
        inputField = GetComponent<InputField>();
 
        InitInputField();
    }
 
 
 
    /// <summary>
    /// Log出力用メソッド
    /// 入力値を取得してLogに出力し、初期化
    /// </summary>
 
 
    public void InputLogger() {
 
        string inputValue = inputField.text;
 
        Debug.Log(inputValue);
 
        InitInputField();
    }
 
 
 
    /// <summary>
    /// InputFieldの初期化用メソッド
    /// 入力値をリセットして、フィールドにフォーカスする
    /// </summary>
 
 
    void InitInputField() {
 
        // 値をリセット
        inputField.text = "";
 
        // フォーカス
        inputField.ActivateInputField();
    }
 
}

3.InputFieldの設定

作成したスクリプトのメソッドと、InputFieldを紐づけます。

1.まず、InputManager.csをInputFieldオブジェクトにアタッチします。
2.アタッチしたらInputFieldコンポーネントの「On End Edit」にスクリプトをD&Dします。
3.右側のプルダウンから、「 InputManager ⇒ InputLogger 」と選択して、メソッドを紐づけます。
※メソッドはpublicでないとリストに表示されません。
ws000492

「On End Edit 」に紐づけたメソッドは、InputFieldからフォーカスが外れたタイミングで実行されます。(リターンキーを押すなど)
上にある「 On Value Changed 」は、入力値が変更されるたびにメソッドを実行します。

実行したいメソッドを持つスクリプトは、必ずしもInputFieldオブジェクトにアタッチする必要はありません。
スクリプトがアタッチされたオブジェクトを上記と同じようにD&Dで紐づければ同じようにメソッドを選択できます。

4.完成

動作確認をしてみましょう。
以下のように文字列を入力して、エンターキーを押したタイミングでログが出力されたら成功です。
フォームの値がリセットされることと、フォーカスが自動であたることも合わせて確認しましょう。
unity_skill_4

以上です!

ゲーム制作関連のオススメ連載リンク

とっても手軽なゲーム制作体験!
Unityゲーム開発基礎

実際のリリースゲームを題材にしたハンズオンゲーム制作連載
実践unityゲーム開発

Recent News

Recent Tips

Tag Search