Tugas 4 - Aplikasi Interaktif Dice Roller

  

Aplikasi Interaktif Dice Roller



Berikut adalah langkah-langkah untuk membuat aplikasi Dice Roller.

1. Persiapkan Komputer dan Install Android Studio

Pastikan bahwa Android Studio telah terinstal pada komputer Anda dan siap digunakan untuk proyek pengembangan aplikasi. Buka Android Studio, dan pastikan proyek baru Anda sudah siap untuk dibuat dengan template "Empty Compose Activity".

2. Membuat Proyek Baru

  • Setelah membuka Android Studio, klik “Start a new Android Studio project”.
  • Pada layar pemilihan template, pilih “Empty Compose Activity” dan klik Next.
  • Masukkan nama aplikasi, misalnya "Dice Roller".
  • Tentukan lokasi penyimpanan proyek di komputer Anda.
  • Pilih Language sebagai Kotlin.
  • Pastikan opsi Use AndroidX artifacts dicentang.
  • Klik Finish untuk memulai pembuatan proyek.

3. Menentukan Minimum SDK

  • Setelah memilih template dan memasukkan nama proyek, Anda akan dibawa ke layar Select a minimum SDK.
  • Pilih API Level 24: Android 7.0 (Nougat) sebagai Minimum SDK.
  • Klik Next, dan tunggu hingga Android Studio selesai menyiapkan proyek.

4. Membuat Tata Letak dengan Jetpack Compose

Setelah proyek selesai dibuat dan Android Studio selesai membangunnya, buka file MainActivity.kt. Anda dapat melihat kode dasar yang sudah dibuat dengan template Empty Compose Activity.

5. Menyiapkan Kode untuk Tata Letak Dice Roller

  • Gantilah kode di dalam setContent dengan kode untuk membuat tata letak aplikasi sesuai dengan tutorial yang diberikan.
  • Hapus fungsi GreetingPreview() yang ada dan buat dua fungsi baru: DiceWithButtonAndImage() dan DiceRollerApp(). Pastikan Anda memanggil DiceRollerApp() di dalam DiceRollerTheme untuk menata komponen UI.

6. Menambahkan Tombol dan Gambar

  • Di dalam file strings.xml, tambahkan string yang digunakan untuk tombol, misalnya dengan menambahkan nilai Roll untuk tombol yang akan digunakan dalam aplikasi.
  • Dalam fungsi DiceWithButtonAndImage(), tambahkan komponen Button() dan sesuaikan teks tombol menggunakan fungsi stringResource().
  • Untuk menambahkan gambar, impor gambar dadu ke dalam proyek melalui Resource Manager dan gunakan Image composable untuk menampilkan gambar dadu pada tampilan aplikasi.

7. Implementasi Logika Pelemparan Dadu

  • Di dalam DiceWithButtonAndImage(), buatlah variabel result yang akan menyimpan hasil pelemparan dadu secara acak menggunakan remember dan mutableStateOf().
  • Buatlah variabel imageResource untuk mengubah gambar dadu berdasarkan hasil yang muncul. Gunakan when untuk menetapkan nilai yang sesuai dengan hasil dadu yang muncul.
  • Perbarui tampilan UI saat tombol diklik dan pastikan aplikasi dapat melempar dadu secara interaktif.

8. Selesai

Setelah mengikuti semua langkah diatas, aplikasi Dice Roller Anda akan siap digunakan, memungkinkan pengguna untuk mengetuk tombol "Roll" dan melihat hasil lemparan dadu dengan gambar yang berubah sesuai angka yang dihasilkan.


Dokumentasi



Komentar

Posting Komentar

Postingan populer dari blog ini

Tugas 13 - Unscramble

Gambar
  Unscramble MainActivity.kt package com.example.unscramble import android.os.Bundle import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.activity.enableEdgeToEdge import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.material3.Surface import androidx.compose.ui.Modifier import com.example.unscramble.ui.GameScreen import com.example.unscramble.ui.theme.UnscrambleTheme class MainActivity : ComponentActivity() { override fun onCreate (savedInstanceState: Bundle?) { enableEdgeToEdge () super .onCreate(savedInstanceState) setContent { UnscrambleTheme { Surface ( modifier = Modifier. fillMaxSize (), ) { GameScreen () } } } } } WordsData.kt package com.example.unscramble.data const val MAX_NO_OF_WORDS = 10 const val SCORE_INCREASE = 20 // Set with all the words for ...
Baca selengkapnya

Tugas 12 - Dessert Clicker

Gambar
  Dessert Clicker MainActivity.kt package com.example.dessertclicker import android.content.ActivityNotFoundException import android.content.Context import android.content.Intent import android.os.Bundle import android.util.Log import android.widget.Toast import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.activity.enableEdgeToEdge import androidx.annotation. DrawableRes import androidx.compose.foundation.Image import androidx.compose.foundation.background import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.WindowInsets import androidx.compose.foundation.layout.asPaddingValues import androidx.compose.foundation.layout.calculateEndPadding import androidx.compose.foundation.layout.calculateStartPadding impor...
Baca selengkapnya

EAS - UniTrack

Gambar
EVALUASI AKHIR SEMESTER Nama Anggota : Anas Azhar                                                      (502521043)                                            Fairuuz Azmi Firas (5025221057)                                            Fawwas Aldy Nurramdhan Kaisar (5025221179) Kelas : Pemrograman Perangkat Bergerak (A) UniTrack UniTrack adalah aplikasi mobile yang dirancang sebagai asisten akademik pribadi bagi mahasiswa. Aplikasi ini bertujuan untuk membantu mahasiswa mengelola dan melacak semua aspek penting dari kehidupan perkuliahan mereka, mulai ...
Baca selengkapnya