【Flutter】TextFieldの入力欄に入力ヒント・ラベルを実装する

TextFieldまたはTextFormFieldの入力欄に入力ヒント・ラベルを実装する方法を紹介します。

フォームに入力ヒント・ラベルを実装するにはInputDecorationを使用します。

\ 世界最大級のオンライン学習サービス /

目次

フォームに入力ヒントを実装・装飾

TextField(
  decoration: InputDecoration(
    hintText: 'Enter your name',
    hintStyle: TextStyle(
      fontSize: 18,
      color: Colors.grey[600],
    ),
  ),
),

フォームに入力ヒントを実装するにはdecoration>InputDecorationからhintTextを使用します。

入力ヒントのテキストスタイルはhintStyleで調整できます。

フォームにラベルを実装・装飾

TextFormField(
  decoration: InputDecoration(
    labelText: 'Enter your name',
    labelStyle: TextStyle(
      fontSize: 16,
      color: Colors.grey[600],
    ),
  ),
),

フォームにラベルを実装するにはdecoration>InputDecorationからlabelTextを使用します。

ラベルのテキストスタイルはlabelStyleで調整できます。

一緒に読みたい

参考

  • URLをコピーしました!
目次