PPB C - Pertemuan 6 - Kalkulator Sederhana

5025221103 | Hilmi Fawwaz Sa'ad | Pertemuan 6 | PPB C

Kalkulator Sederhana

Pada tugas kali ini, saya membuat sebuah aplikasi kalkulator sederhana menggunakan bahasa pemrograman Kotlin pada aplikasi Android Studio. Kalkulator ini dirancang untuk melakukan operasi aritmatika dasar seperti penjumlahan, pengurangan, perkalian, dan pembagian. Program bekerja dengan menerima input berupa angka pertama, kemudian operator aritmatika, serta angka kedua sebagai input terakhir. Setelah itu, aplikasi akan menampilkan hasil perhitungan berdasarkan operasi yang dipilih antara angka pertama dan angka kedua. Selain menampilkan hasil perhitungan dasar, kalkulator ini juga mendukung proses perhitungan berulang, sehingga pengguna dapat melanjutkan operasi berikutnya tanpa harus mengulang dari awal. 

Pengembangan aplikasi ini juga menerapkan pemisahan antara User Interface (UI) dan logika perhitungan menggunakan konsep ViewModel, sehingga struktur program menjadi lebih terorganisir, mudah dikembangkan, serta mampu menjaga data tetap konsisten meskipun terjadi perubahan konfigurasi pada aplikasi.

Repository Github: Kalkulator Sederhana

1. Buka Android Studio

2. Pilih "Project Baru"

3. Pilih "Empty Activity" dan pilih "Next"


4. Isi konfigurasi sesuai dengan project yang dikerjakan dan pilih "Finish"


5. Konfigurasi yang dibuat akan menghasilkan satu file MainActivity yang berfungsi sebagai tempat utama untuk menjalankan aplikasi serta mengatur tampilan awal yang akan ditampilkan kepada pengguna

6.Dikarenakan akan membuat kalkulator sederhana, saya mencoba memisahkan antara User Interface (UI) dan logic dengan membuat kelas baru. Cara pembuatannya adalah dengan masuk ke folder app/src/main/java/com/example/kalkulatorsederhana, kemudian menambahkan Kotlin Class/File dan memberi nama CalculatorViewModel. File ini digunakan untuk menyimpan logika perhitungan dari kalkulator.




7. Buat class CalculatorViewModel yang merupakan turunan dari ViewModel. Class ini berfungsi sebagai tempat untuk menyimpan state serta logika perhitungan dari kalkulator, sehingga data tetap terjaga meskipun terjadi perubahan konfigurasi pada aplikasi.

8. Pada bagian awal class, dibuat variabel state yaitu displayValue dan infoText yang menggunakan mutableStateOf. Variabel displayValue digunakan untuk menyimpan nilai yang akan ditampilkan pada layar kalkulator, sedangkan infoText digunakan untuk memberikan informasi tambahan kepada pengguna.

9. Membuat beberapa variabel pendukung untuk proses perhitungan, yaitu firstOperand, pendingOperator, secondOperandText, isEnteringSecond, showingFinalResult, dan lastResult. Variabel-variabel ini berfungsi untuk menyimpan angka pertama, operator yang dipilih, angka kedua, serta status proses perhitungan.

10. Membuat fungsi onDigitClick(digit: String) yang digunakan untuk menangani input angka ketika pengguna menekan tombol angka pada kalkulator. Fungsi ini akan menambahkan angka ke dalam tampilan jika pengguna sedang memasukkan angka pertama, atau menambahkan angka kedua jika operator sudah dipilih. Selain itu, fungsi ini juga menampilkan preview hasil sementara ketika angka kedua sedang dimasukkan, sehingga pengguna dapat melihat hasil perhitungan secara langsung.

11. Membuat fungsi onOperatorClick(op: String) yang berfungsi untuk menangani input operator seperti penjumlahan (+), pengurangan (-), perkalian (*), dan pembagian (/). Fungsi ini akan menyimpan angka pertama yang telah dimasukkan, menentukan operator yang dipilih, serta memungkinkan perhitungan berantai dengan melanjutkan operasi dari hasil sebelumnya tanpa harus menekan tombol sama dengan terlebih dahulu

12. Membuat fungsi onEqualsClick() yang digunakan untuk menghasilkan hasil akhir dari operasi perhitungan. Fungsi ini akan mengambil nilai angka pertama dan angka kedua, kemudian memanggil fungsi perhitungan untuk mendapatkan hasil akhir. Setelah hasil diperoleh, nilai tersebut akan ditampilkan pada layar dan disimpan sebagai hasil terakhir sehingga dapat digunakan kembali untuk operasi selanjutnya.

13. Membuat fungsi onClearClick() yang berfungsi untuk menghapus seluruh input dan mengembalikan kalkulator ke kondisi awal. Fungsi ini dipanggil ketika pengguna menekan tombol reset atau clear, sehingga semua nilai yang tersimpan akan dihapus dan tampilan kembali ke nilai awal.

14. Membuat fungsi tambahan resetState() yang berfungsi sebagai helper function untuk mengembalikan seluruh variabel ke kondisi awal. Fungsi ini akan mengatur ulang nilai tampilan menjadi "0", menghapus operand dan operator, serta mengembalikan seluruh status perhitungan menjadi kondisi awal.

15. Membuat fungsi format(v: Double) yang digunakan untuk mengatur tampilan angka pada layar kalkulator. Fungsi ini akan memeriksa apakah nilai yang dihasilkan merupakan bilangan bulat atau desimal. Jika bilangan bulat, maka angka akan ditampilkan tanpa bagian desimal, sedangkan jika bilangan desimal, maka angka akan ditampilkan sesuai nilainya.

16. Membuat fungsi calculate(a: Double, op: String, b: Double) yang berfungsi sebagai inti dari proses perhitungan matematika. Fungsi ini menggunakan struktur when untuk menentukan jenis operasi berdasarkan operator yang dipilih, seperti penjumlahan, pengurangan, perkalian, dan pembagian.

17. Berganti pada bagian MainActivity.kt. 

18. Membuat fungsi composable CalculatorScreen(viewModel: CalculatorViewModel) untuk membangun tampilan kalkulator.

19. Membuat fungsi CalculatorCard(viewModel: CalculatorViewModel) yang berfungsi sebagai wadah utama dari seluruh komponen kalkulator.

20. Membuat fungsi DisplayBox(text: String) yang berfungsi untuk menampilkan nilai utama dari kalkulator.

21. Membuat fungsi InfoBox(text: String) yang berfungsi untuk menampilkan informasi tambahan terkait proses perhitungan.

22. Membuat fungsi ButtonGrid(viewModel: CalculatorViewModel) yang berfungsi untuk menampilkan seluruh tombol kalkulator dalam bentuk grid.

23. Membuat fungsi CalculatorButton() yang berfungsi sebagai komponen tombol umum yang dapat digunakan kembali untuk seluruh tombol kalkulator.

24. Terakhir pada bagian class MainActivity. Didalamny dibuat variabel viewModel yang diinisialisasi menggunakan viewModels(), yang berfungsi untuk menghubungkan tampilan UI dengan CalculatorViewModel sehingga seluruh state dan logika perhitungan dapat diakses dari tampilan. Pada method onCreate, dilakukan inisialisasi awal aplikasi, termasuk pengaturan tema menggunakan KalkulatorSederhanaTheme serta pemanggilan fungsi CalculatorScreen sebagai tampilan utama aplikasi.

25. Jika sudah maka selanjutnya build project tersebut.

26. Dan ini untuk hasilnya buildnya

27. Untuk video fungsionalitas bisa lihat di bawah


Komentar

Postingan populer dari blog ini

PPB C - Pertemuan 12 - Login App (MVVM)

PPB C - Pertemuan 7 - Halaman Login Sederhana

PPB C - Pertemuan 11 - Marketplace Siswa