Bottom overflow by 30px

Question

I face a problem by wrapping TextField with new Expanded(). When try to search something in textfield its show me bottom overflow by <

Answer 1

I faced a similar problem and fixed it in the following way:

You can wrap it with SingleChildScrollView or with a ListView.

Scaffold(
    body: Container(
      height: MediaQuery.of(context).size.height * .50,
      child: SingleChildScrollView(
          child: Column( 
              ....
          )
      )
   )
 );

Answer 2

There are two solutions to this problem.

1. Add resizeToAvoidBottomPadding: false to your Scaffold

   Scaffold(
    resizeToAvoidBottomPadding: false,
    body: ...)
   

2. Put your FilstList(searchtext: _text,) inside a scrollableView (like SingleChildScrollView or ListView)

Answer 3

Used SigleChildScrollView

sample code

Scaffold(
          appBar: //AppBar
          body: SingleChildScrollView(
            padding: EdgeInsets.symmetric(horizontal: 5.0, vertical: 3.0),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,

Answer 4

Use Scaffold property "resizeToAvoidBottomPadding: false" and "SingleChildScrollView" as parent of Scaffold body:

      home: Scaffold(
          resizeToAvoidBottomPadding: false,
          appBar: AppBar(
            title: Text("Registration Page"),
          ),
          body: SingleChildScrollView(
            child: RegisterUser(),
          )),

this will solve issue.

Answer 5

put resizeToAvoidBottomPadding as false in Scaffold:

  Scaffold(
    resizeToAvoidBottomPadding: false, 

update it is better solution: remove Column and put instead it ListView

because if you run this app on smaller device bottom items will disappear and hide from the show screen and that will be bad for App users.

Answer 6

Do two way

NO1.Scaffold( resizeToAvoidBottomPadding: false, ) The problem is when you do this body content never gone top when you select input box..

Best practice

SingleChildScrollView widget