Flutter Tablet app keyboard covering text input

Question

Classic issue, but I've found that while there are a lot of great solutions out there for phones, for some reason they are not working on a tablet (simulator or actual device).

When I tap into a textfield, the keyboard opens and covers it. I've added a SizedBox with "MediaQuery.of(context).viewInsets.bottom" for the height so that when the keyboard opens I can scroll to the text field. But I need the screen to automatically scroll to the text field when the keyboard opens. I've tried putting the whole thing in a NestedScrollView and using the globalKey.currentState.innerController to animate up. But it only animates up a set amount, and I need it to animate to the specific text field.

I've looked at some plugins, but they require you to build things in a very specific way, and I'm working with a large application that can't be built around that.

I am not getting this issue on phones. Phones automatically scroll like they should. And I'm using the same code. Here's a snippit of one of my Widgets I'm having trouble with.

Container(
     constraints: BoxConstraints(minHeight: MediaQuery.of(context).size.height),
     padding: EdgeInsets.only(bottom: _containerPaddingBottom),
     decoration: BoxDecoration(
      image: DecorationImage( 
        image: widget.image,
        fit: BoxFit.cover,
       ),
     ),
          child: SingleChildScrollView(
              child: Container(
                padding: EdgeInsets.only(top: _containerPaddingTop),
                constraints: BoxConstraints(minHeight: MediaQuery.of(context).size.height - _buttonHeight - _containerPaddingTop - _bottomPadding),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Column(
                      children: [
                        Center(
                          child: Container(
                            width: _titleWidth,
                            margin: EdgeInsets.only(left: 19, right: 19, bottom: 21),
                            child: Text(
                              widget.screenTitle,
                              textAlign: TextAlign.center,
                              style: Theme.of(context).textTheme.headline4, 
                            ),
                          ),
                        ),
                        widget.mainContent,
                      ],
                    ),
                    Column(
                      children: [
                        widget.bottomContent,
                        SizedBox(
                          height: MediaQuery.of(context).viewInsets.bottom,
                        ),
                      ]
                    )
                  ],
                ),
              ),
            ),
        ),
    ```

Answer 1

So I found the problem! The tablet version of the screen for my app didn't have a Scaffold. Once I wrapped the screen in a Scaffold, it autoscrolled to not hide the text field when the keyboard was open.