Flutter Archives | Koding Indonesia

Flutter

Anton Prafanto
Posted by Anton Prafanto
11 April 2021

Flutter Effects - Membuat Typing Indicator

Seperti yang kita ketahui aplikasi obrolan modern saat ini menampilkan indikator ketika pengguna lain secara aktif mengetik tanggapan pesan yang kita kirim. Indikator ini membantu mencegah respons yang terlalu cepat dan bertentangan antara ...

Anton Prafanto
Posted by Anton Prafanto
31 March 2021

Flutter Effects - Membuat Animasi Staggered Menu

Satu layar aplikasi mungkin berisi banyak animasi, namun memutar semua animasi tersebut pada saat yang sama dapat membuat pengguna kebingungan tapi memutar animasi satu persatu pun dapat memakan waktu. Jalan terbaik adalah

Anton Prafanto
Posted by Anton Prafanto
22 March 2021

Flutter Effects - Membuat Efek Scrolling Parallax

Kita akan memperhatikan bahwa gambar-gambar tersebut tampak bergulir lebih lambat daripada bagian layar lainnya. Hampir terlihat seolah-olah cards pada list berada di latar depan dan gambar yang ada di cards seolah-olah berada jauh di background list (Efek ini dikenal sebagai parallax).

Anton Prafanto
Posted by Anton Prafanto
19 March 2021

Flutter Effects - Membuat Filter Foto Carousel

Semua orang tahu kalau foto akan terlihat baik dengan menggunakan filter. Pada artikel ini kita akan membuat aplikasi scrollable filter carousel dengan menggunakan....

Anton Prafanto
Posted by Anton Prafanto
15 March 2021

Flutter Effects - Membuat Nested Navigation Flow

Perlu diketahui, aplikasi mengumpulkan ratusan route selama operasinya berjalan. Beberapa route pasti didefinisikan sebagai top-level route, misalnya seperti...

Anton Prafanto
Posted by Anton Prafanto
14 March 2021

Flutter Effects - Membuat Download Button

Pada artikel ini kita akan membuat button yang memicu proses download, menampilkan proses download dan lalu memberi akses ke aset yang telah selesai di download. Hal tersebut sangat membantu untuk...

Anton Prafanto
Posted by Anton Prafanto
13 March 2021

Flutter Design - Penggunaan Widget TabBar

Menerapkan tabs pada aplikasi merupakan hal yang umum ketika pengembang aplikasi mengikuti Material Design guidelines. Pada flutter, pengembang aplikasi disediakan...

Anton Prafanto
Posted by Anton Prafanto
12 March 2021

Flutter Design - Berbagi Tema (Warna dan Font Style)

Pada artikel sebelumnya (Cara Menggunakan Widget Text Pada Flutter) kita belajar cara mengatur warna teks, background dan font style. Namun kita hanya dapat mengatur warna teks, background dan font style teks tertentu saja, sehingga...

Anton Prafanto
Posted by Anton Prafanto
11 March 2021

Flutter Design - Update UI Berbasis Orientasi Layar

Dalam beberapa situasi, ada saatnya kita ingin memperbarui tampilan aplikasi saat kita memutar layar dari mode portrait ke mode landscape. Misalnya,...

Anton Prafanto
Posted by Anton Prafanto
11 March 2021

Flutter Design - Instalasi External Package (Font)

Pada artikel ini kita akan mempelajari cara untuk menggunakan font eksternal yang kita deklarasikan pada package aplikasi yang kita buat. Hal tersebut merupakan cara...

Anton Prafanto
Posted by Anton Prafanto
11 March 2021

Flutter Design - Menampilkan Snackbar Pada Aplikasi

Pada artikel ini kita akan mencoba menampilkan snackbar yang berguna untuk memberi tahu pengguna secara langsung saat tindakan tertentu terjadi. Misalnya...

Anton Prafanto
Posted by Anton Prafanto
10 March 2021

Flutter Design - Menambahkan Drawer Pada Aplikasi

Di Flutter, kita akan gunakan widget Drawer yang dikombinasikan dengan Scaffold untuk membuat layout dengan drawer yang dimiliki oleh...

Anton Prafanto
Posted by Anton Prafanto
9 March 2021

Flutter Animation - Animasi Fade In Out Pada Widget

UI developers sering kali perlu menampilkan dan menyembunyikan elemen di halaman layar. Namun, elemen yang muncul pada layar terkadang terlalu cepat sehingga dapat terasa mengagetkan bagi pengguna. Untuk itu sebagai gantinya, kita akan menggunakan...

Anton Prafanto
Posted by Anton Prafanto
9 March 2021

Flutter Animation - Membuat Animasi Properti Container

Animasi sederhana sering kali melibatkan perubahan properti-properti pada Container selama aplikasi dijalankan. Misalnya, ketika kita ingin membuat animasi perubahan warna latar belakang dari abu-abu menjadi warna hijau yang tujuannya untuk menunjukkan bahwa item telah dipilih oleh pengguna.

Anton Prafanto
Posted by Anton Prafanto
8 March 2021

Flutter Animation - Hukum Fisika Pada Animasi Widget

Simulasi fisika dapat memberikan pengalaman interaksi pengguna pada aplikasi sehingga terasa realistis dan interaktif. Dalam hal ini, kita akan menganimasikan widget agar berfungsi seolah-olah widget tersebut terpasang ke pegas atau jatuh kembali karena tarikan gravitasi. Langkah-langkahnya sebagai berikut:

Anton Prafanto
Posted by Anton Prafanto
7 March 2021

Flutter Animation - Membuat Animasi Transisi Route

Sebuah bahasa desain seperti halnya Material, mendefinisikan standard behaviors saat bertransisi (transisi standar) antar route (atau layar aplikasi). Namun, terkadang transisi khusus antar layar dapat membuat aplikasi menjadi lebih unik. Agar dapat melakukan transisi, maka di sini PageRouteBuilder menyediakan objek Animation untuk melakukan transisi khusus tersebut