我已关注 tutorial并完全实现了水平滚动列表。 现在,我想做的是创建一个垂直列表,其中每一行都是一个水平列表。
我尝试了不同的方法,但我一直认为应该可以简单地将水平列表设置为垂直列表的子级,但它不起作用。
我的代码是:
Widget build(BuildContext context) {
return new Scaffold(
body: Container(
margin: EdgeInsets.symmetric(vertical: 20.0),
height: 160.0,
child: ListView(
children: <Widget>[
Text("First line"),
HorizontalList(),
Text("Second line"),
HorizontalList()
],
)
),
drawer: new MyNavigationDrawer(),
);
}
我也尝试将各种水平列表放在 ListTiles 中,但结果是一样的。
最佳答案
我猜你想要的是另一个列表中的一个列表 这是您遵循的示例程序的改编 构建方法是这样的:
Widget build(BuildContext context) {
Widget horizontalList1 = new Container(
margin: EdgeInsets.symmetric(vertical: 20.0),
height: 200.0,
child: new ListView(
scrollDirection: Axis.horizontal,
children: <Widget>[
Container(width: 160.0, color: Colors.red,),
Container(width: 160.0, color: Colors.orange,),
Container(width: 160.0, color: Colors.pink,),
Container(width: 160.0, color: Colors.yellow,),
],
)
);
Widget horizontalList2 = new Container(
margin: EdgeInsets.symmetric(vertical: 20.0),
height: 200.0,
child: new ListView(
scrollDirection: Axis.horizontal,
children: <Widget>[
Container(width: 160.0, color: Colors.blue,),
Container(width: 160.0, color: Colors.green,),
Container(width: 160.0, color: Colors.cyan,),
Container(width: 160.0, color: Colors.black,),
],
)
);
return new Scaffold(
appBar: new AppBar(
title: new Text(widget.title),
),
body: new Center(
child: new Container(
child: ListView(
scrollDirection: Axis.vertical,
children: <Widget>[
horizontalList1,
horizontalList2,
],
),
),
), // This trailing comma makes auto-formatting nicer for build methods.
);
结果是这样的:
希望对你有帮助
https://stackoverflow.com/questions/51089041/