Question

我正在尝试使用Dart和Flutter动态创建表。 Something like this表行数将根据传入的JSON文件而变化。

我已经阅读并完成了所有Flutter教程，可以动手操作并阅读Table和ListBuilder类上的文档，但是它们都不能完全完成我想做的事情，因为这些示例要么仅动态创建单个ListItem，要么所有数据和/或Widget都经过硬编码。

我也尝试过这样做： Table dynamicTable = new Table();然后使用

动态添加子窗口小部件

dynamicTable.add(TableRow(
children: [
    Text("test1"),
    Text("test2"),
    Text("test3"),
]
));

但是我收到一条错误消息：“无法添加到无法修改的列表”。

任何有关如何完成此操作的技巧将不胜感激。

Answer 1

此函数动态创建一个表：

  Widget createTable() {
    List<TableRow> rows = [];
    for (int i = 0; i < 100; ++i) {
      rows.add(TableRow(children: [
        Text("number " + i.toString()),
        Text("squared " + (i * i).toString()),
      ]));
    }
    return Table(children: rows);
  }

Answer 2

首次获取记录列表

List<PriceDetailsView> priceDetailsList = MockDataSource.getPriceDetailsDataList();

现在创建一个空的表行列表：

List<TableRow> priceTableRows = [];

将提取列表中的详细信息添加到此行列表中：

for(PriceDetailsView priceDetalis in priceDetailsList){
      priceTableRows.add(TableRow(children: [Text(priceDetalis.priceType), Text(priceDetalis.priceValue)]));
    }

现在使用此行列表创建表：

Table priceTable = Table(children: priceTableRows);

Answer 3

实际上很简单！您所要做的就是列出TableRows，并将其放入表的children参数中。例如

List<TableRow> tableRows = [];
// dynamically make TableRows and add them to the list

然后您可以执行以下操作：

Table(
   children: tableRows,
   // other stuff
)

Flutter-动态创建表

3 个答案: