我尝试这种布局
卡
行
扩展(flex:4)
扩展(flex:4)
现在我想使用Column I的MainAxisAlignment.spaceBetween看到该列没有父行的高度。因为图像的高度例如是200.0
扩展(4)小部件我将分割卡分为两侧,因为原始图像尺寸更大。如果我手动设置父ROW的高度然后工作正常,但我不想手动设置高度。
如果我尝试使用另一个Expanded in Column,我就有例外。
还有一个问题,Container和SizedBox之间有什么不同?
感谢您的帮助
编辑:添加代码和屏幕
@override
Widget build(BuildContext context) {
return new Card(
child: new Container(
padding: new EdgeInsets.only(left: 5.0),
child: new Row(
mainAxisSize: MainAxisSize.max,
children: <Widget>[new Expanded(flex: 4, child: new Image.network(_tour.hotel.thumbnail)), new Expanded(flex: 4, child: _buildInfoColumn())],
),
),
);
}
Widget _buildInfoColumn() {
return new Container(
padding: new EdgeInsets.only(left: 3.0),
child: new Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween, //this is not working
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Text(_tour.hotel.name, style: new TextStyle(fontSize: 14.0, fontFamily: 'Lato')),
new Text(_tour.hotel.country + ', ' + _tour.hotel.locality, style: new TextStyle(fontSize: 12.0, fontFamily: 'Lato', color: Colors.grey))
],
),
new Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
new Container(
padding: new EdgeInsets.only(left: 5.0),
child: new Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
new Text(_tour.finalPrice.toString() + ',-', style: new TextStyle(fontSize: 15.0, fontWeight: FontWeight.bold, fontFamily: 'Lato', color: Colors.lightGreen)),
new Text(((_tour.discount > 0) ? ' ' + _tour.price.toString() + ',-' : ''), style: new TextStyle(fontSize: 12.0, fontFamily: 'Lato', color: Colors.red)),
],
),
),
new Container(
padding: new EdgeInsets.all(2.0),
decoration: new BoxDecoration(color: Colors.red),
child: new Text(
'-' + _tour.discount.toString() + '%',
style: new TextStyle(fontWeight: FontWeight.bold, fontSize: 11.0, fontFamily: 'Lato', color: Colors.white),
))
],
),
new Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
new Row(
children: <Widget>[_buildTransportIcon(), _buildDates()],
),
new Container(
padding: new EdgeInsets.only(right: 5.0),
child: new Row(
children: ((_tour.hotel.stars != null)
? new List.generate(
_tour.hotel.stars,
(i) => new Icon(
Icons.star,
color: Colors.orangeAccent,
size: 13.0,
))
: []),
))
],
)
],
)
);