Tutorial

Flutter

Postingan terbaru minggu ini.

Luangkan minimal 1 jam sehari untuk update
pengetahuan koding.

Pembuatan Aplikasi To-Do List dengan Flutter dan Provider

Tutorial lengkap tentang cara membuat aplikasi To-Do List dengan Flutter dan Provider. Mulai dari membuat model tugas hingga mengelola state dengan Provider, semua dibahas secara detail.

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 …

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

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).

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….

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…

FLUTTER DEVELOPER

Aplikasi Pertamaku “Halo Semuaaa…”

Flutter merupakan sebuah SDK atau Software Development Kit yang dibuat oleh google untuk mengembangkan aplikasi dengan desain yang menarik untuk di platform Android dan iOS.

Cara Menggunakan Widget Text Pada Flutter

Teks merupakan komponen yang sangat penting dari sebuah User Interface aplikasi mobile, desktop, dan web. Kali ini saya akan menjelaskan properti-properti widget Text yang kemungkinan besar akan sering kita gunakan. Oke langsung saja berikut langkah-langkahnya:

Flutter Mini Project – Membuat Aplikasi Sederhana #1

Pada artikel ini, kita akan membuat aplikasi flutter mobile sederhana. Jika teman-teman familiar dengan pemrograman berbasis objek (OOP) dan konsep basic pemrograman seperti variabel, loops, dan conditional maka seharusnya teman-teman dapat dengan mudah membangun aplikasi sederhana ini. Teman-teman juga tidak membutuhkan pengalaman yang berhubungan dengan pemrograman bahasa Dart, Mobile, ataupun pemrograman web. 

Flutter Mini Project – Membuat Aplikasi Sederhana #2

Pada artikel ini, kita akan menambahkan fungsi di aplikasi flutter yang sebelumnya sudah kita buat. Kita juga akan membuat halaman kedua (disebut route) yang dapat dinavigasikan oleh pengguna. Terakhir, kita akan dapat memodifikasi tema aplikasi (warnanya).

Membuat UI yang cantik dengan Flutter

Jika dibandingkan dengan artikel Membuat Aplikasi Sederhana #1 dan Membuat Aplikasi Sederhana #2,  artikel ini akan memberikan penjelasan yang lebih mendalam tentang flutter. Namun jika teman-teman baru ingin berkenalan dengan flutter, saya sarankan untuk ikuti terlebih dahulu artikel Membuat Aplikasi Sederhana #1 dan Membuat Aplikasi Sederhana #2.

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

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:

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.

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…

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…

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…

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…

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,…

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…

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…

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…

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…

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….

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).

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

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 …

Pembuatan Aplikasi To-Do List dengan Flutter dan Provider

Tutorial lengkap tentang cara membuat aplikasi To-Do List dengan Flutter dan Provider. Mulai dari membuat model tugas hingga mengelola state dengan Provider, semua dibahas secara detail.