How to create an input field in Flutter

Question

Hi Guys,

I have created one app using Material Design. I want to add one input field in this design. How can I do that?

Answer 1

Hi@akhtar,

There are different ways to create an input field. But the easiest way is using the TextField method. It is the most commonly used text input widget. By default, a TextField is decorated with an underline. You can add a label, icon, inline hint text, and error text by supplying an InputDecoration as the decoration property of the TextField. I have attached one example below. This example shows how to create a TextField that will obscure input. The InputDecoration surrounds the field in a border using OutlineInputBorder and adds a label.

TextField(
obscureText: true,
decoration: InputDecoration(
  border: OutlineInputBorder(),
  labelText: 'Password', ),
 )