1.4. Rancangan Tampilan

Mari kita bantu Dudung menyelesaikan misinya. Pertama, kita rancang dulu sketch User Interface (UI) nya.

Halaman login

Rancangan tampilan pada halaman login, terdapat sebuah ImageView untuk menampilkan logo, dua buah EditText masing-masing untuk menuliskan email dan password. Sebuah Button bertuliskan "login" untuk melakukan proses login ke server. Berikut gambar halaman login. Apabila proses login atau register berhasil dilakukan, user akan diarahkan ke halaman utama.

Halaman Utama

Halaman ini digunakan untuk menampilkan daftar item todo. Komponen yang digunakan adalah ListView. Pada bagian bawah, terdapat FloatingActionButton untuk melakukan aksi tambah item-todo. Apabila tombol ini disentuh, akan dibawa ke halaman tambah-item.

Halaman tambah-item

User dapat menulis item-todo melalui EditText. Disediakan juga tombol save untuk menyimpan dan tombol cancel untuk membatalkan aksi. Berikut ini tampilan halaman tambah-item. Apabila tombol save disentuh, user dibawa kembali ke halaman utama dan item yang baru saja diketik akan muncul sebagai item baru.