Widgets à partir d’une liste

Fait partie de la section Votre première application du Journey Flutter de Coddy. Leçon 29 sur 32.

Écrire un Text par élément devient vite long, et cela ne fonctionne plus lorsque la liste change. Dart peut créer les widgets pour vous, avec une boucle for dans la liste :

List<String> colors = ['red', 'green', 'blue'];

Column(
  children: [
    for (String color in colors) Text(color),
  ],
)

Lisez cela ainsi : pour chaque color dans colors, ajoutez un Text(color). La colonne contient trois textes et, si vous ajoutez une quatrième couleur à la liste, un quatrième texte apparaît automatiquement.

Défi

Facile

La colonne n’affiche que les deux premières planètes. Affiche les quatre, dans l’ordre, avec une seule boucle for sur la liste planets au lieu des deux lignes Text.

Essayez vous-même

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    List<String> planets = ['Mercury', 'Venus', 'Earth', 'Mars'];
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Text(planets[0]),
              Text(planets[1]),
            ],
          ),
        ),
      ),
    );
  }
}