我怎样才能有一个动态 ListView 和一些静态行? 我想创建一个关于公司产品的页面,客户检查他们的产品,关于,在页面的第一页我有一些详细信息行,例如产品的目的地、维特、.... 我有一个垂直时间线来显示更多细节,但我有一些错误,我该如何解决它?
Widget build(BuildContext context) {
return Scaffold(
body: new Container(
padding: EdgeInsets.symmetric(vertical: 20.0),
child: new ListView(
children: <Widget>[
new Flexible(
child: new ListView(children: <Widget>[
new Container(
padding: EdgeInsets.symmetric(vertical: 20.0),
child: Column(
children: <Widget>[
new Column(
children: <Widget>[
new Text("Package Details",
style: new TextStyle(
fontWeight: FontWeight.w600,
color: Color(0xffd01818),
fontSize: 25.0,
)),
new Container(
//padding: new EdgeInsets.symmetric(vertical: 0.0),
child: new Row(
children: <Widget>[
new Expanded(
child: new Container(
padding:
EdgeInsets.symmetric(vertical: 5.0),
alignment: Alignment.center,
decoration: new BoxDecoration(
borderRadius: new BorderRadius.all(
Radius.circular(10.0)),
color: Color(0xffffe88e),
),
child: new Row(
crossAxisAlignment:
CrossAxisAlignment.center,
mainAxisAlignment:
MainAxisAlignment.center,
children: <Widget>[
new Text(
"Packages Count:",
style: new TextStyle(
fontWeight: FontWeight.w400,
),
),
],
))),
new Expanded(
child: new Container(
padding:
EdgeInsets.symmetric(vertical: 5.0),
alignment: Alignment.center,
decoration: new BoxDecoration(
borderRadius: new BorderRadius.all(
Radius.circular(10.0)),
color: Color(0xffff25b43),
),
child: new Row(
crossAxisAlignment:
CrossAxisAlignment.center,
mainAxisAlignment:
MainAxisAlignment.center,
children: <Widget>[
new Text(
"istanbul (IST)",
style: new TextStyle(
fontWeight: FontWeight.w400,
),
),
],
))),
],
),
),
new Container(
padding: new EdgeInsets.symmetric(vertical: 20.0),
child: new Row(
children: <Widget>[
new Expanded(
child: new Container(
padding:
EdgeInsets.symmetric(vertical: 5.0),
alignment: Alignment.center,
decoration: new BoxDecoration(
borderRadius: new BorderRadius.all(
Radius.circular(10.0)),
color: Color(0xffffe88e),
),
child: new Row(
crossAxisAlignment:
CrossAxisAlignment.center,
mainAxisAlignment:
MainAxisAlignment.center,
children: <Widget>[
new Text(
"Payment Method:",
style: new TextStyle(
fontWeight: FontWeight.w400),
),
],
))),
new Expanded(
child: new Container(
padding:
EdgeInsets.symmetric(vertical: 5.0),
alignment: Alignment.center,
decoration: new BoxDecoration(
borderRadius: new BorderRadius.all(
Radius.circular(10.0)),
color: Color(0xffff25b43),
),
child: new Row(
crossAxisAlignment:
CrossAxisAlignment.center,
mainAxisAlignment:
MainAxisAlignment.center,
children: <Widget>[
new Text(
'2',
style: new TextStyle(
fontWeight: FontWeight.w400),
),
],
))),
],
),
),
new Container(
// padding: new EdgeInsets.symmetric(vertical: 20.0),
child: new Row(
children: <Widget>[
new Expanded(
child: new Container(
padding:
EdgeInsets.symmetric(vertical: 5.0),
alignment: Alignment.center,
decoration: new BoxDecoration(
borderRadius: new BorderRadius.all(
Radius.circular(10.0)),
color: Color(0xffffe88e),
),
child: new Row(
crossAxisAlignment:
CrossAxisAlignment.center,
mainAxisAlignment:
MainAxisAlignment.center,
children: <Widget>[
new Text(
"Origin:",
style: new TextStyle(
fontWeight: FontWeight.w400),
),
],
))),
new Expanded(
child: new Container(
padding:
EdgeInsets.symmetric(vertical: 5.0),
alignment: Alignment.center,
decoration: new BoxDecoration(
borderRadius: new BorderRadius.all(
Radius.circular(10.0)),
color: Color(0xffff25b43),
),
child: new Row(
crossAxisAlignment:
CrossAxisAlignment.center,
mainAxisAlignment:
MainAxisAlignment.center,
children: <Widget>[
new Text(
"2",
style: new TextStyle(
fontWeight: FontWeight.w400),
),
],
))),
],
),
),
],
),
],
)),
]),
),
new Row(
children: <Widget>[
new ListView.builder(
itemBuilder: (BuildContext context, int index) {
return new Stack(
children: <Widget>[
new Padding(
padding: const EdgeInsets.only(left: 50.0),
child: new Card(
margin: new EdgeInsets.all(20.0),
child: new Container(
width: double.infinity,
height: 200.0,
color: Colors.green,
),
),
),
new Positioned(
top: 0.0,
bottom: 0.0,
left: 35.0,
child: new Container(
height: double.infinity,
width: 1.0,
color: Colors.blue,
),
),
new Positioned(
top: 100.0,
left: 15.0,
child: new Container(
height: 40.0,
width: 40.0,
decoration: new BoxDecoration(
shape: BoxShape.circle,
color: Colors.white,
),
child: new Container(
margin: new EdgeInsets.all(5.0),
height: 30.0,
width: 30.0,
decoration: new BoxDecoration(
shape: BoxShape.circle, color: Colors.red),
),
),
)
],
);
},
itemCount: 5,
)
],
)
],
),
));
}
}
[1]: /image/yKM8N.jpg
最佳答案
容器应该被赋予高度属性。
关于android - 错误垂直视口(viewport)被赋予无限高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59550326/