Laporan Praktikum 3 Aplikasi Mobile

Mengimpor material design dari library Flutter dan membuat class AddTransactionScreen yang berbasis StatefulWidget. Konsep stateful digunakan karena isi formulir (seperti teks input dan pilihan dropdown) akan memiliki state yang terus berubah saat terjadi interaksi dengan pengguna.

Menginisialisasi class State untuk layar formulir tersebut. Pada bagian ini, dideklarasikan GlobalKey<FormState> sebagai pengontrol utama form yang dapat memicu validasi, TextEditingController untuk membaca input judul dan nominal, serta inisialisasi awal nilai dropdown kategori. Fungsi dispose() juga dideklarasikan guna membersihkan controller dari memori untuk mencegah memory leak setelah layar ditutup.

Membangun kerangka UI (User Interface) menggunakan Scaffold dengan tampilan AppBar. Bagian body utama dibungkus dengan SingleChildScrollView untuk menghindari error overflow pada layout saat layar mengecil akibat munculnya keyboard virtual. Di dalam scrollView tersebut, disematkan widget Form yang telah dikaitkan dengan _formkey.

Mengimplementasikan input kolom pertama menggunakan TextFormField untuk "Judul Transaksi". Input ini dilengkapi dengan logika validator bawaan untuk mengembalikan pesan error string ("Judul transaksi tidak boleh kosong") jika data yang dimasukkan kosong sebelum disimpan ke sistem.

Mengimplementasikan input kolom kedua untuk "Nominal (Rp)" dengan parameter tambahan berupa keyboardType: TextInputType.number. Hal ini memastikan bahwa sistem memunculkan keyboard angka. Terdapat dua tahapan validasi pada poin ini: memeriksa apakah input kosong dan mengecek apakah teks yang diketik benar-benar angka bulat yang valid (dengan int.tryParse).

Mengimplementasikan input ketiga menggunakan DropdownButtonFormField untuk menampilkan menu pilihan kategori. Pilihan yang diklik oleh pengguna akan secara dinamis memperbarui nilai variabel _selectedCategory lewat pemanggilan metode setState() pada saat event onChanged terjadi.

Membuat ElevatedButton yang berfungsi sebagai tombol "Simpan Transaksi". Tombol ini memiliki event onPressed yang secara otomatis mengeksekusi semua logika validasi kolom input (_formKey.currentState!.validate()). Jika semua input divalidasi dengan berhasil, sistem akan memunculkan pop-up pemberitahuan berupa SnackBar berwarna hijau dengan informasi data sukses ditambahkan.

Mendefinisikan titik awal program pada file main.dart. Class MyApp menjalankan framework MaterialApp, menyembunyikan tulisan banner debug, menentukan tema warna dasar deep purple, dan memanggil AddTransactionScreen sebagai tampilan home screen awal.

Output dari aplikasi setelah dijalankan.

Menambahkan deklarasi _dateController dengan menggunakan tipe TextEditingController agar dapat menangkap teks dari fungsi kalender yang akan dibuat.

Mengikutsertakan variabel _dateController ke dalam kerangka fungsi dispose() supaya alokasi memori untuk input tanggal ini juga ikut dibersihkan saat widget dimusnahkan.

Menyisipkan widget TextFormField baru (Input 4) berlabel "Tanggal Transaksi" sebelum penempatan tombol Simpan. Widget ini menggunakan properti readOnly: true agar kolom tidak memunculkan keyboard, melainkan hanya bereaksi pada fungsi onTap yang akan mengeksekusi fungsi showDatePicker. Hasil pemilihan tanggal kemudian diformat dengan struktur dua digit menggunakan fungsi padLeft (menjadi bentuk format standar DD/MM/YYYY) dan nilainya disimpan ke dalam _dateController.text menggunakan setState(). Kolom ini juga diamankan dengan validator untuk mencegah input kosong.