Bottom owerflow when the keyboard pop up in flutter

Question

Layout is ok when there is no keyboard. But, when keyboard pop up bottom owerflowed.

How do i fix it?

wrap your widget in a SingleChildScrollView – Rubens Melo Aug 27 '19 at 16:56 — Rubens Melo, Aug 27 '19 at 16:56

score 0 · Answer 1 · edited Aug 28 '19 at 04:49

0

You need a Scroll Widget on top of the others. This is the best way, because the widgets will adjust to the keyboard. However you can also edit your Scaffold with:

resizeToAvoidBottomPadding: false

Or, try this one

Expanded(
    child: ListView(
        children: <Widget>[
            YourWidgets()
        ]
    )
)

edited Aug 28 '19 at 04:49

Sadisha

364
1
2
10

answered Aug 27 '19 at 17:02

Silent Tree

987
1
7
16

When i put this, keyboard covers a half of the layout..... – Sadisha Aug 27 '19 at 17:03
Yeah the resizeToAvoidBottomPadding shouldn‘t be changed. Just as an “emergency”. As I said it would be better if you wrap the whole thing in a scrollable widget. For example a ListView. – Silent Tree Aug 27 '19 at 17:16
I put my widget in a ListView, and then put the ListView in a Expanded widget. Problem solved. – Sadisha Aug 27 '19 at 17:24
By the way, Thank you. – Sadisha Aug 27 '19 at 17:26

score 0 · Accepted Answer · answered Aug 27 '19 at 17:29

Your widget gets resized whenever your keyboard gets focused as your widget is not scrollable and has finite height. So, what you can do is wrap your hole widget inside a SingleChildScrollView.

For Ex:

SingleChildScrollView(child:_buildYourWidget());

If your widget consist column as its top most layer then you should provide column an additional property that is mainAxisSize to minimum. So that Column will take the required height and SingleChildScrollView will be able to manage your content properly.

mainAxisSize:MainAxisSize.min

This will definitely solve your issue.

Thank you. This worked too.... – Sadisha Aug 27 '19 at 17:36 — Sadisha, Aug 27 '19 at 17:36

Bottom owerflow when the keyboard pop up in flutter

2 Answers2