![]() |
Membuat Widget Untuk Loading Data pada Flutter |
Membuat Indikator Loading Data pada Flutter - Membuat tampilan loading atau indikator loading data saat aplikasi mobile melakukan proses pengambilan data atau proses rendering terlihat sederhana, namun hal ini sangat penting dan wajib kita lakukan dalam pembuatan aplikasi mobile.
Indikator loading sangat penting untuk menginformasikan kepada pengguna bahwa aplikasi kita sedang melakukan hal (bekerja) sehingga pengguna perlu menunggu karena aplikasi sedang melakukan proses.
Bayangkan, jika kita tidak melakukan atau membuat indikator loading pada aplikasi yang kita buat, tentu saja akan membuat pengguna bingung dan interaksi dengan pengguna akan terganggu karena tidak ada indikator yang memastikan apa yang sedang dilakukan aplikasi saat itu.
Untuk itu, dalam artikel kali ini saya akan memberi contoh cara membuat widget atau membuat indikator loading ketika aplikasi melakukan pengambilan data sehingga aplikasi terksan interaktif.
Membuat Projek Flutter
Untuk memperjelas cara membuat widget untuk loading indikator saat loading data pada Flutter, buatlah sebuah projek Flutter dengan kode sebagai berikut:
Kode
Kode
Yang perlu anda perhatikan pada kode di atas adalah, ketima membuat satu variable bernama isLoading dengan type bool dimana, ketika variable tersebut bernilai true maka kita asumsikan aplikasi dengan memuat (mengambil) data dan pada widget dari halaman tersebut kita menampilkan CircularProgressIndicator dan kita berikan tulisa Loading.. dibawah komponen tersebut.
Lalu jika variable isLoading bernilai false maka tampilan widget pada halaman tersebut akan berubah menjadi ListView (yang dapat disasumsikan sebagai tampilan data-data yang berhasil di muat oleh aplikasi).
Hasil Aplikasi
Berikut adalah hasil tamplan aplikasi dari kode yang kita buat di atas.
![]() |
Hasil Aplikasi Loading |
0 komentar: