CODEWITHSUNDEEP
fluttertextformfield
Ashu
Ashu

Reputation: 97

How to create a custom height TextFormField in flutter?

I have a form where there are two TextFormField and one bottom button to validate it but the problem is that the screen is looking awkward. I want the **TextFormField ** the bottom one two cove the area between them completely even if there is no content and become scrollable once it reaches the bottom.enter image description here

the left one is what I have, but I want the right one, I tried to wrap it with Expandable or Container but it didn't work because I was using border property.

Upvotes: 2

Views: 2556

Answers (2)

littleironical
littleironical

Reputation: 1914

You just have to increase the maxLines inside the TextFormField to increase it's size like this:

Container(
  height: MediaQuery.of(context).size.height*0.5,//set the size according to your choice
  decoration: BoxDecoration(
    //Customize your container
    color: Colors.red,
    borderRadius: BorderRadius.all(Radius.circular(10.0)),
  ),
  child: TextFormField(
    maxLines: 30,//add any number of lines
    //Customize your text field
  )
),

Upvotes: 2

timilehinjegede
timilehinjegede

Reputation: 14043

You can achieve this by wrapping the TexFormField widget with an Expanded widget and setting the expands and maxLines property of the TextFormField to true and null respectively.

The TextFormField with take all the available space irrespective of the screen size, check the code provided below for an example:

  // wrap it with an Expanded widget
         Expanded(
           child: TextFormField(
             // set the keyboard type to multiline f
             keyboardType: TextInputType.multiline,
             // set maxlines to null
             maxLines: null,
             // set expands to true
             expands: true,
             decoration: InputDecoration(
                 isDense: true,
                 border: OutlineInputBorder(
                     borderSide: BorderSide(color: Colors.black)
                 )
             ),
           ),
         ),

Upvotes: 3

Related Questions