Widget dari list

Termasuk bagian Aplikasi Pertamamu dalam perjalanan Flutter di Coddy. Pelajaran 29 dari 32.

Menulis satu Text untuk setiap item akan memakan waktu lama, dan cara ini akan bermasalah saat list berubah. Dart bisa membuatkan widget untukmu, dengan for di dalam list:

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

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

Bacanya: untuk setiap color di dalam colors, tambahkan Text(color). Column menerima tiga widget Text, dan jika kamu menambahkan warna keempat ke list, widget Text keempat akan muncul dengan sendirinya.

Tantangan

Mudah

Kolom hanya menampilkan dua planet pertama. Tampilkan keempatnya secara berurutan dengan satu for pada list planets, bukan dengan dua baris Text.

Coba sendiri

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