Cómo alinear verticalmente el texto dentro del contenedor
Tengo un Wrapdiseño con algunos Containerniños. Cada contenedor tiene un niño,Text
Tiene Containeruna altura fija pero un ancho flexible.
¿ Cómo puedo alinear verticalmente el Textinterior Container? Intenté usarlo alignment: Alignment.centerLeft, pero el ancho del contenedor abarca todo el padre.
No puedo establecer el ancho del Containerporque no sé qué ancho tendrá el texto.
Wrap(
spacing: 3.0, // gap between adjacent chips
runSpacing: 3.0, // gap between lines
children: <Widget>[
new Container(
height: 30,
alignment: Alignment.centerLeft,
padding: EdgeInsets.symmetric(vertical: 5, horizontal: 10),
decoration: BoxDecoration(
color: Colors.grey[200],
borderRadius: BorderRadius.circular(15),
),
child: Text(
'hallo',
style: TextStyle(background: _paint,),
),
),
...
Así debería verse, pero el texto rojo debería estar centrado verticalmente:
Aceptado
Envuelva su Containerinterior Columny coloque el mainAxisAlignmentcentro en el centro.
new Container(
height: 30,
padding: EdgeInsets.symmetric(vertical: 5, horizontal: 10),
decoration: BoxDecoration(
color: Colors.grey[200],
borderRadius: BorderRadius.circular(15),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'hallo',
style: TextStyle(background: _paint),
),
],
),
),
Container(
alignment: Alignment.center,
height: 100,
width: 100,
margin: EdgeInsets.all(10),
decoration: BoxDecoration(
border: Border.all(width: 1), color: Colors.blueGrey),
child:Text('Enter a url')
)
