Flutter - 容器中的顶部对齐文本
Flutter - Top align text in Container
我试图将 $
文本留在容器的顶部,但即使使用 FractionalOffset(1.0, 0.0)
,$
文本仍在容器的中间继续。
如何将 $
留在容器顶部?
body: new Card(
child: new Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
new Container(
padding: new EdgeInsets.only(top: 16.0),
child: new Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Container(
alignment: new FractionalOffset(1.0, 0.0),
child: new Text(
'$ ',
style: new TextStyle(
fontSize: 20.0,
fontFamily: 'Roboto',
color: new Color(0xFF26C6DA),
)
)
),
new Text(
'3,435.23',
style: new TextStyle(
fontSize: 35.0,
fontFamily: 'Roboto',
color: new Color(0xFF26C6DA)
),
)
],
),
),
new Text('general balance'),
],
),
),
试着给你的 Row
一个 CrossAxisAlignment
的 CrossAxisAlignment.start
。这是你的想法吗?
body: new Card(
child: new Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
new Container(
padding: new EdgeInsets.only(top: 16.0),
child: new Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Text(
'$ ',
style: new TextStyle(
fontSize: 20.0,
fontFamily: 'Roboto',
color: new Color(0xFF26C6DA),
)
),
new Text(
'3,435.23',
style: new TextStyle(
fontSize: 35.0,
fontFamily: 'Roboto',
color: new Color(0xFF26C6DA)
),
)
],
),
),
new Text('general balance'),
],
),
),
右对齐
Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Container()
],)
我试图将 $
文本留在容器的顶部,但即使使用 FractionalOffset(1.0, 0.0)
,$
文本仍在容器的中间继续。
如何将 $
留在容器顶部?
body: new Card(
child: new Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
new Container(
padding: new EdgeInsets.only(top: 16.0),
child: new Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Container(
alignment: new FractionalOffset(1.0, 0.0),
child: new Text(
'$ ',
style: new TextStyle(
fontSize: 20.0,
fontFamily: 'Roboto',
color: new Color(0xFF26C6DA),
)
)
),
new Text(
'3,435.23',
style: new TextStyle(
fontSize: 35.0,
fontFamily: 'Roboto',
color: new Color(0xFF26C6DA)
),
)
],
),
),
new Text('general balance'),
],
),
),
试着给你的 Row
一个 CrossAxisAlignment
的 CrossAxisAlignment.start
。这是你的想法吗?
body: new Card(
child: new Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
new Container(
padding: new EdgeInsets.only(top: 16.0),
child: new Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Text(
'$ ',
style: new TextStyle(
fontSize: 20.0,
fontFamily: 'Roboto',
color: new Color(0xFF26C6DA),
)
),
new Text(
'3,435.23',
style: new TextStyle(
fontSize: 35.0,
fontFamily: 'Roboto',
color: new Color(0xFF26C6DA)
),
)
],
),
),
new Text('general balance'),
],
),
),
右对齐
Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Container()
],)