Menulis Flutter Aplikasi Desktop

Permai Ramadhan
5 min readJun 22, 2021

--

Flutter memang framework yang masih muda, namun ia berkembang sangat cecpat. Awalnya dibuat untuk mempermudah pembuatan UI untuk aplikasi mobile (Android dan iOS).

Flutter kini bisa dipakai untuk membuat aplikasi untuk berbagai macam platform…

Mulai dari aplikasi mobile, web, hingga dekstop.

Pada kesempatan kali ini, kita akan belajar cara membuat aplikasi desktop dengan Flutter.

Mari kita mulai…

Persiapan Awal

Ada beberapa hal yang harus dipersiapkan untuk membuat aplikasi desktop dengan Flutter:

  1. Git;
  2. Flutter versi terakhir (2.2);
  3. VS Code atau Android Studio untuk coding;
  4. Beberapa Tools dan setup Environment.

Upgrade Flutter ke Versi Terbaru

Pastikan Flutter sudah terinstal di komputermu,

Setelah itu, lakukan upgrade ke versi terbaru, gunakan channel master untuk mendapatkan versi terakhir.

Ketik perintah berikut pada terminal atau CMD:

Tunggulah sampai prosesnya selesai…

Install VS Code atau Android Studio

Kita bisa menggunakan VS Code atau Android Studio untuk membuat aplikasi dengan Flutter.

Silahkan pilih salah satu…

Setup Tools dan Environmnet

Beberapa tools yang harus dipersiapkan:

  • Linux: GCC versi terakhir (9.1.0);
  • MacOS: Xcode versi terbaru;
  • Windows: Visual Studio 2017 atau 2019 dengan dukungan C++ development.

Pada tutorial ini, saya akan menggunakan Linux Kubuntu 18.04. Artinya, saya butuh GCC. GCC (GNU Compiler Collection) adalah paket yang berisi compiler untuk C/C++/Objective-C, dll.

Berikut ini perintah unutk menginstal GCC di Linux:

Berikutnya kita harus membuat variabel environment dengan ENABLE_FLUTTER_DESKTOP dan isinya true.

Pada Linux, silahkan buat di dalam file ~/.bashrc dengan export.

Untuk pengguna Fish Shell, silahkan buat variabel environment di dalam file .config/fish/config.fish dengan perintah berikut.

Untuk pengguna Windows, variabel Env bisa dibuat melalui Properties->Advenced->Environtment Variable.

Silahkan lakukan pencarian, kemudian ketik env.

Kemudian klik Environment Variables…

Buatlah variabel baru dengan nama ENABLE_FLUTTER_DESKTOP dan bernilai true.

Sehingga akan menjadi seperti ini:

Setelah itu, coba ketik perintah berikut:

Jika muncul seperti ini:

Maka komputer kita sudah siap dipakai untuk membuat aplikasi Flutter.

Membuat Aplikasi Desktop dengan Flutter

Flutter belum menyediakan perintah untuk membuat aplikasi desktop, karena saat ini masih dalam tahap eksperimental.

Mungkin ke depan nanti akan disediakan, sehingga kita bisa pakai perintah flutter create untuk memulai membuat aplikasi desktop.

Untuk saat ini kita bisa memanfaatkan repositori sampel dari Github.

Silahkan clone ke lokal, ketik perintah berikut:

Kemudian buka folder example yang ada pada flutter-desktop-embedding dengan teks editor VS Code.

Folder example pada repository flutter-desktop-embedding adalah sampel struktur proyek aplikasi desktop dengan Flutter.

Jika kamu akan membuat proyek baru, kamu bisa copy semua isi dari folder ini.

Jika kita perhatikan, struktur direktorinya hampir sama seperti aplikasi mobile dan web.

Pada aplikasi dekstop, terdapat direktori linux, macos, dan windows. Sedangkan pada mobile ada folder android dan ios.

Menjalankan Aplikasi Flutter di Desktop

Tanpa merubah apapun, kita langsung saja coba menjalankan aplikasi Flutter di Desktop. Namun sebelum melakukan itu, ada beberapa ritual yang harus dilakukan.

Pertama, install semua paket yang dibutuhkan.

Caranya:

Buka terminal di VS Code, kemudian ketik perintah:

Tunggulah sampai prosesnya selesai.

Kedua, install build tools. Ketik perintah berikut:

Untuk kamu yang menggunakan OS selain linux, silahkan ubah flag --linux menjadi --windows untuk Windows dan --macos untuk pengguna MacOS.

Perintah-perintah di atas diketik sekali saat awal saja. Selanjutnya kita tidak akan mengetiknya lagi, kecuali kalau kita instal package baru. Maka harus mengetik flutter packages get untuk mengambil paketnya dari internet.

Terakhir, ketik perintah:

Untuk menjalankan aplikasi.

Tunggulah sampai prosesnya selesai…

…maka akan muncul jendela baru.

Build Aplikasi Flutter

Oke sekarang mari kita build aplikasinya.

Silahkan ketik perintah berikut:

Build untuk Linux:

Build untuk Windows:

Build untuk MacOS:

Tunggu sampai selesai…

Hasilnya:

Akan ada folder baru pada folder build bernama linux (sesuai target build) dan di dalamnya terdapat folder release yang berisi file binary, library, dan data.

File binary ini bisa langsung kita eksekusi, coba saja klik 2x. Maka aplikasi akan terbuka.

Pada Windows, file ini akan berekstensi .exe.

Selanjutnya kita bisa distribusikan file binary ini ke user.

Biasanya dilakukan packaging dalam bentuk file .deb untuk distro Linux keluarga Debian dan .appimage untuk semua distro Linux.

--

--

Permai Ramadhan
Permai Ramadhan

No responses yet