 |
| Berlatih Membuat UI pada Flutter |
Membuat Tampilan Flutter dengan FloatingActionButton, BottomNavigationBar, ListView, dan ExpansionTile - Salah satu resep utama dalam membuat tampilan aplikasi mobile dengan Flutter adalah mengusai widget-widget penting yang ada dalam framework Flutter. Untuk memahami widget-widget mulai dari struktur, cara kerja, dan hal-hal yang sifat-sifat dari masing-masing widget tersebut tentu saja kita harus banyak-banyak latihan.
Kali ini, saya akan membuat contoh tampilan pada framework flutter yang melibatkan beberapa widget penting yang sering dipakai oleh developer untuk membuat sebuh aplikasi mobile dengan Flutter. Widget-widget yang akan kita bahas dalam artikel ini adalah FloatingActionButton, BottomNavigationBar, ListView, dan ExpansionTile.
Sebelum kita praktik implementasi widget-widget tersebut kedalam sebuah kode untuk membentuk suatu tampilan yang menarik, perlu sobat ketahui penjelasan masing-masing widget tersebut di atas.
Kali ini, saya akan membuat contoh tampilan pada framework flutter yang melibatkan beberapa widget penting yang sering dipakai oleh developer untuk membuat sebuh aplikasi mobile dengan Flutter. Widget-widget yang akan kita bahas dalam artikel ini adalah FloatingActionButton, BottomNavigationBar, ListView, dan ExpansionTile.
Sebelum kita praktik implementasi widget-widget tersebut kedalam sebuah kode untuk membentuk suatu tampilan yang menarik, perlu sobat ketahui penjelasan masing-masing widget tersebut di atas.
FloatingActionButton
FloatingActionButton adalah tombol ikon melingkar yang melayang di atas konten untuk mempromosikan tindakan utama dalam aplikasi. Tombol aksi mengambang paling umum digunakan pada field Scaffold.floatingActionButton.
BottomNavigationBar
BottomNavigationBar adalah Widget material yang ditampilkan di bagian bawah aplikasi untuk memilih di antara beberapa tampilan, biasanya antara tiga dan lima menu.
ListView
ListView adalah widget gulir (berbentuk list) yang paling umum digunakan. Widget ini menampung daftar anak-anak nya, jika melebihi batas ukuran layar akan akan ditampikan kedalam bentuk scroll.
ExpansionTile
ExpansionTile adalah widget yang bisa digunakan sebagai anak dari ListView untuk menampilkan daftar lebih dari satu level. Karena ExpansionTile ini memiliki fitur expand dan collapse, sehingga cocok untuk mengelompokan menu dan mengurangan spase penggunaan layar dengan fitur collapse nya tanpa mengurangi nilai user experience terhadap suatu menu.
Mari langsung saja kita praktikan contoh pembuatan kode tampilan di Flutter yang melibatkan widget-widget tersebut di atas, untuk lebih memahami seperti apa tampilan dan penggunaan widget-widget tersebut.
Contoh Kode
Source code lengkap dari projek di atas bisa diambil melalui link dibawah ini
0 komentar: