ユーザー名などのテキスト入力をできるようにしよう!
Unityでゲーム開発をする際に、ゲームのログイン機能を実装する上でユーザー名やパスワードの入力をできるようにする必要があります。そんな時に、便利な方法をPCのみならずスマホ対応の仕方、リアルタイムでテキストを更新する方法を解説します。
InputField追加しよう!
Unityで実行中にテキスト入力をする場合には、UIのInputFieldオブジェクトを使用する必要があります。
そこで今回は、InputFieldオブジェクトの解説をしていきます。
Hierarchy→UI→InputFieldで追加します。
InputFieldの使い方
InputFieldのインスペクターを見ると下のほうにこのようなイベント関数が表示されています。
関数の意味
On Value Change (String) | 文字が変わったらイベントが実行される |
On End Edit (String) | 文字の入力が終わったらイベントが実行される |
スクリプトを作成
Assets→Create→C#Script
今回はUIを読み込むスクリプトなので、スクリプト名はUIMangerスクリプトとします。
UIManagerスクリプト
|
Hierarchy→GameObjectAssetsフォルダにスクリプトがあるだけではスクリプトを使うことができないので、Hierarchyにスクリプトを使うためのオブジェクトを用意します。
GameObjectにUIManagerスクリプトを追加します。
InputFiledをUIManagerにドラックアンドドロップして追加します。
入力が終わったらイベントを実行してほしいので、先ほど説明したInputFiledのインスペクターのOn End Editを設定します。
On End Editのプラスボタンをクリックします。
HierarchyのGameObjectをインスペクターにドラックアンドドロップして追加します。
No Functionになっているので先ほど作成した関数を設定します。
UIManager→EndInputText
これでInputFiledオブジェクトに入力された文字をデバックログに表示する準備が整いました。
実行してください。
テストと入力してEnterを押してみました。
応用編:スマホ対応
パソコンの場合はEnterボタンがあるので、大丈夫ですがスマホの場合はないので、ボタンを作成し、ボタンを押したときにイベントを発生させる必要があります。
Hierarchy→UI→Button
Canvasの子オブジェクトとしてButtonを作成します。
ButtonのインスペクターでOn Clickの設定をします。
On Clickのプラスボタンを押して下さい。
HierarchyのGameObjectをインスペクターにドラックアンドドロップして追加します。
No Functionになっているので先ほど作成した関数を設定します。
UIManager→EndInputText
最後に、InputFiledのインスペクターのOn End Editを設定を解除します。
マイナスボタンをクリックしてください。
以上で設定が終わりました。
実行してみましょう!
テキストを入力してButtonをクリックするとデバックログにテキストが表示されます。
応用編:リアルタイムにテキストを更新
今度は、On Value Changeを使うことで、InputFiledオブジェクトで打った文字をリアルタイムでテキストに反映させます。
Hierarchy→UI→Button
Canvasの子オブジェクトとしてTextを作成します。
UIManagerスクリプトを少し変更します。
UIManagerスクリプト
|
GameObjectのインスペクターにあるUIManagerスクリプトにTextをドラックアンドドロップして追加します。
InputFiledオブジェクトのOn Value Changeの設定をしていきます。
On Value Changeのプラスボタンをクリックします。
HierarchyのGameObjectをインスペクターにドラックアンドドロップして追加します。
No Functionになっているので先ほど作成した関数を設定します。
UIManager→RealTimeEdit
これで準備は整いました。
実行して文字を打ってみましょう!
InputFiledに打った文字がリアルタイムでテキスト表示されます。
まとめ
コメント