键盘将TextFields推离屏幕 [英] Keyboard Pushes TextFields off screen

问题描述

我一直在处理Flutter中的一种奇怪情况，但我无法弄清.

I've been dealing with a strange situation in Flutter that I just can't figure out.

问题是，当我尝试在任何类型的可滚动小部件中使用任何类型的TextField时，当我点击TextField使键盘弹出时，键盘会将TextField推离屏幕.脚手架中的所有内容都是空白.

The problem is that when I attempt to use any kind of TextField in any kind of Scrollable Widget, when I tap the TextField for the keyboard to come up, the keyboard pushes the TextField off of the screen. Everything in the Scaffold is just blank.

我不能确切地说出发生了什么，但是有时似乎键盘似乎将可滚动视图的内容向上推过了视图，但有时似乎只是附加了一个巨大的白框覆盖上下文的键盘顶部.我已经做过几次实验，但是我无法确定确切的行为.

I can't exactly say for sure what is happening but sometimes it seems as if the keyboard pushes the content of the scrollable view up past the view but other times it seems that there just seems to be a giant white box attached to the top of the keyboard that covers the context. I've done several experiments but I can't pin the exact behavior down.

为清楚起见，我尝试使用SingleChildScrollView和ListView.行为是相同的.

To be clear, I've tried using SingleChildScrollView and a ListView. The behavior is the same.

我已经通读了整个线程，并尝试了变通方法，但均未成功: https://github.com/flutter/flutter/issues/10826

I've read through the whole of this thread and tried the workarounds with no success: https://github.com/flutter/flutter/issues/10826

我也尝试过使用以下解决方法: https://gist.github.com/collinjackson/50172e3547e959cba77e2938f2fe5ff5

I've also tried using this workaround: https://gist.github.com/collinjackson/50172e3547e959cba77e2938f2fe5ff5

但是，我不确定我是否遇到与这些线程完全相同的问题.

However, I am just not sure that I am having the exact same issue as those threads.

这是一个演示问题和一些屏幕截图的代码段.我是在公然做错什么吗?

Here is a code snippet that demonstrates the problem and some screenshots. Am I just doing something blatantly wrong?

class MakeEntryView extends StatefulWidget {

   @override
   State<StatefulWidget> createState() => new MakeEntryState();

}

class MakeEntryState extends State<MakeEntryView> {

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new SingleChildScrollView(
      child: new Container(
        child: new Column(
          children: <Widget>[
            new TextField(),
            new TextField(),
            new TextField(),
            new TextField(),
            new TextField(),
            new TextField(),
            new TextField(),
          ],
        ),
      ),
    )
  );
}

@override
void initState() {
  super.initState();
}

@override
void dispose() {
  super.dispose();
}

}

在按下文本字段之前

按下文本字段后

推荐答案

脚手架可以正确处理此问题:

The Scaffold has a properly to deal with this:

Scaffold(
  resizeToAvoidBottomPadding: false,

在极少数情况下，它不起作用，但是应该加以解决.

There are rare cases where it doesn't work but that should take care of it.

这篇关于键盘将TextFields推离屏幕的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！