ETS PPB

Mei 15, 2024

ETS PPB

REDESIGN APLIKASI "ACCESS BY KAI"

Nama: Muhammad Lintang Panjerino

NRP: 5025201045

Kelas: PPB I

Tahun: 2024

Link Github: ETS - Redesign Aplikasi "Access by KAI"

Link Dokumen ETS: Docs Jawaban ETS

Pada ETS PPB kali ini, diberikan tugas untuk melakukan redesign aplikasi sistem tiket. Oleh karena itu, saya membuat aplikasi redesign "Access by KAI". Secara garis besar, aplikasi yang saya buat memiliki 6 halaman, yaitu halaman login, halaman form tiket kereta, halaman daftar jadwal kereta, halaman memilih tempat duduk, halaman konfirmasi pembayaran tiket, dan halaman notifikasi pemesanan tiket. Aplikasi ini menggunakan beberapa konsep di Jetpack Compose seperti Card, Scaffold, Image, Icon, TextField, Dropdown, DatePicker, LazyColumn, NavHost, dan Route.

Untuk memulai pengerjaan proyek, langkah awal yang dilakukan adalah membuat proyek baru. Pada Android Studio, pilih "New Project" > pilih "Phone and Tablet" > pilih "Empty Activity" > pilih "Next". Kemudian pada window Empty Activity isi nama aplikasi yang akan dibuat, contohnya pada proyek ini judul aplikasi adalah "AccessKAI_ETS_PPB_Lintang_5025201045" dengan Minimum SDK berupa API 24 (Nougat).

Pada file MainActivity.kt, hapus fungsi Greeting, pemanggilan fungsi Greeting, dan preview fungsi Greeting sehingga hanya menyisakan fungsi onCreate dengan lambda setContent yang kosong. Selain itu, hapus juga komponen import yang tidak dibutuhkan.

Kemudian, buka file build.gradle.kts dan tambahkan implementasi untuk dependensi "navigation" di paling bawah. Implementasi tersebut dapat dilihat melalui link resmi dari website Android Studio berikut: https://developer.android.com/develop/ui/compose/navigation tepatnya pada subjudul "Setup" dan pilih bahasa "Kotlin".

Setelah itu, buat beberapa file screen selain file MainActivity.kt di mana tiap file ini nantinya akan merepresentasikan tiap halaman/screen yang akan dibuat. File yang perlu dibuat adalah: Login.kt, TiketKereta.kt, JadwalKereta.kt, PilihKursi.kt, Pembayaran.kt, Notifikasi.kt. Selain itu, buat juga object file Routes.kt untuk menyimpan object yang akan digunakan sebagai route. Masukkan juga resource yang diperlukan dan import ke dalam folder res > drawable agar resource seperti gambar atau logo dapat digunakan di aplikasi.

Langkah selanjutnya adalah membuat tampilan masing-masing halaman: file Login.kt untuk halaman login, TiketKereta.kt untuk halaman form tiket kereta, JadwalKereta.kt untuk halaman daftar jadwal kereta, PilihKursi.kt untuk halaman memilih tempat duduk, Pembayaran.kt untuk halaman konfirmasi pembayaran tiket, dan Notifikasi.kt untuk notifikasi pemesanan tiket.

Untuk keperluan routing, isi file Routes.kt dengan object yang berisi nama-nama route dari masing-masing halaman. Nama route dapat diisi bebas, tetapi sebaiknya menggambarkan nama halamannya masing-masing. Kemudian, di file MainActivity.kt buat NavHost yang berfungsi sebagai navigator yang mengatur navigasi dari seluruh file yang dimasukkan ke dalam daftarnya. Untuk tiap halaman, panggil fungsi composable di dalam fungsi NavHost dan masukknya juga parameter yang diperlukan di masing-masing halaman.