PPB - Pertemuan 06 - Tugas 01

Nama: Hammuda Arsyad

NRP: 5025211146

Kelas: PPB G

Sourcecode: https://github.com/H-mD/currency-converter

---

🪙 Membuat Aplikasi Currency Converter Sederhana dengan Kotlin dan Jetpack Compose

Pada artikel ini, kita akan membahas cara membuat aplikasi Currency Converter (pengubah mata uang) sederhana menggunakan Kotlin dan Jetpack Compose. Aplikasi ini memungkinkan pengguna untuk memasukkan jumlah uang dalam suatu mata uang, memilih mata uang asal dan tujuan, dan langsung melihat hasil konversinya secara real-time.

🎯 Fitur Utama

• Input jumlah uang yang ingin dikonversi.

• Dropdown untuk memilih mata uang asal dan tujuan.

• Hasil konversi ditampilkan secara langsung.

• Menggunakan UI modern berbasis Jetpack Compose.

---

🏗️ Struktur Proyek

Aplikasi ini hanya terdiri dari satu Activity, yaitu MainActivity.kt, dan seluruh UI serta logika berada di dalamnya menggunakan Jetpack Compose.

1. Inisialisasi dan Tema

setContent {
    CurrencyChangerTheme {
        Surface(
            modifier = Modifier.fillMaxSize(),
            color = MaterialTheme.colorScheme.background
        ) {
            CurrencyChangerApp()
        }
    }
}

Kode di atas men-setup tampilan utama aplikasi dengan tema CurrencyChangerTheme dan memanggil fungsi utama CurrencyChangerApp().

---

🧠 Logika dan UI di CurrencyChangerApp

Fungsi utama CurrencyChangerApp() berisi logika UI dan pengaturan state untuk:

• amount: jumlah uang yang ingin dikonversi

• fromCurrency: mata uang asal

• toCurrency: mata uang tujuan

• result: hasil konversi

2. Input Jumlah dan Hasil

OutlinedTextField(
    value = amount,
    onValueChange = {
        amount = it
        ...
    },
    label = { Text("Amount") },
    keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Decimal),
)

User dapat mengetik angka desimal untuk dikonversi. Ketika jumlah berubah, maka result akan diperbarui otomatis menggunakan fungsi convertCurrency().

3. Dropdown Pemilihan Mata Uang

Menggunakan ExposedDropdownMenuBox dari Material 3 untuk dua dropdown:

• "From": mata uang asal

• "To": mata uang tujuan

Setiap perubahan dropdown juga memperbarui hasil konversi secara langsung.

---

🔄 Fungsi Konversi Mata Uang

Fungsi convertCurrency() menangani logika perhitungan:

fun convertCurrency(amount: Double, from: String, to: String): String

Mekanisme:

1. Mengonversi amount dari mata uang asal ke USD (nilai acuan).

2. Lalu dari USD ke mata uang tujuan.

3. Hasilnya dibulatkan ke 2 digit desimal (atau bulat jika JPY/IDR).

Contoh:

val rates = mapOf(
    "USD" to 1.0,
    "EUR" to 0.92,
    ...
)

Jika kamu mengonversi 100 EUR ke JPY, maka:

• EUR → USD: 100 / 0.92

• USD → JPY: hasil * 152.5

---

💄 Tampilan Hasil

Contoh tampilan hasil pada UI:

Amount: [ 100.00 ]        Result: [ 15250 JPY ]
From: [ EUR ▼ ]           To: [ JPY ▼ ]

UI sangat responsif dan update hasil secara langsung saat pengguna mengubah input jumlah atau memilih mata uang berbeda.

---

✅ Kesimpulan

Aplikasi Currency Converter ini adalah contoh yang bagus untuk:

• Belajar menggunakan Jetpack Compose untuk UI yang modern dan deklaratif.

• Menerapkan state management yang reaktif.

• Menangani input numerik dan dropdown di Android.

• Menggabungkan logika bisnis (konversi) dengan UI interaktif.

---

📷Dokumentasi