[Flutter]「TextField」に枠線を付ける方法

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

文字入力欄を作る「TextFieldウェジェット」に枠線を付ける方法を解説します。

方法

TextFieldウェジェットに枠線を付けるには、「InputDecoration」の「border引数」を使います。

TextField(
      decoration: InputDecoration(
             border: OutlineInputBorder(),
      ),
)

「InputDecoration」の「border引数」に、「OutlineInputBorder」を指定します。

そうすることで、TextFieldに枠線を付けることが出来ます。

OutlineInputBorderは、枠線の色や幅、角の丸みなどの設定を持っています。

もし、枠線の細かい設定をしたいなら、引数で指定して下さい。

まとめ

TextFieldに枠線を付けるには、「InputDecoration」の「border引数」に、「OutlineInputBorder」を指定します。

また、枠線の細かい設定を行う場合は、「OutlineInputBorder」の引数を使います。

Enterprise AI, Built Your Way | You.com

From APIs to full-service support, You.com empowers every business to build secure, scalable, and trustworthy AI apps an...

www.codegrepper.com

OutlineInputBorder class - material library - Dart API

API docs for the OutlineInputBorder class from the material library, for the Dart programming language.

api.flutter.dev