gpt4 book ai didi

android - 将两个 ListViews 合并为一个

转载 作者:行者123 更新时间:2023-12-01 21:53:48 25 4
gpt4 key购买 nike

我必须列出我的 flutter 项目中的项目,我需要使用 2 ListView 一个接一个地查看它们,这里有更多详细信息:

列表

  List<List<theLineModel.Line>> moreThenOneLineList = [];
List<Station> mutualStationsList = [];
List<theLineModel.Line> oneLineList = [];

小工具

                           child: Column(
children: <Widget>[
Expanded(
child: ListView(
children: oneLineList.map((line) {
return GestureDetector(
onTap: () {
Navigator.pushNamed(
context, '/line_details',
arguments: {
'line': line,
'oneLine': true,
});
},
child: Card(
color: Colors.deepPurple,
elevation: 8,
child: Padding(
padding:
const EdgeInsets.all(8.0),
child: Column(
children: <Widget>[
Row(
mainAxisAlignment:
MainAxisAlignment
.spaceEvenly,
children: <Widget>[
Text(
"${line
.transportationType}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.center,
children: <Widget>[
Text(
"${line.startStation
.stationName}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.center,
children: <Widget>[
Icon(
Icons.arrow_downward,
color: Colors.white,
size: 30,
)
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.center,
children: <Widget>[
Text(
"${line.endStation
.stationName}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: <Widget>[
Text(
"${line.price} ${S
.of(context)
.le}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
Text(
"${line.notes}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),
],
),
),
),
);
}).toList(),
),
),
Expanded(
child: ListView(
children: moreThenOneLineList
.map((lineList) {
return GestureDetector(
onTap: () {},
child: Card(
color: Colors.blueAccent,
elevation: 8,
child: Padding(
padding:
const EdgeInsets.all(8.0),
child: Column(
children: <Widget>[
Row(
mainAxisAlignment:
MainAxisAlignment
.spaceEvenly,
children: <Widget>[
Text(
"${lineList[0]
.transportationType}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.center,
children: <Widget>[
Text(
"${chosenStations[0]
.stationName}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.center,
children: <Widget>[
Icon(
Icons.arrow_downward,
color: Colors.white,
size: 30,
)
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.center,
children: <Widget>[
Text(
"${mutualStationsList[moreThenOneLineList
.indexOf(
lineList)]
.stationName}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: <Widget>[
Text(
"${lineList[0]
.price} ${S
.of(context)
.le}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
Text(
"${lineList[0]
.notes}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),
Icon(
Icons.arrow_downward,
color: Colors.white,
size: 30,
),
Row(
mainAxisAlignment:
MainAxisAlignment
.spaceEvenly,
children: <Widget>[
Text(
"${lineList[1]
.transportationType}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.center,
children: <Widget>[
Text(
"${mutualStationsList[moreThenOneLineList
.indexOf(
lineList)]
.stationName}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.center,
children: <Widget>[
Icon(
Icons.arrow_downward,
color: Colors.white,
size: 30,
)
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.center,
children: <Widget>[
Text(
"${chosenStations[1]
.stationName}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: <Widget>[
Text(
"${lineList[1]
.price} ${S
.of(context)
.le}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
Text(
"${lineList[1]
.notes}",
style: TextStyle(
color:
Colors.white,
fontSize: 20),
),
],
),

],
),
),
),
);
}).toList(),
),
),
],
),

然后,由于两个列表都已添加到不同的 ListView,所以最后导致了空间和糟糕的页面,请检查图像。

enter image description here

那么,知道如何将两个列表添加到一个 ListView 吗?

最佳答案

这是使 ListView 更灵活的另一种方法:DartPad

使用...List连接多列表:

  Widget build(BuildContext context) {
// Demo listview items
List<String> list1 = [for (int i=0; i < 30;i++) i.toString()];
List<String> list2 = [for (int i=30; i < 50;i++) i.toString()];
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Expanded(
child: ListView(
children:[
// Some widgets here
const Text('List1'),
// list1 here
...list1.map((String text) => Text(text)).toList(),
// Some widgets between them
const Text('List2'),
// list2 here
...list2.map((String text) => Text(text)).toList(),
],),
),
],
),
);
}

关于android - 将两个 ListViews 合并为一个,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61432604/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com