第 41 章 Unity 入力フィールド UI

この章では、ユーザー入力の取得に役立つ入力フィールドについて学びます。メニューバーの「GameObject」→「UI」→「Input Field」をクリックし、位置を調整します。効果は次のとおりです。

階層パネルで、InputField UI 要素に 2 つの子要素 (1 つはプレースホルダー、もう 1 つはテキスト) が含まれていることがわかりました。次のように

同様に、検査パネルをチェックすると、画像コンポーネントと入力フィールドコンポーネントがあることがわかりました。Image コンポーネントは主に入力ボックスの背景として使用され、Input Field コンポーネントが核となります。

これらのプロパティの意味を簡単に紹介します。

Interactableの入力可否、デフォルト値の入力が可能です。

トランジション入力ボックスの状態が変化するときのトランジション効果。デフォルトは Color Tint の色の変化です。

ターゲットグラフィックは、入力ボックスで使用される画像ソースです。

標準色は入力ボックスのデフォルトの色です。

ハイライト色は入力ボックスのハイライト色です。

Pressed Color は入力ボックスがクリックされたときの色です。

[選択された色] は、入力ボックスが選択されているときの色です。

Disable Color は、入力ボックスが無効になっているときの色です。

[カラー乗数] はカラー乗数の値で、デフォルトは 1 です。

フェード期間は、入力ボックスの色が切り替わる時間 (秒単位) です。

上記のプロパティは、前のボタンと同じ効果があります。

Navigation と Visualize はナビゲーション設定に使用されますが、ここでは設定しません。

次に、テキストコンポーネントは、階層レイヤーパネルのサブゲームオブジェクト Text を明確に指しています。次に、次の Text プロパティは、入力ボックスの入力フィールドの内容を表します。これはユーザーによって入力されるため、空白のままにしておきます。文字制限は、入力フィールドに入力できる最大文字数の値です。Content Typeは入力内容の形式を表示するもので、デフォルトはStanard規格で、任意の文字テキストを入力できます。ユーザーに整数を入力してもらいたい場合は、[整数] を選択できます。もちろん、他の形式から選択することもできます。[行の種類] のデフォルト値は単一行 (単一行) です。つまり、ユーザーは 1 行のテキストのみを入力できます。次は Placeholder です。これは Hierarchy レイヤーパネルのサブゲームオブジェクト Placeholder に対応し、その機能は「プロンプトテキスト」です。ゲームオブジェクトをダブルクリックして、サブゲームオブジェクトプレースホルダーの検査パネルページに入ります。

率直に言うと、これは Text の単なる UI 要素であり、その「Text」値を変更できます。

次に、入力ボックスの入力フィールドの下にある「イベント」関連のプロパティを見てみましょう。

値の変更時この「イベント」は、入力ボックス内のテキストの内容が変更されたときに呼び出されます。

オンエンド編集この「イベント」は、ユーザーがテキストコンテンツの入力を完了した後に呼び出されます。

次に、前述の「ClickEventScript.cs」スクリプト内の上記 2 つのイベントに対応する 2 つのメソッドを追加します。

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

public class ClickEventScript : MonoBehaviour
{
    // 输入框元素上面的 InputField 组件
    private InputField inputField;

    void Start()
    {
        // 获取输入框UI元素上面的 InputField 组件
        inputField = GameObject.Find("InputField").GetComponent<InputField>();
    }

    public void testClick()
    {
        Debug.Log("点击了！");
    }

    public void testChange()
    {
        Debug.Log("Change:" + inputField.text);
    }

    public void testEnd()
    {
        Debug.Log("End:" + inputField.text);
    }
}

上記のコードは非常に単純です。InputField ゲームオブジェクト (UI 要素) の上にある InputField コンポーネントを見つけて、testChange メソッドと testEnd メソッドで入力ボックスの値を出力します。次に、これら 2 つのメソッドを入力ボックスの On Value Change イベントと On End Edit イベントにバインドする必要があります。

次に、プロジェクト全体を実行し、入力ボックスに「hello」と入力します。

On Value Change イベントについては説明する必要はありません。テキストの内容が変更されるとイベントメソッドがトリガーされます。On End Edit イベントがトリガーされるのは、通常、入力ボックスがカーソルフォーカスを失ったときです。たとえば、他の UI 要素をクリックしたときです。もちろん、入力ボックスのこれら 2 つのイベントは、状況に応じて使用できます。また、まったく使用することはできませんが、ボタンをクリックすると、入力ボックスのテキスト内容を直接取得することも可能です。

このコースに含まれるコンテンツは Baidu Netdisk に共有されています: https://pan.baidu.com/s/1e1jClK3MnN66GlxBmqoJWA?pwd=b2id

第 41 章 Unity 入力フィールド UI

Supongo que te gusta