ListView: Menampilkan Daftar Data

Penjelasan

ListView.builder() menampilkan koleksi data sebagai daftar SCROLLABLE secara efisien — berbeda dengan Column biasa yang me-render SEMUA anaknya sekaligus, ListView.builder() cuma me-render item yang TERLIHAT di layar (lazy loading), penting untuk performa daftar panjang. itemCount menentukan jumlah item, itemBuilder membangun widget tiap item berdasarkan index-nya.

Contoh Konsep

final List<String> bahasa = ['Dart', 'JavaScript', 'PHP'];

ListView.builder(
    itemCount: bahasa.length,
    itemBuilder: (context, index) {
        return ListTile(
            title: Text(bahasa[index]),
        );
    },
)

Praktikum

Buat List<Map<String, dynamic>> produk berisi 3 item {'id': ..., 'nama': ...}. Tampilkan sebagai ListView.builder() dengan ListTile menampilkan nama tiap produk.

Editor Latihan

Ketik/edit bebas di sini untuk latihan — kode ini tidak dijalankan.

Tips

SELALU pakai ListView.builder() (bukan ListView biasa dengan children berisi list panjang) untuk daftar data yang jumlahnya bisa besar/dinamis — ListView biasa langsung merender SEMUA item sekaligus di awal, sedangkan .builder() cuma merender yang terlihat, jauh lebih hemat memori untuk daftar panjang.