我想制作一个简单的屏幕,在一列中显示多个文本字段,上面显示一些内容,下面显示一个按钮。在第一次尝试时,没有singleChildScrollView,我得到了一个“renderFlex overflowed”错误,可以通过将textfield放在singleChildScrollView中来解决。
现在我有一个问题,当我选择任何文本字段并弹出键盘时,singleChildScrollView在我的屏幕上放置的太高。我希望它基本上保持在原处,因为在singlechildscrollview下面有足够的(黄色)空间来放置键盘。
This Gif shows how my app behaves.
This Gif shows the behavior that I would expect.
我尝试将代码从FlatApp-Flutter example应用到我的应用程序,但找不到真正修复我问题的部分。
有人知道我如何控制键盘向上推动singlechildscrollview的程度吗?或者我如何解决这个问题?谢谢。

Scaffold(
    backgroundColor: Colors.yellow,
    body: new SingleChildScrollView(
        controller: _scrollController,
        child: new Container(
          margin: EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 10.0),
          color: Colors.orange,
          child: new Column(children: <Widget>[
            new Container(
              margin: EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 20.0),
              height: 200.0,
              width: 200.0,
              color: Colors.grey,
              child: new Center(
                child: Text("Show some stuff"),
              ),
            ),
            new Container(
              color: Colors.blue,
              child: new Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  new TextField(
                    decoration: InputDecoration(labelText: "Label 1"),
                  ),
                  new TextField(
                    decoration: InputDecoration(labelText: "Label 2"),
                  ),
                ],
              ),
            ),
            new RaisedButton(
              child: const Text('Start'),
              color: Theme.of(context).accentColor,
              textColor: Colors.white,
              elevation: 4.0,
              splashColor: Colors.blueGrey,
              onPressed: () {
                // Perform some action
                //button1(context);
              },
            ),
          ]),
        )));

}

最佳答案

我修好了。在执行我的导航时,我无意中将我的脚手架放在另一个脚手架的主体内,因此我的结构如下:

Scaffold(
      appBar: AppBar(
        title: Text('My App'),
      ),
      body: ScaffoldShownInMyQuestion(),
    )

只返回singlechildscrollview,而不使用第二个脚手架将其环绕,并将其用作body修复了我的问题。

关于input - Flutter - 键盘弹出时,SingleChildScrollView位于屏幕顶部,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/52957344/

10-11 01:16