Praktikum Flutter : 🎯 Aplikasi: Jadwal Pelajaran Sederhana

Berikut contoh kode praktikum Flutter yang sederhana
(Boleh menggunakan code program ini, boleh juga cari referensi lain asal tentang Fitur: CRUD sederhana (Tambah, Edit, Hapus) + setState )

👉 Cocok untuk pembelajaran mandiri hari ini 

---

💻 📱 KODE PRAKTIKUM FLUTTER

🎯 Aplikasi: Jadwal Pelajaran Sederhana

✅ Sudah include:

• Tambah data

• Edit data

• Hapus data

• ListView

• Dialog input

---

📌 LANGKAH AWAL

1. Buat project baru:

flutter create jadwal_app

2. Ganti isi file lib/main.dart dengan kode berikut

---

🧩 KODE LENGKAP

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: JadwalPage(),
    );
  }
}

class JadwalPage extends StatefulWidget {
  @override
  _JadwalPageState createState() => _JadwalPageState();
}

class _JadwalPageState extends State<JadwalPage> {
  List<String> jadwalList = [];

  void tambahData(String data) {
    setState(() {
      jadwalList.add(data);
    });
  }

  void editData(int index, String dataBaru) {
    setState(() {
      jadwalList[index] = dataBaru;
    });
  }

  void hapusData(int index) {
    setState(() {
      jadwalList.removeAt(index);
    });
  }

  void tampilDialog({String? dataLama, int? index}) {
    TextEditingController controller =
        TextEditingController(text: dataLama ?? "");

    showDialog(
      context: context,
      builder: (context) {
        return AlertDialog(
          title: Text(dataLama == null ? "Tambah Jadwal" : "Edit Jadwal"),
          content: TextField(
            controller: controller,
            decoration: InputDecoration(
              hintText: "Contoh: Matematika - Senin",
            ),
          ),
          actions: [
            TextButton(
              onPressed: () => Navigator.pop(context),
              child: Text("Batal"),
            ),
            ElevatedButton(
              onPressed: () {
                if (controller.text.isNotEmpty) {
                  if (dataLama == null) {
                    tambahData(controller.text);
                  } else {
                    editData(index!, controller.text);
                  }
                }
                Navigator.pop(context);
              },
              child: Text("Simpan"),
            ),
          ],
        );
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Jadwal Pelajaran"),
        centerTitle: true,
      ),
      body: jadwalList.isEmpty
          ? Center(child: Text("Belum ada jadwal"))
          : ListView.builder(
              itemCount: jadwalList.length,
              itemBuilder: (context, index) {
                return Card(
                  margin: EdgeInsets.all(8),
                  child: ListTile(
                    title: Text(jadwalList[index]),
                    trailing: Row(
                      mainAxisSize: MainAxisSize.min,
                      children: [
                        IconButton(
                          icon: Icon(Icons.edit, color: Colors.blue),
                          onPressed: () => tampilDialog(
                            dataLama: jadwalList[index],
                            index: index,
                          ),
                        ),
                        IconButton(
                          icon: Icon(Icons.delete, color: Colors.red),
                          onPressed: () => hapusData(index),
                        ),
                      ],
                    ),
                  ),
                );
              },
            ),
      floatingActionButton: FloatingActionButton(
        onPressed: () => tampilDialog(),
        child: Icon(Icons.add),
      ),
    );
  }
}

---

🎯 TARGET PRAKTIKUM SISWA

Setelah pakai kode ini, siswa diminta:

✅ Level Wajib

• Jalankan aplikasi

• Tambah data

• Edit data

• Hapus data

---

🚀 Level Pengembangan (Opsional)

Suruh siswa modifikasi:

1. Tambah hari & jam

   Senin - Matematika - 08:00
   

2. Tambah warna berbeda tiap item

3. Tambah konfirmasi sebelum hapus

---

🧪 TUGAS PRAKTIKUM 

👉 Kirim ke siswa:

Tugas Praktikum Flutter:

1. Jalankan aplikasi yang diberikan

2. Pastikan fitur berikut berjalan:

   • Tambah jadwal

   • Edit jadwal

   • Hapus jadwal

3. Modifikasi:

   • Tambahkan keterangan hari & jam

   • Percantik tampilan

4. Screenshot hasil:

   • Tampilan utama

   • Saat tambah data

   • Saat edit

Upload ke Google Drive

---

💡 CATATAN 

Kode ini sengaja:

• Tidak terlalu kompleks ✅

• Mudah dimodifikasi ✅

• Minim error untuk pemula ✅

---

🚀 Rencana Level Berikutnya

Saran Pengembangan:

✅ Versi pakai database (Hive / SQLite)
✅ Versi pakai Provider (lebih profesional)
✅ Versi sudah dipisah folder (clean code)

Salam, Redaksi.

Read More