Praktikum flutter -aplikasi jadwal pelajaran (CRUD+setState)

  Praktikum Flutter:  Aplikasi Jadwal Pelajaran (CRUD+setState)

1. Pendahuluan

Aplikasi Jadwal Pelajaran merupakan studi kasus yang ideal untuk mempelajari dasar-dasar pengembangan aplikasi mobile dengan Flutter. Fokus utama praktikum ini adalah pengolahan data dinamis menggunakan operasi CRUD (Create, Read, Update, Delete) serta pengelolaan status aplikasi menggunakan setState.


2. Konsep Dasar

CRUD: Operasi dasar pengolahan data yang meliputi pembuatan data baru, pembacaan data, pembaruan data yang ada, dan penghapusan data.


setState: Metode paling sederhana dalam Flutter untuk memberi tahu framework bahwa ada perubahan pada state (data), sehingga Flutter akan membangun ulang (rebuild) UI sesuai dengan data terbaru.


3. Struktur Kode dan Komponen

Aplikasi ini dibangun menggunakan beberapa komponen utama:


A. Model Data

Mendefinisikan atribut yang dibutuhkan seperti id, mataPelajaran, hari, dan jam. Penggunaan ID unik (seperti timestamp) sangat penting untuk membedakan antar data saat proses update atau delete.


B. Manajemen State

Seluruh logika penyimpanan data diletakkan di dalam List<Jadwal>. Perubahan pada daftar ini dibungkus di dalam fungsi setState().


C. Controller

Menggunakan TextEditingController untuk mengambil teks yang diketikkan pengguna pada form input (TextField).


4. Langkah Implementasi

  1. Inisialisasi Proyek: Membuat proyek Flutter baru dan menyiapkan struktur StatefulWidget.
  2. Pembuatan Form: Menggunakan showModalBottomSheet atau halaman baru yang berisi TextField untuk mengisi detail jadwal.
  3. Fungsi Simpan (Create/Update):
  4. Jika data baru: Menambahkan objek ke dalam list.
  5. Jika data lama (Edit): Mencari index berdasarkan ID, lalu memperbarui nilainya.
  6. Menampilkan Data (Read): Menggunakan ListView.builder agar aplikasi tetap ringan meskipun data jadwal bertambah banyak.
  7. Fungsi Hapus (Delete): Menggunakan metode removeWhere pada list berdasarkan ID unik yang dipilih.


5. Analisis Operasi setState

Dalam praktikum ini, setState berperan sebagai pemicu render ulang. Tanpa setState, meskipun data di dalam list sudah berubah secara sistem, tampilan layar (UI) tidak akan menunjukkan perubahan tersebut. Ini adalah poin krusial dalam memahami siklus hidup (lifecycle) widget di Flutter.


6. Kesimpulan

Praktikum ini berhasil menunjukkan bahwa Flutter memudahkan pengembang dalam mengelola data lokal yang sederhana. Dengan menguasai konsep CRUD dan manajemen state dasar, mahasiswa dapat melanjutkan ke tingkat yang lebih kompleks seperti integrasi database (Sqflite) atau State Management tingkat lanjut (Provider/Bloc).

Komentar

Posting Komentar