我有以下代码:
class _MyHomePageState extends State {
@override
Widget build(BuildContext context) {
// This method is rerun every time setState is called, for instance as done
// by the _incrementCounter method above.
//
// The Flutter framework has been optimized to make rerunning build methods
// fast, so that you can just rebuild anything that needs updating rather
// than having to individually change instances of widgets.
return new Scaffold(
body: new Column(
children: [
new Container(
color: JBTheme.colorGreenBrand,
height: 130.0,
alignment: Alignment.bottomLeft,
child: new Center(
child: new Align(
alignment: Alignment.bottomCenter,
child: new Container(
color: JBTheme.colorOrange,
constraints: new BoxConstraints(maxWidth: 270.0),
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
new Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [
new Image.asset("flags/flag_dk.png"),
new Container(
margin: const EdgeInsets.only(top: 4.0, bottom: 4.0),
child: new Text("Danmark"),
),
new Text("DKK")
],
),
new Expanded(child: new Image.asset("images/arrow.png")),
new Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [
new Image.asset("flags/flag_us.png"),
new Container(
margin: const EdgeInsets.only(top: 4.0, bottom: 4.0),
child: new Text("USA"),
),
new Text("USD")
],
)
],
),
),
),
),
),
new Expanded(
child: new Container(
color: JBTheme.colorGreyMedium,
child: new Column(
children: [
new Expanded(child: new Container()),
new Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: new Card(
elevation: -8.0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15.0),
),
child: new Container(
width: 200.0,
height: 30.0,
color: JBTheme.colorWhite,
child: new Stack(
children: [
new TextField(
textAlign: TextAlign.center
)
],
)
),
)
)
],
),
)),
new Container(
height: 260.0,
color: JBTheme.colorGreenMint,
)
],
));
}
}
我没想到我的所有布局都将整个键盘高度向上移动,我希望它只向上移动足够多,以使焦点突出的TextField可见(并且不会产生错误)。我该如何解决,为什么会发生?
谢谢
索伦
答案 0 :(得分:2)
这是Flutters的方法,向我们展示了使用键盘时用户视线将隐藏多少像素的内容。尝试将resizeToAvoidBottomPadding设置为false ...来自文档:
主体(和其他浮动小部件)是否应该调整大小 避免窗口底部填充。
{
"JPY=X": {
"eventsData": {},
"firstTradeDate": {
"date": 846633600,
"formatted_date": "1996-10-30"
},
"currency": "JPY",
"prices": [
{
"high": 112.13700103759766,
"volume": 0,
"formatted_date": "2018-07-31",
"low": 111.69999694824219,
"adjclose": 111.80799865722656,
"date": 1533078000,
"close": 111.80799865722656,
"open": 111.79499816894531
},
{
"high": 111.7239990234375,
"volume": 0,
"formatted_date": "2018-08-01",
"low": 111.33000183105469,
"adjclose": 111.62000274658203,
"date": 1533164400,
"close": 111.62000274658203,
"open": 111.63700103759766
},
{
"high": 111.78299713134766,
"volume": 0,
"formatted_date": "2018-08-02",
"low": 111.0999984741211,
"adjclose": 111.69000244140625,
"date": 1533250800,
"close": 111.69000244140625,
"open": 111.6989974975586
},
{
"high": 111.52200317382812,
"volume": 0,
"formatted_date": "2018-08-05",
"low": 111.16699981689453,
"adjclose": 111.23400115966797,
"date": 1533510000,
"close": 111.23400115966797,
"open": 111.21700286865234
},
{
"high": 111.36399841308594,
"volume": 0,
"formatted_date": "2018-08-06",
"low": 110.9990005493164,
"adjclose": 111.33999633789062,
"date": 1533596400,
"close": 111.33999633789062,
"open": 111.3280029296875
},
{
"high": 111.41999816894531,
"volume": 0,
"formatted_date": "2018-08-07",
"low": 110.83999633789062,
"adjclose": 111.34500122070312,
"date": 1533682800,
"close": 111.34500122070312,
"open": 111.34700012207031
},
{
"high": 111.1780014038086,
"volume": 0,
"formatted_date": "2018-08-08",
"low": 110.70999908447266,
"adjclose": 110.89199829101562,
"date": 1533769200,
"close": 110.89199829101562,
"open": 110.90299987792969
},
{
"high": 111.12799835205078,
"volume": 0,
"formatted_date": "2018-08-09",
"low": 110.51799774169922,
"adjclose": 111.09100341796875,
"date": 1533855600,
"close": 111.09100341796875,
"open": 111.06400299072266
}
],
"timeZone": {
"gmtOffset": 3600
},
"instrumentType": "CURRENCY"
},
"EURUSD=X": {
"eventsData": {},
"firstTradeDate": {
"date": 1070236800,
"formatted_date": "2003-12-01"
},
"currency": "USD",
"prices": [
{
"high": 1.169864296913147,
"volume": 0,
"formatted_date": "2018-07-31",
"low": 1.166534423828125,
"adjclose": 1.168961763381958,
"date": 1533078000,
"close": 1.168961763381958,
"open": 1.168961763381958
},
{
"high": 1.1669973134994507,
"volume": 0,
"formatted_date": "2018-08-01",
"low": 1.1604158878326416,
"adjclose": 1.1665889024734497,
"date": 1533164400,
"close": 1.1665889024734497,
"open": 1.1663848161697388
},
{
"high": 1.1612001657485962,
"volume": 0,
"formatted_date": "2018-08-02",
"low": 1.1562163829803467,
"adjclose": 1.1586008071899414,
"date": 1533250800,
"close": 1.1586008071899414,
"open": 1.1585606336593628
},
{
"high": 1.1570056676864624,
"volume": 0,
"formatted_date": "2018-08-05",
"low": 1.1530966758728027,
"adjclose": 1.1562297344207764,
"date": 1533510000,
"close": 1.1562297344207764,
"open": 1.156136155128479
},
{
"high": 1.1609008312225342,
"volume": 0,
"formatted_date": "2018-08-06",
"low": 1.1552013158798218,
"adjclose": 1.1558021306991577,
"date": 1533596400,
"close": 1.1558021306991577,
"open": 1.155748724937439
},
{
"high": 1.1629259586334229,
"volume": 0,
"formatted_date": "2018-08-07",
"low": 1.1574609279632568,
"adjclose": 1.1602946519851685,
"date": 1533682800,
"close": 1.1602946519851685,
"open": 1.1603351831436157
},
{
"high": 1.1621150970458984,
"volume": 0,
"formatted_date": "2018-08-08",
"low": 1.156176209449768,
"adjclose": 1.1610760688781738,
"date": 1533769200,
"close": 1.1610760688781738,
"open": 1.1610087156295776
},
{
"high": 1.1539349555969238,
"volume": 0,
"formatted_date": "2018-08-09",
"low": 1.1396141052246094,
"adjclose": 1.1523923873901367,
"date": 1533855600,
"close": 1.1523923873901367,
"open": 1.1528706550598145
}
],
"timeZone": {
"gmtOffset": 3600
},
"instrumentType": "CURRENCY"
},
"GBPUSD=X": {
"eventsData": {},
"firstTradeDate": {
"date": 1070236800,
"formatted_date": "2003-12-01"
},
"currency": "USD",
"prices": [
{
"high": 1.314578652381897,
"volume": 0,
"formatted_date": "2018-07-31",
"low": 1.3097577095031738,
"adjclose": 1.3121638298034668,
"date": 1533078000,
"close": 1.3121638298034668,
"open": 1.3118367195129395
},
{
"high": 1.3128528594970703,
"volume": 0,
"formatted_date": "2018-08-01",
"low": 1.3018969297409058,
"adjclose": 1.3126115798950195,
"date": 1533164400,
"close": 1.3126115798950195,
"open": 1.3125253915786743
},
{
"high": 1.3043080568313599,
"volume": 0,
"formatted_date": "2018-08-02",
"low": 1.2976226806640625,
"adjclose": 1.3018121719360352,
"date": 1533250800,
"close": 1.3018121719360352,
"open": 1.301574945449829
},
{
"high": 1.3007283210754395,
"volume": 0,
"formatted_date": "2018-08-05",
"low": 1.292073130607605,
"adjclose": 1.3003562688827515,
"date": 1533510000,
"close": 1.3003562688827515,
"open": 1.300153374671936
},
{
"high": 1.2973533868789673,
"volume": 0,
"formatted_date": "2018-08-06",
"low": 1.2938284873962402,
"adjclose": 1.2944984436035156,
"date": 1533596400,
"close": 1.2944984436035156,
"open": 1.294247031211853
},
{
"high": 1.2961763143539429,
"volume": 0,
"formatted_date": "2018-08-07",
"low": 1.2855453491210938,
"adjclose": 1.2946659326553345,
"date": 1533682800,
"close": 1.2946659326553345,
"open": 1.2946659326553345
},
{
"high": 1.2911388874053955,
"volume": 0,
"formatted_date": "2018-08-08",
"low": 1.2843565940856934,
"adjclose": 1.2881617546081543,
"date": 1533769200,
"close": 1.2881617546081543,
"open": 1.2879958152770996
},
{
"high": 1.283861756324768,
"volume": 0,
"formatted_date": "2018-08-09",
"low": 1.2726045846939087,
"adjclose": 1.2828407287597656,
"date": 1533855600,
"close": 1.2828407287597656,
"open": 1.2830052375793457
}
],
"timeZone": {
"gmtOffset": 3600
},
"instrumentType": "CURRENCY"
}
}
这将避免调整大小,因此您至少将避免显示dev警告。但是请记住,用户不会看到某些内容,这也是开发人员的警告。
答案 1 :(得分:1)
有两个解决方案。
将resizeToAvoidBottomPadding: false
添加到您的支架中
Scaffold(
resizeToAvoidBottomPadding: false,
body: ...)
将Scaffold body
放在可滚动视图(如SingleChildScrollView或ListView)内
new Scaffold(
body: SingleChildScrollView(child: //your existing body
...)
您可以找到相似问题并回答here
答案 2 :(得分:1)
如果仅使用SingleChildScrollView,内容将失去垂直对齐方式。您还可以将SingleChildScrollView包裹在中心小部件中。
child: Center(
child: SingleChildScrollView(
child: Column(
children: <Widget>...
答案 3 :(得分:0)
此错误的完整说明和两个可能的解决方案可以在https://medium.com/zipper-studios/the-keyboard-causes-the-bottom-overflowed-error-5da150a1c660上的“中型”文章中找到。最后一个对我有用。