Pengumpulan Tugas Pemrograman Perangkat Bergerak G - Pertemuan 5

Dokumentasi Aplikasi "Simple Calculator"

Link GitHub: https://github.com/RayyanFv/ppb-5-calculatorapp

Deskripsi Aplikasi

Aplikasi "Simple Calculator" adalah aplikasi Android sederhana yang dibuat menggunakan Jetpack Compose. Aplikasi ini memungkinkan pengguna untuk melakukan perhitungan dasar seperti penjumlahan, pengurangan, perkalian, dan pembagian dengan memasukkan dua angka dan memilih salah satu dari empat tombol operasi yang tersedia.

Komponen Teknis

Teknologi yang Digunakan

• Bahasa Pemrograman: Kotlin
• Framework UI: Jetpack Compose
• Material Design: Material 3
• Minimum SDK: 21 (Android 5.0 Lollipop)
• Target SDK: 35 (Android 15)
• Gradle Plugin: 8.3.0
• Gradle Wrapper: 8.4

Struktur Kode

MainActivity.kt

Kelas utama yang menjalankan aplikasi dan menampilkan antarmuka pengguna.

Fungsi utama:

• Menyusun dua input angka menggunakan BasicTextField
• Menampilkan empat tombol operasi (add, sub, mul, div)
• Menampilkan hasil perhitungan
• Menggunakan state (remember) untuk menyimpan nilai input dan hasil

Fitur Aplikasi

• Input Angka: Dua kolom input angka dengan tampilan bersih dan responsif
• Tombol Operasi:
  • add: Menjumlahkan dua angka
  • sub: Mengurangkan angka pertama dengan angka kedua
  • mul: Mengalikan dua angka
  • div: Membagi angka pertama dengan angka kedua, disertai validasi pembagian dengan nol
• Hasil: Menampilkan hasil perhitungan di bawah tombol
• Validasi Input: Menghindari crash dengan toDoubleOrNull()
• Desain: Modern menggunakan MaterialTheme Material 3

Implementasi Komponen UI

Column dan Row

Digunakan untuk menyusun layout vertikal dan horizontal dengan Modifier.fillMaxWidth(), padding(), dan spacedBy().

BasicTextField

Dua buah input angka, dengan:

• Font 24sp
• Latar abu-abu dengan sudut melengkung
• Padding dalam 16dp

Button

Empat buah tombol dengan bentuk bulat dan warna ungu:

• Tiap tombol memicu kalkulasi berbeda
• Diletakkan secara horizontal dan rata

Text

• Label Input: Menggunakan Text dengan style bodyLarge
• Hasil: Menggunakan Text dengan style headlineSmall dan FontWeight.Bold

Preview

Kode berikut digunakan untuk menampilkan preview di Android Studio:

@Preview(showBackground = true)
@Composable
fun DefaultPreview() {
    CalculatorApp()
}

demo aplikasi