Memahami Struktur Dasar Aplikasi Flutter

Dart adalah sebuah bahasa pemrograman yang dikembangkan oleh Google dan merupakan bahasa pemrograman resmi untuk Flutter, sebuah UI toolkit dan aplikasi multiplatform dari Google. Flutter sendiri telah digunakan oleh berbagai perusahaan besar seperti Google, Alibaba.com, dan Tencent.

Karena dapat menghemat waktu dan tenaga dengan cara cukup membutuhkan satu codebase untuk mengembangkan aplikasi di berbagai platform, daripada harus menghabiskan waktu untuk membuat codebase terpisah untuk masing-masing platform.

Dart Programming: Basic

Memahami Struktur Dasar Aplikasi Flutter

Dart Programming: Kondisi dan Perulangan

Memahami Struktur Dasar Aplikasi Flutter

Dart Programming: Fungsi

Memahami Struktur Dasar Aplikasi Flutter

Dart Programming: OOP

Memahami Struktur Dasar Aplikasi Flutter

Struktur direktori Flutter Project
  1. android berisi source code untuk aplikasi android;
  2. ios berisi source code untuk aplikasi iOS;
  3. lib berisi source code Dart, di sini kita akan menulis kode aplikasi;
  4. test berisi source code Dart untuk testing aplikasi;
  5. .gitignore adalah file Git;
  6. .metadata merupakan file yang berisi metadata project yang di-generate otomatis;
  7. .packages merupakan file yang berisi alamat path package yang dibuat oleh pub;
  8. flutter_app.iml merupakan file XML yang berisi keterangan project;
  9. pubspec.lock merupakan file yang berisi versi-versi library atau package. File ini dibuat oleh pub. Fungsinya untuk mengunci versi package.
  10. pubspec.yaml merupakan file yang berisi informasi tentang project dan libraray yang dibutuhkan;
  11. README.md merupakan file markdown yang berisi penjelasan tentang source code.

Struktur dasar Source Code Flutter
  1. Saat pertama kali membuat Flutter Project, akan terdapat file source code sample pada folder lib/main.dart
  2. Kode main.dart tersebut terdiri dari tiga bagian utama:
    • Bagian import, Tempat mendeklarasikan atau mengimpor library yang dibutuhkan pada aplikasi,
    • Bagian main, Bagian main adalah fungsi utama dari aplikasi yang akan menjadi entry point. Fungsi ini akan dieksekusi pertama kali saat aplikasi dibuka.
    • Bagian widget, Bagian widget adalah tempat untuk membuat widget Flutter. Aplikasi Flutter terdiri dari susunan widget. Widget merupakan elemen-elemen pembentuk aplikasi Flutter.
Memahami Struktur Dasar Aplikasi Flutter
Memahami Struktur Dasar Aplikasi Flutter
Memahami Struktur Dasar Aplikasi Flutter

Konsep Widget Pada Flutter
  1. Pada Flutter, semua adalah Widget. Flutter dibangun dari kumpulan Widget yang membentuk sebuah “Pohon Widget”
  2. Setiap interface widget biasanya memiliki child, yang akan diisi oleh widget lainnya, dan widget tersebut akan memiliki child yang akan diisi oleh widget lain. Pola ini akan menghasilkan “Pohon Widget”
  3. Widget pada Flutter berjumlah sangat banyak. Namun, Anda tidak perlu menghafal semua widget untuk menggunakan membuat aplikasi Flutter
  4. Semua widget tersedia di katalog widget Flutter. Anda cukup mencari widget yang dibutuhkan di katalog tersebut. Cara pemakaian widget juga tersedia di katalog tersebut.

Flutter Basic Widget
  1. MyApp adalah StatelessWidget, merupakan widget induk
  2. MaterialApp adalah widget yang membungkus beberapa widget yang menggunakan tema material design 1. Pada aplikasi iOS, biasanya digunakan CupertinoApp
  3. Scaffold adalah widget untuk struktur dasar material design
  4. AppBar adalah widget untuk membuat Bar judul yang terletak di bagian atas aplikasi

Contoh Flutter Basic Widget

Memahami Struktur Dasar Aplikasi Flutter

Widget for Android and ios

Memahami Struktur Dasar Aplikasi Flutter

Layout Widget

Memahami Struktur Dasar Aplikasi Flutter

Kesimpulan
  1. Flutter merupakan multi-platform SDK yang memungkinkan developer untuk mengembangkan aplikasi Android & iOS dengan satu framework
  2. Dibanding multi-platform framework lain, Flutter unggul di performa aplikasi karena tidak membutuhkan “jembatan” dalam mengkompilasi aplikasinya
  3. Aplikasi Flutter dibangun dengan paradigma “Widget-Tree” dimana objek interfacenya merupakan widget-widget yang memiliki propertinya masing-masing

Sumber Referensi :
 towardsdatascience.com | statista.com