[Flutter] TextFieldにプレースホルダーを設定する方法

どうも、ちょげ(@chogetarou)です。

TextField（テキストフィールド）に、プレースホルダーを設定するにはどうしたらいいのでしょうか？

方法

TextFieldにプレースホルダーを設定するには、「hintText引数」を使います。

「hintText」は、「InputDecoration」の引数で、指定した文字列をプレースホルダーにします。

使用例

 TextField(
       decoration: InputDecoration(
              hintText: "プレースホルダー",
        ),
)

実際には、TextFieldの「decoration引数」に「InputDecoration」を渡します。

この「InputDecoration」の「hintText引数」に、プレースホルダーとなる文字列を設定します。

テキストの設定

「InputDecoration」には、「hintStyle」という引数があります。

この引数には、プレースホルダーのフォント、サイズ、文字色などを設定することが出来ます。

             TextField(
                decoration: InputDecoration(
                    hintText: "プレースホルダー",
                    hintStyle: TextStyle(
                        color: Colors.red, 
                        fontStyle: FontStyle.italic)),
              )

まとめ

TextFieldにプレースホルダーを設定するには、「InputDecoration」の「hintText引数」を使います。

また、プレースホルダーのフォントや文字色などの設定は変更することが出来ます。