Flutter: I want my screen to automatically scroll up when selecting Textfield so that my submit button is not hidden?

Question

I'm currently wrapping my column widget in a SingleChildScrollView() and setting resizeToAvoidBototmInset: false on Scaffold(), yet the screen does not automatically scroll up when selecting the Textfields. Ideally, I want the submit button to show when user is inputting data into the second field. Currently it hides on some devices when the keyboard is visible.

Scaffold(
    resizeToAvoidBottomInset: false,
    body: SingleChildScrollView(
        child: SafeArea(
            child: Stack(
                children: <Widget> [
                    CustomPaint(),
                    Column(children: <Widget>[
                        TextField(), 
                        TextField(), 
                        RaisedButton(),
                    ])
                ]
            )
        )
    )
)

This is what the current format looks like. I do not have a FocusNode() on the textfield and did think about raising the textfield based on when the keyboard is visible, but that disturbs my custom paint background and did not want to have that effect.

From a conceptual point of view, is there something I'm missing that is preventing the screen from automatically scrolling up.

Answer 1

Try with this code:

GlobalKey globalKey = GlobalKey();

...


TextField(
  onTap: ()async{
    await Future.delayed(Duration(milliseconds: 500));
    RenderObject object = globalKey.currentContext.findRenderObject();
    object.showOnScreen();
  },
), 
RaisedButton(
  key: globalKey,
  onPressed: (){},
),