Laporan Praktikum Aplikasi Mobile 3
Laporan Praktikum

26 September 2025 ~ Oleh Surya Andika

Laporan Praktikum Aplikasi Mobile 3

Input Widgets dan Basic Form

Tugas

  • Buatlah aplikasi kalkulator yang dapat menjalankan operasi kabataku
  • Gunakan 2 buah widget inputan (TextField atau TextFormField) untuk menerima nilai inputan.
  • Gunakan ElevatedButton untuk mengeksekusi operasi kabataku
  • Gunakan widget Text untuk menampilkan hasil operasi

Langkah-Langkah
  1. Pengelolaan State dan Controller
  2. Bagian ini menangani data yang akan berubah dan cara mengambil input dari pengguna.

    • StatefulWidget: CalculatorForm didefinisikan sebagai StatefulWidget agar layarnya dapat diperbarui setiap kali ada hasil perhitungan baru yang perlu ditampilkan.
    • TextEditingController: Dua buah controller (_controller1 dan _controller2) dibuat untuk mengelola dan mengambil teks dari kedua TextField. Ini adalah cara standar di Flutter untuk mengakses input dari pengguna.
    • String _hasil = '0': Sebuah variabel state (_hasil) dideklarasikan untuk menyimpan hasil perhitungan. Nilai awalnya adalah '0' dan akan diperbarui setiap kali pengguna menekan tombol operasi.

  3. Tampilan Antarmuka (UI)
  4. Seluruh komponen visual aplikasi disusun di dalam metode build.

    • TextField: Dua widget TextField digunakan agar pengguna dapat memasukkan dua angka.
      • controller: Masing-masing TextField dihubungkan ke TextEditingController yang sesuai untuk mengambil nilainya.
      • keyboardType: Diatur ke TextInputType.number agar keyboard numerik yang muncul saat kolom input disentuh, memudahkan pengguna memasukkan angka.
    • ElevatedButton: Empat tombol dibuat untuk setiap operasi.
      • onPressed: Setiap tombol, saat ditekan, akan memanggil fungsi _hitung dengan mengirimkan parameter berupa nama operasi (misalnya, 'tambah').
      • Text: Widget ini digunakan untuk menampilkan label "Hasil:" dan nilai terbaru dari variabel _hasil.

  5. Logika Perhitungan
  6. Semua proses kalkulasi terjadi di dalam fungsi _hitung(String operasi).

    • Konversi dan Validasi Input: Teks dari controller diubah menjadi tipe data angka (double) menggunakan double.tryParse(). Jika input yang dimasukkan bukan angka (hasil tryParse adalah null), maka _hasil akan diatur menjadi pesan error dan fungsi berhenti.
    • switch (operasi): Pernyataan switch digunakan untuk menjalankan blok kode matematika yang sesuai dengan operasi yang dipilih pengguna (kali, bagi, tambah, atau kurang).
    • Penanganan Pembagian Nol: Ada logika khusus untuk operasi 'bagi'. Jika angka kedua adalah 0, hasilnya diatur menjadi double.infinity untuk menghindari crash pada aplikasi.
    • setState(): Setelah hasil perhitungan didapat, setState() dipanggil. Fungsi ini memberitahu Flutter bahwa ada perubahan state, sehingga Flutter perlu membangun ulang UI untuk menampilkan nilai _hasil yang baru.
  7. Manajemen Memori
  8. Untuk praktik pengembangan yang baik, controller perlu "dibersihkan" saat sudah tidak terpakai.

    • dispose(): Metode ini secara otomatis dipanggil oleh Flutter saat widget tidak lagi ditampilkan. Di dalamnya, kita memanggil .dispose() pada setiap TextEditingController untuk melepaskan memori yang digunakan, sehingga mencegah terjadinya kebocoran memori (memory leaks)
    • Programnya:
      System Requirement
      Outputnya:
      System Requirement
© 2025 Surya Andika. All rights reserved.