【簡単】InputFieldの文字数カウントを実装

2018.03.23

InputFieldにユーザーが文章を入力するという状況を作った際、色々と面倒を避けるために文字数を制限するということが多々あると思います。（制限しないと、例えばゲームのプレイヤー名に1000文字とか入力されたら表示がやばいことになるでしょう。）

普通に規定の文字数を超えていたら確定ボタンを押せない、みたいにすれば問題はないのですが、ユーザーが自分で文字数を数えなければならないのでやや不親切。

プレイヤー名だと8文字以内とかで普通に数えられるのであまり気にならないのですが、今回ツール系のアプリでコメントを300文字以内で入力してもらうという状況が起きたので、さすがに現在の文字数か残り文字数を表示してあげないと不親切すぎるということで文字数カウントを実装してみました。

まず、スクリプトを記述します。


[SerializeField] Text countText;
Color countColor = Color.white;
Color countLastColor = Color.red;
int limit = 300;

public void ChangeCount(string comment){  
  int leftNum = limit - comment.Length;  
  if (leftNum < 10)  
    countText.color = countLastColor;  
  else  
    countText.color = countColor;  
  
  countText.text = leftNum.ToString ();  
}

上記の変数とメソッドを適当なスクリプトに記述し、空のGameObjectやInputFieldを持ったオブジェクト、文字数カウントを表示するTextのオブジェクトなど何でもいいのでアタッチします。
countTextにはインスペクタから文字数カウントを表示するTextをドラッグ&ドロップで指定しておきます。

次に、InputFieldのインスペクタに「OnValueChanged」という部分があるので、そこに先ほどアタッチしたオブジェクトを指定し、ChangeCountを選択。

この際気をつけることとして、選択できるChangeCountが2つ表示されているので、そのうちの引数が表示されていないほう（Dynamic stringのほう）を選択してください。

InputFieldのOnValueChangedにstringを引数とするメソッドを指定すると、「Dynamic string」とそうでないものの2つを選択できます。
「Dynamic string」の場合は引数のstring型変数にその時点でのInputFieldのテキストが勝手に入ってくれます。（めっちゃ便利）

つまり、InputFieldのテキスト内容が変更されるとOnValueChangedに指定したChangeCount()メソッドが呼び出され、その引数であるcommentに変更後のテキスト内容が格納された状態でChangeCount()メソッド内の処理が実行されます。

また、今回は残り10文字を切ると文字数カウントの表示が赤色になるようにしました。
不要であればif〜else〜部分を消してください。

以上、InputFieldにおける文字数カウントの実装方法でした。

コメント