Tugas 8 PPB Aplikasi Unscramble

Nama    : Javier Nararya Aqsa Setiyono

NRP      : 5025211245

Kelas     : Pemrograman Perangkat Bergerak B


Unscrambled App

Pada kesempatan kali ini saya diminta untuk membuat sebuah aplikasi unscramble menggunakan Android Studio. Kami telah diberikan kode awal untuk proyek ini yang dapat diakses melalui link yang akan disertakan dalam referensi di bawah. Berikut adalah file-file awal yang termasuk dalam kode starter:

File WordsData.kt berisi daftar kata yang akan digunakan dalam permainan, serta konstanta untuk jumlah maksimum kata per permainan dan skor yang diberikan kepada pemain untuk setiap kata yang berhasil dipecahkan. File MainActivity.kt sebagian besar berisi kode yang dihasilkan dari template Android Studio. Tampilan layar permainan ditampilkan dalam blok `setContent{}`. Semua fungsi antarmuka pengguna yang dapat disusun (composable) didefinisikan dalam file GameScreen.kt. Berikut adalah panduan untuk beberapa fungsi antarmuka pengguna yang dapat disusun.

GameStatus adalah fungsi antarmuka pengguna yang menampilkan skor permainan di bagian bawah layar. Fungsi ini menampilkan teks dalam sebuah `Card`. Saat ini, skor diatur secara default menjadi 0. GameLayout adalah fungsi antarmuka pengguna yang menampilkan elemen utama permainan, termasuk kata acak, petunjuk permainan, dan kolom teks untuk menerima tebakan dari pengguna. GameScreen adalah composable yang menggabungkan fungsi antarmuka pengguna GameStatus dan GameLayout, serta menampilkan judul permainan, jumlah kata, dan tombol untuk Submit dan Skip.

FinalScoreDialog adalah fungsi antarmuka pengguna yang menampilkan sebuah dialog, yaitu sebuah jendela kecil yang memberikan pilihan kepada pengguna untuk bermain lagi atau keluar dari permainan. Pada tahap selanjutnya dalam codelab ini, Anda akan mengimplementasikan logika untuk menampilkan dialog ini di akhir permainan.


Berikut adalah langkah-langkah untuk membuat aplikasi unscramble menggunakan Android Studio:

1. Membuat WordsData.kt
   - File ini berisi daftar kata yang digunakan dalam permainan, konstanta untuk jumlah maksimum kata per permainan, dan poin yang diberikan untuk setiap kata yang benar.

2. Membuat MainActivity.kt
   - File ini sebagian besar berisi kode dari template. Layar GameScreen ditampilkan dalam blok `setContent{}`.

3. Membuat GameScreen.kt
   - Semua elemen UI yang dapat disusun (composable) didefinisikan di sini, termasuk panduan untuk beberapa fungsi composable.

4. Implementasi GameStatus
   - Fungsi composable ini menampilkan skor permainan di bagian bawah layar dalam sebuah `Card`. Saat ini, skor diatur statis menjadi 0.

5. Implementasi GameLayout
   - Fungsi composable ini menampilkan elemen utama permainan, termasuk kata acak, petunjuk permainan, dan kolom teks untuk tebakan pengguna. Tiga elemen dalam `Card` adalah teks kata acak, teks petunjuk, dan kolom teks untuk input pengguna dengan `OutlinedTextField`.

6. Implementasi GameScreen
   - Composable ini menggabungkan fungsi `GameStatus` dan `GameLayout`, serta menampilkan judul permainan, jumlah kata, dan tombol Submit dan Skip.

7. Implementasi FinalScoreDialog
   - Fungsi composable ini menampilkan dialog kecil kepada pengguna dengan opsi untuk Bermain Lagi atau Keluar dari permainan. Logika untuk menampilkan dialog ini di akhir permainan akan ditambahkan nanti.

8. Menambahkan ViewModel
   - ViewModel menyimpan dan menampilkan status UI, menjaga data aplikasi saat aktivitas dihancurkan dan dibuat ulang oleh framework Android.

9. Mengimplementasikan StatusUI
   - StatusUI mengikat elemen-elemen UI dengan status aplikasi, memastikan perubahan pada StatusUI langsung tercermin di UI.

10. Membuat GameViewModel
    - Buat file Kotlin bernama `GameViewModel` dan perluas class ini dari `ViewModel`.

11. Menambahkan StateFlow
    - StateFlow digunakan untuk menampilkan pembaruan status saat ini dan baru, menjaga status aplikasi tetap terawat saat terjadi perubahan konfigurasi perangkat.

12. Memilih Kata Acak
    - Tambahkan properti `currentWord` untuk menyimpan kata acak saat ini dan buat metode untuk memilih kata acak.

13. Merancang UI dengan Compose
    - Perbarui UI dengan mengubah status aplikasi. Setiap perubahan status UI akan membuat ulang bagian UI yang terpengaruh.

14. Memverifikasi Kata Tebakan dan Memperbarui Skor
    - Implementasikan metode untuk memverifikasi kata yang ditebak pengguna dan memperbarui skor permainan.

15. Memperbarui Skor dan Jumlah Kata
    - Perbarui skor dan jumlah kata yang ditebak untuk mencerminkan kemajuan permainan.

16. Menangani Akhir Permainan dan Menampilkan Dialog
    - Tambahkan logika untuk mengakhiri permainan dan menampilkan dialog akhir permainan dengan opsi untuk mengulangi permainan atau keluar.

17. Menyimpan Status dalam Rotasi Perangkat
    - ViewModel menyimpan data aplikasi yang tetap tersedia setelah rotasi perangkat, memastikan data aplikasi dipertahankan.

Ringkasan langkah-langkah ini memberikan panduan tentang bagaimana setiap bagian aplikasi dirancang dan diimplementasikan menggunakan Android Studio dan Jetpack Compose.

Berikut adalah tampilan aplikasi yang saya buat :

1. Dimana pada Tampilan awal akan menunjukan tampilan sebagai berikut, tugas kita adalah menyusun kata yang telah dibuat. Pada soal kali ini, kata yang trsusun adalah "minute




2. Saat memasukkan jawaban yang benar, poin akan bertambah


3. Jika jawaban salah, tampilan akan menjadi merah "wrong answer"


4. Jika 10 soal telah usai, maka hasil akhir akan menampilkan tampilan skor seperti pada gambar berikut



Berikut adalah link github saya : 




Komentar

Posting Komentar

Postingan populer dari blog ini

EAS FINAL PROJECT PBKK B

Gambar
Nama     : Javier Nararya Aqsa Setiyono NRP       : 5025211245 Kelas      : PBKK B Paper referensi sebagai berikut : https://www.akrabjuara.com/index.php/akrabjuara/article/view/1302/1150 Berdasarkan referensi yang sudah didapatkan, 1.  Buatlah deskripsi studi kasus aplikasi ditinjau dari MVC nya(individu) Pada zaman sekarang, sistem informasi sangat dibutuhkan dalam kehidupan sehari-hari. Bukan tanpa sebab,  p erkembangan teknologi informasi telah memberikan dampak positif terhadap berbagai sektor, termasuk industri penjualan makanan. Untuk meningkatkan efisiensi dan keterjangkauan pelanggan, dibangunlah Sistem Informasi Penjualan makanan Berbasis Web menggunakan Framework CodeIgniter. Framework ini dipilih karena kemampuannya yang tangguh dalam mempermudah pengembangan aplikasi web dengan pola desain Model-View- Controller (MVC). Model : Model dalam sistem ini bertanggung jawab untuk mengelola data terkait penjualan makanan geprek. In...
Baca selengkapnya

Tugas 6 PPB Woof App

Gambar
Nama     : Javier Nararya Aqsa Setiyono NRP       : 5025211245 Kelas      : Pemrograman Perangkat Bergerak B Pada kesempatan kali ini saya akan membuat aplikasi  yang menampilkan daftar anjing dengan menggunakan Desain Material untuk membuat tampilan dan pengalaman aplikasi yang menarik. Woof App ini merupakan penerapan dari material desain. Woof App ini menggunakan tampilan yang modern. Berikut tampilan dari woof app yang saya buat : Tampilan pertama adalah saya membaut tampilam light pada menu Woof App sebagai berikut : Tampilan berikutnya adalah saya membuat darkmode untuk menu pada Woof App sebagai berikut :
Baca selengkapnya

Tugas 2 PPB Membuat Aplikasi Happy Birthday dengan Composable Text

Gambar
Nama     : Javier Nararya Aqsa Setiyono NRP       : 5025211245 Kelas      : Pemrograman Perangkat Bergerak B Membuat Aplikasi Happy Birthday dengan Composable Text Pada kesempatan kali ini saya akan membuat aplikasi dengan tema happy birthday dengan composable text menggunakan aplikasi Android Studio. Android Studio sendiri merupakan aplikasi text editor yang digunakan untuk membuat sebuah desain UI. Toolkit modern yang saya pilih untuk membangun UI android ini adalah jetpack compose. Dimana toolkit ini menggunakan lebih sedikit kode, dan memiliki API kotlin yang intuitif. Berikut Langkah umum pembuatan aplikasi ini : 1. Pilih  New Project pada laman W elcome to Android Studio 2. Pilih  Empty Activity pada laman New Project 3. Berikan nama file untuk project yang dibuat pada kolom name 4. Pilih level API minimum 24 (Nougat) di kolom  Minimum SDK lalu tekan Finish    Kemudian, saya ikuti langkah-langkah sesuai di tutoria...
Baca selengkapnya