TUGAS 4 PPB - KEYSA ANADEA 5025211028

 

TUGAS 3 PPB

Deskripsi Proyek: Dice Roller

Nama: Keysa Anadea Aqiva Ajie

NRP: 5025211028

Kelas: PPB A

🎲 Membuat Aplikasi Dice Roller dengan Jetpack Compose

Pada tugas kali ini, saya membuat aplikasi sederhana bernama Dice Roller menggunakan Jetpack Compose di Android Studio.

Aplikasi ini memiliki fitur sederhana:

• Menampilkan gambar dadu di tengah layar

• Saat tombol "Roll" ditekan, gambar dadu akan berubah secara acak (dari angka 1 sampai 6)

Langkah-Langkah Pembuatan

1. Membuat Project Baru

Saya membuat project Android Studio dengan template Empty Activity.
Karena menggunakan Jetpack Compose, tampilan aplikasi akan dibangun langsung melalui kode Kotlin tanpa file XML layout tradisional.

2. Menambahkan Gambar Dadu

Saya menambahkan 6 file gambar dadu ke dalam folder res/drawable/, yaitu:

• dice_1.xml

• dice_2.xml

• dice_3.xml

• dice_4.xml

• dice_5.xml

• dice_6.xml

File-file ini adalah vector drawable yang mewakili setiap sisi dadu dari angka 1 hingga 6.

3. Membuat Tampilan dengan Compose

Di file MainActivity.kt, saya membuat fungsi DiceRollerScreen() untuk mengatur tampilan aplikasi.

Fungsinya:

• Menampilkan gambar dadu menggunakan Image()

• Menampilkan tombol "Roll 🎲" menggunakan Button()

• Mengubah gambar dadu secara acak saat tombol ditekan

HASIL KODE:

KODE:

MainActivity.kt

package com.example.diceroller

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.*
import androidx.compose.material3.Button
import androidx.compose.material3.Text
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import com.example.diceroller.ui.theme.DICEROLLERTheme
import kotlin.random.Random

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            DICEROLLERTheme {
                DiceRollerScreen()   // ← Ini memanggil DiceRollerScreen
            }
        }
    }
}

@Composable
fun DiceRollerScreen() {
    var diceRoll by remember { mutableStateOf(1) }

    val diceImage = when (diceRoll) {
        1 -> R.drawable.dice_1
        2 -> R.drawable.dice_2
        3 -> R.drawable.dice_3
        4 -> R.drawable.dice_4
        5 -> R.drawable.dice_5
        6 -> R.drawable.dice_6
        else -> R.drawable.dice_1
    }

    Column(
        modifier = Modifier
            .fillMaxSize()
            .padding(24.dp),
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        Image(
            painter = painterResource(id = diceImage),
            contentDescription = "Dice Image",
            modifier = Modifier.size(150.dp)
        )

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

        Button(
            onClick = {
                diceRoll = Random.nextInt(1, 7)
            }
        ) {
            Text(text = "Roll 🎲")
        }
    }
}