expanded examples example column listview layout flutter flutter-layout

listview - examples - stack flutter



¿Cómo agregar un ListView a una columna en Flutter? (2)

Estoy tratando de construir una página de inicio de sesión simple para mi aplicación Flutter. He construido con éxito los botones TextFields y Login / Signin. Quiero añadir un ListView horizontal. Cuando ejecuto el código, mis elementos desaparecen, si lo hago sin ListView, está bien otra vez. ¿Cómo puedo hacer esto correctamente?

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), ), ), );


Puede comprobar la salida de la consola. Imprime error:

La siguiente aserción fue lanzada durante performResize (): a la vista horizontal se le dio una altura ilimitada. Las vistas se expanden en el eje transversal para llenar su contenedor y restringir a sus hijos para que coincidan con su extensión en el eje transversal. En este caso, a una ventana horizontal se le dio una cantidad ilimitada de espacio vertical para expandirse.

Debe agregar una restricción de altura a su lista horizontal. Por ejemplo envolver en Contenedor con altura:

new Container( height: 44.0, child: 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"), ) ], ), )


Yo también tengo este problema. Mi solución es usar el widget Expanded para expandir el espacio restante.

new Column( children: <Widget>[ new Expanded( child: horizontalList, ) ], );