4
votes

Flutter - Création dynamique de tableaux

J'essaye de créer dynamiquement des tableaux en utilisant Dart et Flutter. Quelque chose comme ça Le nombre de lignes du tableau changera en fonction du fichier JSON transmis .

J'ai lu et fait tous les didacticiels Flutter que je peux mettre la main sur et lire la documentation sur les classes Table et ListBuilder, mais aucun d'entre eux n'accomplit vraiment ce que j'essaie de faire, car le les exemples ne créent dynamiquement que des éléments de liste uniques ou toutes les données et / ou widgets sont codés en dur.

J'ai également essayé de faire cela en faisant: Table dynamicTable = new Table (); puis ajouter dynamiquement des widgets enfants avec

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

Mais j'obtiens une erreur disant "Impossible d'ajouter à une liste non modifiable" .

Tout conseil sur la façon d'accomplir ceci serait grandement apprécié.

flutter dart dynamic

1 commentaires

Pouvez-vous donner un exemple de votre JSON?

3 Réponses :

1
votes

C'est assez simple, en fait! Tout ce que vous avez à faire est de créer une liste de TableRows et de la placer dans le paramètre children de votre table. Par exemple

Table(
   children: tableRows,
   // other stuff
)

Et puis vous pouvez simplement faire ceci:

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

1 commentaires

pouvez-vous en donner un exemple? échantillon de travail complet. @ naeem-hasan

3
votes

Cette fonction crée un tableau dynamiquement:

  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);
  }

1 commentaires

comment le faire en colum? par exemple List Colum = [];

1
votes

Première récupération de la liste des enregistrements

Table priceTable = Table(children: priceTableRows);

Créez maintenant une liste vide de lignes de tableau:

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

Ajoutez les détails de la liste cette liste de lignes:

List<TableRow> priceTableRows = [];

Créez maintenant votre tableau avec cette liste de lignes:

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

0 commentaires