title: BottomSheet with autofocused TextField does not follow the keyboard on Web
body: <p>I've tried using MediaQuery, isScrollControlled, scroll containers, extra paddings, all from this other question: <a href="https://stackoverflow.com/questions/53869078/how-to-move-bottomsheet-along-with-keyboard-which-has-textfieldautofocused-is-t">How to Move bottomsheet along with keyboard which has textfield(autofocused is true)?</a></p>
  <p>But those solutions don't work for the web (for the phone): the bottom sheet either has extra spacing or the text field is going outside of the screen.</p>
  <p>I've build a sample app with several tricks applied to the bottom sheet and published it here: <a href="https://bottom-sheet-with-multiline-text.vercel.app/" rel="nofollow noreferrer">https://bottom-sheet-with-multiline-text.vercel.app/</a></p>
  <p><a href="https://i.stack.imgur.com/QxUVH.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/QxUVH.gif" alt="BottomSheet with autofocused TextField problems" /></a></p>
  <p>The whole project code is on GitHub: <a href="https://github.com/termosa/bottom-sheet-with-multiline-text/blob/master/lib/main.dart" rel="nofollow noreferrer">https://github.com/termosa/bottom-sheet-with-multiline-text/blob/master/lib/main.dart</a></p>
  <p>And here is the fixes I've tried to apply to the BottomSheet:</p>
  <pre class="lang-dart prettyprint-override"><code>  void openPure(BuildContext context) {
      showModalBottomSheet(
          context: context,
          isScrollControlled: true,
          builder: (context) =&gt; Container(
                padding: const EdgeInsets.all(40),
                child: TextField(
                  autofocus: autofocus,
                  keyboardType: TextInputType.multiline,
                  maxLines: null,
                ),
              ));
    }
  
    void openMediaQuery(BuildContext context) {
      showModalBottomSheet(
          context: context,
          isScrollControlled: true,
          builder: (context) =&gt; Padding(
              padding: EdgeInsets.only(
                  bottom: MediaQuery.of(context).viewInsets.bottom),
              child: Container(
                padding: const EdgeInsets.all(40),
                child: TextField(
                  autofocus: autofocus,
                  keyboardType: TextInputType.multiline,
                  maxLines: null,
                ),
              )));
    }
  
    void openScroll(BuildContext context) {
      showModalBottomSheet(
          context: context,
          isScrollControlled: true,
          builder: (context) =&gt; SingleChildScrollView(
                  child: Container(
                padding: const EdgeInsets.all(40),
                child: TextField(
                  autofocus: autofocus,
                  keyboardType: TextInputType.multiline,
                  maxLines: null,
                ),
              )));
    }
  
    void openScrollControlled(BuildContext context) {
      showModalBottomSheet(
          context: context,
          isScrollControlled: true,
          builder: (context) =&gt; SingleChildScrollView(
                  child: Container(
                padding: const EdgeInsets.all(40),
                child: TextField(
                  autofocus: autofocus,
                  keyboardType: TextInputType.multiline,
                  maxLines: null,
                ),
              )));
    }
  
    void openScrollControlledWithMediaQuery(BuildContext context) {
      showModalBottomSheet(
          context: context,
          isScrollControlled: true,
          builder: (context) =&gt; SingleChildScrollView(
              child: Padding(
                  padding: EdgeInsets.only(
                      bottom: MediaQuery.of(context).viewInsets.bottom),
                  child: Container(
                    padding: const EdgeInsets.all(40),
                    child: TextField(
                      autofocus: autofocus,
                      keyboardType: TextInputType.multiline,
                      maxLines: null,
                    ),
                  ))));
    }
  
    void openControlledWithMediaQuery(BuildContext context) {
      showModalBottomSheet(
          context: context,
          isScrollControlled: true,
          builder: (context) =&gt; Padding(
              padding: EdgeInsets.only(
                  bottom: MediaQuery.of(context).viewInsets.bottom),
              child: Container(
                padding: const EdgeInsets.all(40),
                child: TextField(
                  autofocus: autofocus,
                  keyboardType: TextInputType.multiline,
                  maxLines: null,
                ),
              )));
    }
  </code></pre>