Соединение двух ListViews в один во флаттер - PullRequest
1 голос
/ 26 апреля 2020

Мне нужно перечислить элементы в моем проекте флаттера, и мне нужно, чтобы они просматривались один за другим, используя 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

Итак, есть идеи, как добавить оба списка в один просмотр списка?

1 Ответ

1 голос
/ 26 апреля 2020

Вы можете объединить два List в один ListView следующим образом:

  Scaffold(
        body: Column(
          children: <Widget>[
            Expanded(
              child: ListView(
                children: list1//list1 is a dummy list of String I created for demonstration
                    .map(
                      (listElement) => Text(//return your own widget instead of this
                        listElement,
                        style:
                            TextStyle(fontSize: 40, color: Colors.cyanAccent),
                      ),
                    )
                    .toList()
                      ..addAll(
                        list2.map(//list2 also is a dummy list of String I created for demonstration
                          (listElement) => Text(//return your own widget instead of this
                            listElement,
                            style: TextStyle(
                                fontSize: 40, color: Colors.cyanAccent),
                          ),
                        ),
                      ),
              ),
            ),
          ],
        ),
      ),
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...