вложенный список числового массива в контейнере

Question

Я пытался использовать ListView Builder для создания контейнера с числами, отображаемыми в виде матрицы. Но почему-то мне не удалось получить то же самое в контейнере. Пожалуйста, помогите мне просмотреть этот код и указать, в чем я ошибаюсь или что нужно реализовать. К этому я прикрепляю свой фрагмент кода.

Это то, что я пытаюсь построить

   import 'package:flutter/material.dart';

class Ticket extends StatefulWidget {
  @override
  _TicketState createState() => _TicketState();
}

class _TicketState extends State<Ticket> {
  
  List tick = [
    {
      'tickets':[
        [
          [1,5,7,0,8,9,7,74,9],
          [1,15,7,10,8,79,27,74,9],
          [71,5,7,20,18,9,77,74,79],
        ],
        [
          [21,5,7,80,8,9,7,74,49],
          [31,15,7,10,18,79,7,74,19],
          [71,5,7,20,18,79,77,74,29],
        ],
      ]
    },
  ];

  
  @override

  Widget build(BuildContext context) {
    var h = MediaQuery.of(context).size.height;
    var w = MediaQuery.of(context).size.width;
    return Scaffold(
      body: SafeArea(
        child: Center(
          child: Container(
            child: ListView.builder(
              itemCount: tick.length,
                itemBuilder: (BuildContext context, index){
                return Center(
                  child: Container(
                    height: h/5,
                    decoration: BoxDecoration(
                      border: Border.all(
                        color: Colors.black,
                      ),
                    ),
                    child: Column(
                      children: <Widget>[
                        Center(child: Text('${tick[index]['tickets']}'))
                      ],
                    ),
                  ),
                );
                },
            ),
          ),
        ),
      ),
    );
  }
}

Это своего рода вывод, который я получаю.

Answer 1

Поскольку ваша структура данных немного сложна из-за наличия списка, содержащего карту и другие вложенные списки внутри карты, вам нужно сделать пару итераций по каждому списку, чтобы получить ожидаемый результат. Вы можете попробовать что-то вроде приведенного ниже кода, который можно протестировать на DartPad . См. Комментарии в коде, чтобы лучше понять, что делает каждая итерация.

import 'package:flutter/material.dart';

class Ticket extends StatefulWidget {
  @override
  _TicketState createState() => _TicketState();
}

class _TicketState extends State<Ticket> {
  List tick = [
    {
      'tickets': [
        [
          [11, 5, 7, 10, 28, 9, 7, 74, 59],
          [1, 15, 7, 10, 8, 79, 27, 74, 9],
          [71, 5, 7, 20, 18, 9, 77, 74, 79],
        ],
        [
          [21, 5, 7, 80, 8, 9, 7, 74, 49],
          [31, 15, 7, 10, 18, 79, 7, 74, 19],
          [71, 5, 7, 20, 18, 79, 77, 74, 29],
        ],
      ]
    },
  ];

  @override
  Widget build(BuildContext context) {
    var h = MediaQuery.of(context).size.height;
    var w = MediaQuery.of(context).size.width;
    return Scaffold(
      body: SafeArea(
        child: Center(
          child: Padding(
            padding: const EdgeInsets.all(20.0),
            child: Container(
              decoration: BoxDecoration(
                  border: Border.all(
                color: Colors.black,
              )),
              child: ListView.builder(
                itemCount: tick.length,
                itemBuilder: (BuildContext context, index) {
                  List tripleNumbersList = [];
                  List<Widget> cells = [];
                  List<Widget> rows = [];
                  //Get the lenght of the list inside the 'tickets' map
                  int ticketsCount = tick[index]['tickets'].length;

                  //Iterates over the lists inside the 'tickets' map
                  for (int i = 0; i < ticketsCount; i++) {
                    //Get the lists of lists inside the 'tickets' map
                    tripleNumbersList = tick[index]['tickets'][i];
                    //Iterates over each list with other 3 lists
                    for (int j = 0; j < tripleNumbersList.length; j++) {
                      //Get one of the 3 lists
                      List<int> list = tripleNumbersList[j];
                      //Iterates over the list of numbers
                      for (int k = 0; k < list.length; k++) {
                        //Adds a Widget to 'cells; list for each number
                        cells.add(Container(
                            height: 40,
                            width: 40,
                            decoration: BoxDecoration(
                              border: Border.all(
                                color: Colors.black,
                              ),
                              //color: Colors.pink
                            ),
                            child: GestureDetector(
                                onTap: () {
                                  print('Working');
                                },
                                child: Text(
                                  ' ${list[k]}  ',
                                  style: TextStyle(
                                      fontSize: 22.0,
                                      fontWeight: FontWeight.bold),
                                ))));
                      }
                      //Adds the list of 'cells' in the 'rows' list
                      rows.add(Row(children: cells));
                      cells = [];
                    }
                    //Adds a empty row to make space
                    rows.add(Row(children: [
                      Container(
                        height: 10,
                      )
                    ]));
                  }

                  return Center(
                    child: Container(
                      height: h,
                      decoration: BoxDecoration(
                        border: Border.all(
                          color: Colors.black,
                        ),
                        //color: Colors.pink
                      ),
                      child: Column(
                        //Adds the list of rows to the column
                        children: rows,
                      ),
                    ),
                  );
                },
              ),
            ),
          ),
        ),
      ),
    );
  }
}

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Ticket(),
    );
  }
}