Skip to content

4. UI Login & Register

Pada pengerjaan aplikasi travel ini selanjutnya kita akan membuat tampilan dari Login dan juga Register. Untuk pembuatannya disini tidak ada kode yang bisa di copy paste melainkan kalian yang akan membuat sendiri tampilannya

Keterangan

  • Sebelum membuat tampilan buatlah terlebih dahulu filenya bernama login.dart & register.dart
  • Buat class statefull widget untuk kedua file ini
  • Lalu daftarkan pada route dengan nama /login & /register
  • Buat aksi pada introduction onSkip & onDone arahkan & replace ke halaman login

UI Login

Bentuk tampilan loginnya adalah seperti ini:

Alt text

Ketentuan

  • Setiap size & jarak (yang sizenya gede) wajib menggunakan media query agar tampilannya bisa dijalankan di berbagai device
  • Password bisa di show & hide dengan menggunakan suffix icon
  • Remember me dapat di centang
  • Tombol Create Account jika di klik akan mengarah ke /register
  • Untuk assets bisa di download Disini

UI Register

Bentuk tampilan registernya adalah seperti ini:

Alt text

Ketentuan

  • Setiap size & jarak (yang sizenya gede) wajib menggunakan media query agar tampilannya bisa dijalankan di berbagai device
  • Password & Konfirmasi Password bisa di show & hide dengan menggunakan suffix icon
  • Tombol Back To Login jika di klik akan kembali ke halaman /login