penjelasan login

Penjelasan Alur Aplikasi LoginScreen, MainActivity, DashboardScreen

📚 Penjelasan Struktur dan Alur Aplikasi Login Centry

1. Arsitektur Umum Aplikasi

Aplikasi ini dibangun menggunakan Jetpack Compose dengan alur navigasi screen sederhana.

MainActivity
    └──> LoginScreen
            └──> jika berhasil login ➔ DashboardScreen

2. File Penting dan Perannya

  • MainActivity.kt – Mengatur tampilan awal dan navigasi antar screen.
  • LoginScreen.kt – Tampilan form login user.
  • DashboardScreen.kt – Tampilan utama setelah login sukses.

3. Penjelasan Detail Masing-masing File

➡️ MainActivity.kt

  • File pertama kali dijalankan.
  • Menampilkan LoginScreen.
  • Jika login sukses, berpindah ke DashboardScreen.

➡️ LoginScreen.kt

  • Form input email dan password dalam Card putih di atas background.
  • Jika login sukses (field tidak kosong), memanggil onLoginSuccess().

➡️ DashboardScreen.kt

  • Tampilan setelah login sukses (menu utama).

4. Alur Jalannya Aplikasi (Step-by-Step)

  1. Aplikasi dibuka ➔ MainActivity aktif.
  2. MainActivity menampilkan LoginScreen.
  3. User input Email dan Password di LoginScreen.
  4. User klik tombol Login.
  5. Validasi form: jika sukses ➔ onLoginSuccess() dipanggil.
  6. MainActivity mengganti tampilan ke DashboardScreen.

5. Detail Komponen di LoginScreen.kt

  • Box – Layering background dan isi form.
  • Image(background) – Background gambar fullscreen.
  • Column – Menyusun konten secara vertikal.
  • Card – Form login dengan border bulat.
  • Image(logo_centry) – Logo di atas form.
  • OutlinedTextField – Input Email dan Password.
  • PasswordVisualTransformation – Menyembunyikan password input.
  • Row (Lupa Password) – Teks kecil di kanan.
  • Button(Login) – Tombol untuk mengirim form.
  • Row (Social Login) – Ikon Google, LinkedIn, Facebook.
  • Image(logo_icon) – Logo kecil di bawah form.

6. Hubungan Antar File

FungsiFilePenjelasan
onLoginSuccess() Dipanggil dari LoginScreen Callback untuk MainActivity
isLoggedIn (State) MainActivity Mendeteksi apakah user sudah login atau belum
Navigasi ke DashboardScreen MainActivity Menampilkan DashboardScreen setelah sukses login

7. Kesimpulan Besar

Aplikasi ini mengandalkan LoginScreen untuk input kredensial, mengandalkan MainActivity untuk mengontrol alur berpindah antar layar, dan DashboardScreen sebagai tujuan utama setelah login sukses.

Komentar

Posting Komentar

Postingan populer dari blog ini

ETS -- Do Everything - Aplikasi To-Do List

Gambar
Laporan Proyek – Do Everything ETS Do Everything – Aplikasi To-Do List Personal Nama NRP Yusuf Hasan Nazila 5025211225 Deskripsi Aplikasi Do Everything adalah aplikasi to-do list Android berbasis Jetpack Compose yang membantu pengguna dalam mencatat, mengatur, dan menyelesaikan tugas harian secara efisien. Fitur Aplikasi Menambahkan tugas dengan deadline Menandai tugas sebagai selesai Penyortiran berdasarkan deadline atau status Menggunakan UI modern berbasis Material Design 3 Desain Aplikasi Desain aplikasi dibuat sederhana dan intuitif, dengan gaya modern berbasis Material Design 3. Tampilan mencakup input tugas, daftar tugas aktif dan selesai, serta tombol tambah tugas. Tools yang Digunakan Android Studio ...
Baca selengkapnya

Tugas 6 - Kalkulator Konversi Uang

Gambar
Dokumentasi Aplikasi Konversi Mata Uang Nama NRP Hasan Nazila 5025201247 Aplikasi Konversi Mata Uang Aplikasi ini dibuat menggunakan Jetpack Compose untuk melakukan konversi antara berbagai mata uang secara real-time. Tampilan Aplikasi Fitur Utama Input jumlah uang Dropdown untuk memilih mata uang asal dan tujuan Konversi real-time berdasarkan nilai tukar tetap Tampilan hasil konversi secara langsung Langkah Pembuatan Buka Android Studio dan buat project baru dengan Jetpack Compose. Edit file MainActivity.kt dan tambahkan UI serta logic konversi. Buat fungsi getConversionRate() untuk menyediakan nilai tukar tetap antar mata uang. Gunakan TextField untuk input jumlah, OutlinedButton dan DropdownMenu untuk pilihan mata uang. Gunakan LaunchedEffect untuk menjalankan perhitungan otomatis saat nilai berubah. Penjelasan Kode Kotlin ...
Baca selengkapnya

TUGAS 4 - YUSUF HASAN NAZILA

Gambar
Modifikasi Aplikasi Sederhana dengan Menerapkan Button Component Modifikasi Aplikasi Sederhana dengan Menerapkan Button Component Nama NRP Yusuf Hasan Nazila 5025211225 Dice Roller adalah aplikasi sederhana untuk melempar dadu secara digital. Awalnya, Dice Roller hanya mengganti gambar dadu setiap kali tombol Roll ditekan. Untuk membuat aplikasi lebih menarik, kita akan memodifikasi proyek ini: dari hanya mengganti gambar menjadi ada animasi dadu yang melayang, berputar, dan jatuh. Tahapan Pembuatan Dice Roller 1. Membuat Dice Roller Sederhana Pada tahap awal, aplikasi Dice Roller hanya: Menampilkan gambar dadu menggunakan komponen Image. Menyediakan tombol menggunakan komponen Button untuk Roll. Saat tombol ditekan, gambar dadu langsung berubah secara instan. Kode Dasar: @Composable fun DiceWithButtonAndImage(modifier: Modifier = Modifier) { var result by remember { mutableSt...
Baca selengkapnya