我正在尝试为Flutter应用程序构建一个简单的登录页面。我已经成功构建了TextFields和Login / Signin按钮。我想添加一个水平ListView。当我运行代码时,我的元素消失了,如果我在没有ListView的情况下做到了,那也很好。如何正确执行此操作?
return new MaterialApp( home: new Scaffold( appBar: new AppBar( title: new Text("Login / Signup"), ), body: new Container( child: new Center( child: new Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ new TextField( decoration: new InputDecoration( hintText: "E M A I L A D D R E S S" ), ), new Padding(padding: new EdgeInsets.all(15.00)), new TextField(obscureText: true, decoration: new InputDecoration( hintText: "P A S S W O R D" ), ), new Padding(padding: new EdgeInsets.all(15.00)), new TextField(decoration: new InputDecoration( hintText: "U S E R N A M E" ),), new RaisedButton(onPressed: null, child: new Text("SIGNUP"),), new Padding(padding: new EdgeInsets.all(15.00)), new RaisedButton(onPressed: null, child: new Text("LOGIN"),), new Padding(padding: new EdgeInsets.all(15.00)), new ListView(scrollDirection: Axis.horizontal, children: <Widget>[ new RaisedButton(onPressed: null, child: new Text("Facebook"),), new Padding(padding: new EdgeInsets.all(5.00)), new RaisedButton(onPressed: null, child: new Text("Google"),) ],) ], ), ), margin: new EdgeInsets.all(15.00), ), ), );
您可以检查控制台输出。它显示错误:
在performResize()期间引发了以下断言:水平视口的高度不受限制。视口在横轴上扩展以填充其容器,并约束其子代以使其在横轴上的范围匹配。在这种情况下,将为水平视口提供无限量的垂直空间以进行扩展。
您需要在水平列表中添加高度限制。例如,将容器包装在高度以下的容器中:
Container( height: 44.0, child: ListView( scrollDirection: Axis.horizontal, children: <Widget>[ RaisedButton( onPressed: null, child: Text("Facebook"), ), Padding(padding: EdgeInsets.all(5.00)), RaisedButton( onPressed: null, child: Text("Google"), ) ], ), )