我想制作一个简单的屏幕,在一列中显示多个文本字段,上面显示一些内容,下面显示一个按钮。在第一次尝试时,没有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/