Keyboard hides input field in flutter

Question

I've seen this question has been asked many times but none of the solutions is working for me. In the code below when clicking into the bio input field the keyboard overlaps this field. I tried with resizeToAvoidBottomInset: true, with and without SingleChildScrollView but the behaviour dosen't change.

Scaffold(
        resizeToAvoidBottomInset: false,
        appBar: ...
        body: SingleChildScrollView(child:
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 110, vertical: 16),
          child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                SizedBox(height: 40),
                Text('Username'),
                TextFormField(

                  controller: userName,
                  textAlign: TextAlign.left,
                ),
                Text('Screen name'),
                TextFormField(

                  controller: screenName,
                  textAlign: TextAlign.left,
                ),
                Text('Bio'),
                TextFormField(

                  controller: bio,
                  textAlign: TextAlign.left,
                ),

Update: I've created an empty app on which it works fine. So the code seems to be correct. I compared AndroidManifest.xml. The lines are the same:

<activity
    android:name=".MainActivity"
    android:launchMode="singleTop"
    android:theme="@style/LaunchTheme"
    android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
    android:hardwareAccelerated="true"
    android:windowSoftInputMode="adjustResize">

Has anyone an idea what could be different?

score 0 · Answer 1 · answered Jun 11 '20 at 10:32

I've tried this code and it is working fine.

Scaffold(
        resizeToAvoidBottomInset: false,
        body: SingleChildScrollView(child:
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 110, vertical: 16),
          child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                SizedBox(height: 40),
                Text('Username'),
                TextFormField(
                  textAlign: TextAlign.left,
                ),
                Text('Screen name'),
                TextFormField(
                  textAlign: TextAlign.left,
                ),
                Text('Bio'),
                TextFormField(
                  textAlign: TextAlign.left,
                ),]))));

If you still have problem please share some screenshot So it will be more helpful to understand.

Increase the height of the `SizedBox` so the bio input field is at the bottom of the screen. Now click on the input field. Now the keyoard shows and overlaps the input field. What I expect is the screen is resized and scrolling down so the input field stays visible. — MarcS82, Jun 11 '20 at 10:45

Keyboard hides input field in flutter

1 Answers1