PPB - Pertemuan 6 - Kalkulator Sederhana

5025231245 | Rafie Zaidan Umara | Pertemuan 6 | PPB C

Kalkulator Sederhana

Project ini merupakan aplikasi kalkulator sederhana berbasis Android yang dibuat menggunakan bahasa pemrograman Kotlin dan Jetpack Compose. Aplikasi ini dirancang untuk melakukan operasi perhitungan dasar seperti penjumlahan, pengurangan, perkalian, dan pembagian dengan tampilan antarmuka yang menyerupai kalkulator pada smartphone modern. Selain melatih logika pemrograman, project ini juga bertujuan untuk memahami penerapan state management, composable function, layouting, serta penggunaan komponen Material Design dalam pengembangan aplikasi Android modern.

1. Membuat New Project

Tahap pertama dalam pembuatan aplikasi kalkulator sederhana adalah melakukan persiapan awal atau set up environment pengembangan. Langkah awal yang dilakukan yaitu menginstall Android Studio sebagai software utama untuk membuat aplikasi Android. Setelah proses instalasi selesai, Android Studio dibuka kemudian pengguna memilih menu “New Project” untuk mulai membuat project baru.

Selanjutnya dilakukan proses pembuatan project baru dengan memilih template “Empty Activity” agar project memiliki tampilan dasar yang sederhana dan mudah dikembangkan. Setelah itu klik tombol “Next”, lalu mengisi konfigurasi project seperti nama aplikasi yaitu “calculator-app” serta memilih bahasa pemrograman Kotlin yang direkomendasikan untuk pengembangan aplikasi Android modern menggunakan Jetpack Compose.

3. Package dan Library

Bagian ini digunakan untuk menentukan package project serta mengimpor library utama Android. ComponentActivity digunakan sebagai activity utama aplikasi, sedangkan setContent digunakan untuk menampilkan tampilan berbasis Jetpack Compose.

Import ini digunakan untuk mengatur tampilan layout aplikasi seperti Column, Row, Spacer, dan Modifier. Selain itu, CircleShape digunakan untuk membuat tombol kalkulator berbentuk lingkaran seperti aplikasi kalkulator pada smartphone.

Library Material3 digunakan untuk mengambil komponen UI modern seperti Button, Text, Surface, dan MaterialTheme agar tampilan aplikasi terlihat lebih modern dan mengikuti desain Android terbaru. Library runtime digunakan untuk mengatur state pada aplikasi. State ini memungkinkan tampilan berubah secara otomatis ketika data seperti angka atau hasil perhitungan diperbarui.

4. Main Activity
Class MainActivity merupakan activity utama yang pertama kali dijalankan saat aplikasi dibuka. Pada fungsi onCreate, digunakan setContent untuk menampilkan tampilan Compose. MaterialTheme digunakan agar aplikasi mengikuti tema Material Design, sedangkan Surface menjadi wadah utama dengan background hitam seperti aplikasi kalkulator asli di smartphone.

5. Fungsi CalculatorScreen

Fungsi CalculatorScreen() merupakan composable utama yang berisi seluruh tampilan dan logika aplikasi kalkulator. Semua komponen seperti display angka, tombol operator, dan proses input pengguna berada di dalam fungsi ini.

6. State Variable

Variabel input digunakan untuk menyimpan angka dan operator yang dimasukkan pengguna ke kalkulator. Sedangkan variabel result digunakan untuk menyimpan hasil perhitungan matematika. Keduanya menggunakan mutableStateOf agar tampilan aplikasi otomatis diperbarui ketika data berubah.

7. Daftar Tombol Kalkulator

Bagian ini digunakan untuk menyimpan susunan tombol kalkulator dalam bentuk list dua dimensi. Setiap list merepresentasikan satu baris tombol pada tampilan kalkulator sehingga proses pembuatan tombol menjadi lebih rapi dan efisien.

8. Layout Utama Aplikasi

Layout utama menggunakan Column agar seluruh komponen tersusun secara vertikal. Background aplikasi dibuat berwarna gelap agar menyerupai tampilan kalkulator modern di smartphone. padding digunakan untuk memberi jarak antar komponen supaya tampilan lebih rapi.

9. Tampilan Display Kalkulator

Bagian ini digunakan untuk membuat area display kalkulator yang menampilkan input pengguna dan hasil perhitungan. Alignment diatur ke kanan agar tampilannya menyerupai kalkulator asli pada smartphone.

10. Tampilan Input Pengguna

Kode ini digunakan untuk menampilkan angka dan operator yang sedang dimasukkan pengguna. Ukuran teks dibuat cukup besar agar mudah dibaca.

11. Tampilan Hasil Perhitungan

Bagian ini digunakan untuk menampilkan hasil akhir perhitungan matematika. Ukuran teks dibuat lebih besar dan tebal agar hasil kalkulasi lebih terlihat jelas oleh pengguna.

12. Pembuatan Tombol Kalkulator

Perulangan ini digunakan untuk membuat tombol kalkulator secara otomatis berdasarkan data yang ada pada list buttons. Dengan cara ini, kode menjadi lebih singkat dan mudah dikembangkan.

13. Layout Baris Tombol

Bagian ini digunakan untuk menyusun tombol kalkulator secara horizontal dalam satu baris. Jarak antar tombol diatur menggunakan spacedBy agar tampilan tombol terlihat rapi.

14. Komponen Tombol

Komponen Button digunakan untuk membuat tombol angka maupun operator pada kalkulator. Ketika tombol ditekan, program akan menjalankan aksi tertentu sesuai simbol tombol tersebut.

15. Logika Tombol Clear dan Equal

Bagian ini digunakan untuk mengatur fungsi setiap tombol. Tombol "C" digunakan untuk menghapus seluruh input dan mengembalikan hasil ke nol. Tombol "=" digunakan untuk menghitung hasil operasi matematika. Sedangkan tombol lainnya digunakan untuk menambahkan angka atau operator ke dalam input.

16. Parser Perhitungan Matematika

Ketiga fungsi ini digunakan untuk membaca dan menghitung expression matematika berdasarkan prioritas operator. parseExpression() menangani penjumlahan dan pengurangan, parseTerm() menangani perkalian dan pembagian, sedangkan parseFactor() membaca angka yang dimasukkan pengguna.

17. Handling Error

Bagian ini digunakan untuk menangani kesalahan ketika expression tidak valid atau terjadi error saat proses perhitungan. Jika terjadi kesalahan, aplikasi akan menampilkan tulisan "Error" pada layar kalkulator.

18. Tampilan Kalkulator

19. Kesimpulan

Aplikasi Simple Calculator dibuat menggunakan bahasa pemrograman Kotlin dan framework Jetpack Compose pada Android Studio. Aplikasi ini memiliki fitur operasi matematika dasar yaitu penjumlahan, pengurangan, perkalian, dan pembagian.

Jetpack Compose mempermudah pembuatan tampilan aplikasi karena menggunakan konsep declarative UI sehingga perubahan data dapat langsung memperbarui tampilan secara otomatis.

Selain itu, aplikasi juga menerapkan validasi input dan pembagian dengan nol agar aplikasi berjalan lebih stabil dan aman digunakan.