TUGAS 8 PPB
ViewModel and State in ComposeThe Unscramble App
Berkas ini mencakup daftar kata yang dipakai dalam permainan, konstanta yang menentukan jumlah maksimal kata per permainan, serta jumlah poin yang diperoleh pemain untuk setiap kata yang benar.
Langkah 2 : Membuat MainActivity.kt
Langkah 3 : Membuat GameScreen.kt
Semua elemen UI yang dapat digubah didefinisikan dalam file GameScreen.kt. Bagian berikut ini memberikan panduan tentang beberapa fungsi composable.
Langkah 4 : Perlu adanya GameStatus
GameStatus adalah fungsi composable yang menampilkan skor permainan di bagian bawah layar. Fungsi composable ini berisi elemen teks di dalam Card. Saat ini, skor tersebut diatur secara statis ke 0.
Langkah 5 : Perlu adanya GameLayout
GameLayout adalah fungsi composable yang menampilkan fungsi game utama, mencakup kata acak, petunjuk game, dan kolom teks untuk tebakan pengguna, dengan kode yang memuat kolom dalam Card berisi tiga elemen: teks kata acak yang di-hardcode menjadi "scrambleun", teks petunjuk, dan kolom teks untuk input pengguna menggunakan OutlinedTextField, yang selanjutnya akan diimplementasikan untuk menampilkan kata dari file WordsData.kt dalam codelab berikutnya.
Langkah 6 : Perlu adanya GameScreen
Composable GameScreen mencakup fungsi composable GameStatus dan GameLayout, judul game, jumlah kata, serta composable untuk tombol Submit dan Skip.
Langkah 7 : Perlu adanya FinalScoreDialog
Composable FinalScoreDialog menampilkan dialog, yaitu jendela kecil yang memberikan permintaan kepada pengguna, dengan opsi untuk Play Again atau Exit game. Nanti dalam codelab ini, Anda akan menambahkan logika untuk menampilkan dialog ini di akhir permainan.
Langkah 8 : Perlu adanya ViewModel
Komponen ViewModel menyimpan dan menampilkan status UI, menjaga data aplikasi saat aktivitas dihancurkan dan dibuat ulang oleh framework Android, dan untuk mengimplementasikannya, perluas class ViewModel dari library komponen arsitektur dan simpan data aplikasi di dalamnya.
Langkah 9 : Perlu adanya StatusUI
UI adalah apa yang dilihat pengguna, sedangkan status UI adalah tampilan berdasarkan informasi dari aplikasi. UI merepresentasikan visual status UI, dengan perubahan pada status UI langsung tercermin di UI karena pengikatan elemen-elemen UI di layar dengan status UI.
UI adalah apa yang dilihat pengguna, sedangkan status UI adalah tampilan berdasarkan informasi dari aplikasi. UI merepresentasikan visual status UI, dengan perubahan pada status UI langsung tercermin di UI karena pengikatan elemen-elemen UI di layar dengan status UI.
Langkah 11 : Menambahkan ViewModel
Buka build.gradle.kts (Module :app), scroll ke blok dependencies, lalu tambahkan dependensi berikut untuk ViewModel. Dependensi digunakan untuk menambahkan viewmodel berbasis siklus proses ke aplikasi compose.
Langkah 12 : Perlu adanya StateFlow
StateFlow adalah aliran yang memegang data yang dapat diamati, menampilkan pembaruan status saat ini dan yang baru. Properti value mencerminkan nilai status saat ini, dan untuk memperbarui status serta mengirimkannya ke aliran, nilai baru dapat diatur pada properti value dari class MutableStateFlow. Di Android, StateFlow bekerja dengan baik pada class yang harus mempertahankan status tetap yang dapat diamati. StateFlow dapat ditampilkan dari GameUiState sehingga composable dapat memproses pembaruan status UI dan menjaga status layar tetap bertahan saat terjadi perubahan konfigurasi.
Langkah 13 : Menampilkan kata acak tanpa pola
- Pada GameViewModel, tambahkan currentWord dari jenis String untuk menyimpan kata acak.
- Tambahkan metode untuk pilih kata acak pickRandomWordAndShuffle() tanpa parameter input.
- Dalam GameViewModel, tambahkan currentWord agar berfungsi sebagai kumpulan yang dapat diubah.
- Tambahkan metode helper lain untuk mengacak kata shuffleCurrentWord() yang menggunakan String.
- Tambahkan fungsi bantuan resetGame().
- Tambahkan blok init ke GameViewModel dan panggil resetGame() dari block tersebut.
Langkah 14 : Merancang Compose UI
Di Compose, satu-satunya cara untuk memperbarui UI adalah dengan mengubah status aplikasi. Setiap kali status UI berubah, Compose membuat ulang bagian hierarki UI yang terpengaruh. Composable menerima status dan menampilkan peristiwa. Misalnya, TextField/OutlinedTextField menerima nilai dan memberikan callback onValueChange untuk mengubah nilai.
Langkah 15 : Memverifikasi kata tebakan dan memperbarui skor
Dalam tugas ini, implementasikan metode untuk memverifikasi kata yang ditebak oleh pengguna, kemudian memperbarui skor permainan atau menampilkan pesan kesalahan serta melakukan pembaruan status UI permainan dengan skor baru dan kata baru di langkah berikutnya.
Langkah 16 : Memperbarui skor dan jumlah kata
Memperbarui skor permainan dan jumlah kata yang telah ditebak oleh pengguna untuk mencerminkan kemajuan mereka dalam permainan.. Skor harus bagian dari _ uiState.
Langkah 17 : Menangani putaran terakhir game dan menampilkan dialog akhir game
Dalam implementasi, pengguna dapat melewati atau memainkan lebih dari 10 kata, perlu menambahkan logika untuk mengakhiri game dan memeriksa terlebih dahulu apakah pengguna telah mencapai jumlah kata maksimum. Dalam tugas ini, meneruskan data isGameOver ke GameScreen dari ViewModel dan menggunakannya untuk menampilkan dialog pemberitahuan yang menawarkan opsi untuk mengakhiri atau memulai ulang game, di mana dialog ini adalah jendela kecil yang meminta pengguna untuk membuat keputusan atau memasukkan informasi tambahan.
Langkah 18 : Membuat status dalan rotasi perangkat
ViewModel menyimpan data terkait aplikasi yang tidak dihancurkan saat aktivitas dihancurkan dan dibuat ulang oleh framework Android, sehingga objek ViewModel secara otomatis dipertahankan dan data yang disimpan segera tersedia setelah rekomposisi. Dalam hal ini, aplikasi memeriksa untuk mempertahankan status UI selama perubahan konfigurasi dengan menjalankan aplikasi, memutar beberapa kata, lalu mengubah konfigurasi perangkat dari potret ke lanskap atau sebaliknya, dan memperhatikan bahwa data yang disimpan di status UI ViewModel tetap dipertahankan.
Komentar
Posting Komentar