Study
Flutter

Forms & TextField

Penjelasan

TextField adalah widget input teks — nilainya dikelola lewat TextEditingController (dibuat di initState, WAJIB di-dispose di dispose() untuk mencegah memory leak) atau lewat callback onChanged untuk reaksi tiap ketikan berubah.

Contoh Konsep

class FormNama extends StatefulWidget {
    const FormNama({super.key});

    @override
    State<FormNama> createState() => _FormNamaState();
}

class _FormNamaState extends State<FormNama> {
    final TextEditingController _controller = TextEditingController();

    @override
    void dispose() {
        _controller.dispose(); // WAJIB, cegah memory leak
        super.dispose();
    }

    @override
    Widget build(BuildContext context) {
        return TextField(
            controller: _controller,
            decoration: const InputDecoration(labelText: 'Nama'),
            onChanged: (value) => print('Diketik: $value'),
        );
    }
}

Praktikum

Buat StatefulWidget FormEmail dengan TextEditingController _emailController. Buat TextField terhubung ke controller itu, decoration labelText "Email". Jangan lupa dispose() controller-nya.

Editor Latihan

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

Tips

Lupa memanggil _controller.dispose() di method dispose() adalah kesalahan umum yang menyebabkan MEMORY LEAK — TextEditingController tetap "hidup" di memori walau widget-nya sudah tidak ditampilkan lagi, kalau ini terjadi berulang (mis. user bolak-balik ke halaman form), aplikasinya lama-lama makin lambat.