Home Mobile Panduan Menggunakan Lottie di Flutter

Panduan Menggunakan Lottie di Flutter

0

Apa Itu Lottie?

Lottie adalah library yang memungkinkan Anda menampilkan animasi JSON berkualitas tinggi di aplikasi mobile. Animasi ini biasanya dibuat dengan Adobe After Effects dan diekspor sebagai file JSON menggunakan plugin Bodymovin.

Keuntungan Menggunakan Lottie

  • Efisien: Menggunakan file JSON yang ringan dibandingkan video.
  • Interaktif: Mendukung interaktivitas yang dapat diatur secara dinamis.
  • Kualitas Tinggi: Menawarkan animasi berkualitas tinggi tanpa membebani aplikasi.

Langkah-langkah membuat Lottie

a. Membuat Proyek Flutter Baru

b. Menambahkan Dependency

Tambahkan dependency lottie ke file pubspec.yaml:

Setelah menambahkan, jalankan perintah berikut untuk menginstal package: “flutter pub get”

c. Menyiapkan Animasi Lottie

Unduh Animasi

  1. Kunjungi LottieFiles dan pilih animasi yang diinginkan. Misalnya, animasi success.json dan failed.json.
  2. Unduh file animasi dalam format JSON.

b. Menyimpan Animasi

  1. Buat folder bernama assets/lottie di dalam proyek Flutter Anda.
  2. Tempatkan file success.json dan failed.json ke dalam folder assets/lottie.

setelah itu masukan kodingan dibawah untuk membuat lottie nya

ini merupakan hasil dari lottie yang dibuat

https://lottiefiles.com/