Flutter TextEditingController does not scroll above keyboard

Question

In android version, Flutter TextEditingController does not scroll above keyboard like default text fields do when you start typing in field. I tried to look in sample apps provi

Answer 1

This is an attempt to provide a complete answer which combines information on how to detect the focus from this StackOverflow post with information on how to scroll from Arnold Parge.

I have only been using Flutter for a couple days so this might not be the best example of how to create a page or the input widget.

The link to the gist provided in the other post also looks like a more robust solution but I haven't tried it yet. The code below definitely works in my small test project.

import 'package:flutter/material.dart';

class MyPage extends StatefulWidget {
  @override createState() => new MyPageState();
}

class MyPageState extends State {
  ScrollController _scroll;
  FocusNode _focus = new FocusNode();

  @override void initState() {
    super.initState();
    _scroll = new ScrollController();
    _focus.addListener(() {
      _scroll.jumpTo(-1.0);
    });
  }

  @override Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Some Page Title'),
      ),
      body: new DropdownButtonHideUnderline(
        child: new SafeArea(
          top: false,
          bottom: false,
          child: new ListView(
            controller: _scroll,
            padding: const EdgeInsets.all(16.0),
            children: [

              // ... several other input widgets which force the TextField lower down the page ...

              new TextField(
                decoration: const InputDecoration(labelText: 'The label'),
                focusNode: _focus,
              ),
            ],
          ),
        ),
      ),
    );
  }
}