请注意固定宽度width: 220.0,
。
ListView(
children: <Widget>[
Padding(padding: EdgeInsets.only(top:0.0),),
InkWell(
onTap: () {},
child: Container(
padding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 10.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Row(
children: <Widget>[
CircleAvatar(
radius: 28.0,
child: Text('1')
),
Container(
height: 40.0,
width: 220.0, // Must to have, otherwise, it overflows the Text 'AAAAAAAA' container on the right.
padding: EdgeInsets.only(left: 10.0, right: 10.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Expanded(child: Text('This is very very very very very'
' very very very long',
style: TextStyle(fontSize: 13.0), overflow: TextOverflow.ellipsis),
),
Expanded(child: Text('This is very very very very very'
' very very very long',
style: TextStyle(fontSize: 13.0), overflow: TextOverflow.ellipsis),
)
],
),
),
],
),
Container(
height: 40.0,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('AAAAAAAA', style: TextStyle(fontSize: 13.0)),
],
)
),
],
)
),
),
]
)
ListView(
children: <Widget>[
Padding(padding: EdgeInsets.only(top:0.0),),
InkWell(
onTap: () {},
child: Container(
padding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 10.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
CircleAvatar(
radius: 28.0,
child: Text('1')
),
Expanded(
child: Container(
height: 40.0,
padding: EdgeInsets.only(left: 10.0, right: 10.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text('This is very very very very very'
' very very very long',
style: TextStyle(fontSize: 13.0), overflow: TextOverflow.ellipsis),
Text('This is very very very very very'
' very very very long',
style: TextStyle(fontSize: 13.0), overflow: TextOverflow.ellipsis)
],
),
),
),
Container(
height: 40.0,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('AAAAAAAA', style: TextStyle(fontSize: 13.0)),
],
)
),
],
)
),
),
]
)
答案 0 :(得分:1)
如果您不为width
指定Container
,它将自动填充所有可用空间:
Container(
height: 40.0,
child: Column(
children: <Widget>[
Expanded(
child: Text(
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
overflow: TextOverflow.ellipsis,
)),
Expanded(
child: Text(
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
overflow: TextOverflow.ellipsis,
)),
],
))
如果要指定宽度,建议使用MediaQuery之类的值来确保该值在整个屏幕尺寸上都是均匀的,例如:
Container(
height: 40.0,
width: MediaQuery.of(context).size.width / 2,
child: ...
只需确保将所有内容包裹在MaterialApp
或WidgetsApp
中,MediaQuery
才能正常工作: