Tugas 6 PPB A 2025 - Aplikasi Currency Converter

Nama     : Rayhan Arvianta Bayuputra

NRP        : 5025211217

Kelas      : PPB A

TA            : 2024 (Genap)

Aplikasi Currency Converter

Pada pertemuan kali ini, kami membuat sebuah aplikasi currency converter. Berikut cuplikannya.

Project ini dibuat dengan simple activity, berikut source codenya:

package com.example.currencyconverter

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.example.currencyconverter.ui.theme.CurrencyConverterTheme

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            CurrencyConverterTheme {
                Surface(modifier = Modifier.fillMaxSize(), color = MaterialTheme.colorScheme.background) {
                    CurrencyConverterApp()
                }
            }
        }
    }
}

@Composable
fun CurrencyConverterApp() {
    val currencies = listOf("USD", "IDR", "EUR", "JPY", "GBP", "AUD", "MYR", "SGD", "KRW")
    val exchangeRates = mapOf(
        "USD" to 1.0,
        "IDR" to 19162.33 / 1.1360,
        "EUR" to 1.0 / 1.1360,
        "JPY" to 161.98 / 1.1360,
        "GBP" to 0.85873 / 1.1360,
        "AUD" to 1.7845 / 1.1360,
        "MYR" to 5.0069 / 1.1360,
        "SGD" to 1.4905 / 1.1360,
        "KRW" to 1609.12 / 1.1360
    )

    var amountInput by remember { mutableStateOf("") }
    var fromCurrency by remember { mutableStateOf("USD") }
    var toCurrency by remember { mutableStateOf("IDR") }
    var result by remember { mutableStateOf("") }

    Column(modifier = Modifier.padding(16.dp)) {
        OutlinedTextField(
            value = amountInput,
            onValueChange = { amountInput = it },
            label = { Text("Amount") },
            modifier = Modifier.fillMaxWidth()
        )

        Spacer(modifier = Modifier.height(8.dp))

        Row(modifier = Modifier.fillMaxWidth(), horizontalArrangement = Arrangement.SpaceBetween) {
            CurrencyDropdown(currencies, fromCurrency) { fromCurrency = it }
            CurrencyDropdown(currencies, toCurrency) { toCurrency = it }
        }

        Spacer(modifier = Modifier.height(8.dp))

        Button(onClick = {
            val amount = amountInput.toDoubleOrNull()
            if (amount != null) {
                val fromRate = exchangeRates[fromCurrency] ?: 1.0
                val toRate = exchangeRates[toCurrency] ?: 1.0
                val convertedAmount = amount * (toRate / fromRate)
                result = "%.2f".format(convertedAmount)
            } else {
                result = "Invalid amount"
            }
        }, modifier = Modifier.fillMaxWidth()) {
            Text("Convert")
        }

        Spacer(modifier = Modifier.height(8.dp))

        Text(text = "Result: $result", style = MaterialTheme.typography.titleLarge)
    }
}

@Composable
fun CurrencyDropdown(currencies: List<String>, selectedCurrency: String, onCurrencySelected: (String) -> Unit) {
    var expanded by remember { mutableStateOf(false) }

    Box {
        OutlinedButton(onClick = { expanded = true }) {
            Text(text = selectedCurrency)
        }

        DropdownMenu(expanded = expanded, onDismissRequest = { expanded = false }) {
            currencies.forEach { currency ->
                DropdownMenuItem(
                    text = { Text(currency) },
                    onClick = {
                        onCurrencySelected(currency)
                        expanded = false
                    }
                )
            }
        }
    }
}
@Preview(showBackground = true)
@Composable
fun CurrencyConverterPreview() {
    CurrencyConverterTheme {
        CurrencyConverterApp()
    }
}

MainActivity Class

Kelas MainActivity merupakan titik masuk utama aplikasi, yang merupakan turunan dari ComponentActivity. Di dalam metode onCreate(), fungsi setContent {} digunakan untuk menginisialisasi UI aplikasi menggunakan Jetpack Compose.

Tema aplikasi CurrencyConverterTheme diterapkan dengan menggunakan Surface, yang berfungsi sebagai container utama. Warna latar belakangnya diambil dari MaterialTheme.colorScheme.background. Selanjutnya, fungsi CurrencyConverterApp() dipanggil untuk menampilkan antarmuka utama aplikasi konversi mata uang.

CurrencyConverterApp Function

Fungsi CurrencyConverterApp() bertanggung jawab untuk menyusun dan menampilkan elemen-elemen utama dari aplikasi konversi mata uang.

Beberapa elemen utama yang ditampilkan dalam fungsi ini meliputi:

• OutlinedTextField: Digunakan untuk menginput jumlah uang yang ingin dikonversi.
• Dua dropdown menu (CurrencyDropdown): Masing-masing digunakan untuk memilih mata uang asal dan tujuan konversi.
• Button: Ketika ditekan, akan menjalankan proses konversi berdasarkan kurs yang telah ditentukan.
• Text: Menampilkan hasil dari konversi dalam format angka desimal dua digit.

Konversi dilakukan dengan cara mengambil nilai input, kemudian dikalikan dengan rasio antara nilai tukar mata uang tujuan dan mata uang asal yang didefinisikan dalam Map exchangeRates.

Demo Aplikasi

 

Github Repository: https://github.com/arvianta/PPB_Week6_CurrencyConverter