Как загрузить несколько списков в одном списке? - PullRequest
0 голосов
/ 10 октября 2019

Я работаю над приложением флаттера, в котором я хочу показать каналы, я хочу показать 1-й список (горизонтальный список) с 4 тренировками, 2-й список (вертикальный список) с 4 сообщениями, 3-й список (горизонтальный список) с 4тренеры и 4-й список снова 4 сообщения. В конце списка есть кнопка «Загрузить еще» и после нажатия на кнопку снова повторяется 1-й шаг, то есть 4 тренировки, 4 сообщения, 4 тренера и 4 сообщения. Мой вопрос: как лучше всего отобразить этот тип просмотра?

Видео Для очистки моих точек

Ответы [ 2 ]

0 голосов
/ 10 октября 2019

Вот пример того, чего вы хотите достичь:

List<List<String>> lists = [["A1","A2","A3","A4","A5"],["B1","B2","B3"],["C1","C2","C3","C4","C5"],["D1","D2","D3"]];

Widget buildCard(String text) {
  return Container(
    margin: EdgeInsets.all(4.0),
    padding: EdgeInsets.all(40.0),
    alignment: Alignment.center,
    color: Colors.lightGreenAccent,
    child: Text(text),
  );
}

Widget buildHorizontalList(List<String> sublist) {
  return SizedBox(
    height: 200.0,
    child: ListView.builder(
      scrollDirection: Axis.horizontal,
      itemCount: sublist.length,
      itemBuilder: (context, index) => buildCard("${sublist[index]}"),
    ),
  );
}

Widget buildVerticalList(List<String> sublist) {
  return ListView.builder(
    shrinkWrap: true,
    physics: NeverScrollableScrollPhysics(),
    itemCount: sublist.length,
    itemBuilder: (context, index) {
      return buildCard("${sublist[index]}");
    },
  );
}

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: ListView.builder(
        itemCount: lists.length + 1,
        itemBuilder: (context, index) {
          if (index <= lists.length - 1) {
            return index.isEven ? buildHorizontalList(lists[index]) : buildVerticalList(lists[index]);
          }
          return RaisedButton(
            child: Text('Load More'),
            onPressed: () {
              setState(() {
                lists.addAll([["X1","X2","X3","X4","X5"],["Y1","Y2","Y3"]]);
              });
            },
          );
        }),
  );
}

Редактировать: Я добавил функциональность кнопки «Загрузить еще», в основном кнопка просто обновляет переменную «списки» (список, который содержит все подсписки). Затем ListViews создаются в соответствии с содержимым списков.

0 голосов
/ 10 октября 2019

Не можете ли вы вместо того, чтобы показывать каждый listview в другом listview, просто показать все это в SingleChildScrollView, а затем просто добавить все listviews в row виджет.

SingleChildScrollView(
   child: Column(
      children<widget>[
         // Put listviews here.
      ],
   ),
),
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...