Bacancy Technology

Bacancy Technology represents the connected world, offering innovative and customer-centric information technology experiences, enabling Enterprises, Associates and the Society to Rise™.

12+

Countries where we have happy customers

1050+

Agile enabled employees

World wide offices

12+

Years of Experience

Agile Coaches

Certified Scrum Masters

1000+

Clients projects

1458

Happy customers

Flutter

April 4, 2024

How to Change TextField’s Height and Width?

In Flutter, we can change the height and width of a TextField widget using the decoration property and its contentPadding attribute.

Also we can adjust height and width using the SizedBox widget, by wrapping TextField inside it.

Eg. 1 :

const Center(
 child: SizedBox(
   width: 200.0,
   child: TextField(
     decoration: InputDecoration(
       contentPadding: EdgeInsets.symmetric(
         vertical: 25.0,
         horizontal: 10.0,
       ),
       border: OutlineInputBorder(),
       hintText: 'Enter text here',
     ),
   ),
 ),
),

Output:

Eg. 2 :

const Center(
 child: SizedBox(
   width: 200.0,
   height: 30,
   child: TextField(
     decoration: InputDecoration(
       contentPadding: EdgeInsets.symmetric(horizontal: 10.0),
       border:  OutlineInputBorder(),
       hintText: 'Enter text here',
     ),
   ),
 ),
),