[Flutter]TextFormFieldの入力欄とエラーメッセージの間隔を変えるには？

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

TextFormFieldの入力する欄とエラーメッセージの間にある余白を変える方法を紹介します。

方法

TextFormFieldの入力欄とエラーメッセージの間隔を変えるには、InputDecorationを使います。

まず、TextFormFieldの引数「decoration」にInputDecorationを指定します。

次に、InputDecorationの引数「errorStyle」にTextStyleを指定します。

そして、TextStyleの引数「height」にエラーテキストの高さを指定します。

TextFormField(
  decoration: InputDecoration(
    errorStyle: TextStyle(
      height: /*エラーテキストの高さ*/,
    ),
  ),
),

TextStyleの引数「height」の値を変えると、入力欄とエラーメッセージの間隔が変化します。

使用例

以下は、使用例です。

TextFormField(
  decoration: InputDecoration(
    errorStyle: TextStyle(
      height: 5,
    ),
    border: OutlineInputBorder(),
  ),
  validator: (value) {
    return 'Error Message';
  },
),

[Flutter]TextFormFieldの右側にクリアボタンを追加するには？

TextFormFieldの右側にクリアボタンを追加する方法を紹介します。

www.choge-blog.com

2021.12.06

[Flutter]入力中のTextFormFieldの枠線の色を設定するには？

入力中のTextFormFieldの枠線の色を設定する方法を紹介します。

www.choge-blog.com

2021.12.06

[Flutter]TextFormFieldのフォーカスが外れた時に処理をするには？

TextFormFieldのフォーカスが外れた時に処理をする方法を紹介します。

www.choge-blog.com

2021.12.06

[Flutter]TextFormFieldのフォーカスを外すには？

TextFormFieldのフォーカスをボタンなどを使って外す方法を紹介します。

www.choge-blog.com

2021.12.06