Membuat Aplikasi Desktop MacOS Dengan Flutter

Membuat Aplikasi Desktop MacOS Dengan Flutter – Hallo sobat kopi coding, pada postingan kali ini kita akan mempelajari bagaimana cara membuat aplikasi desktop MacOS dengan framework Flutter.

Sekarang ini (2020), Flutter mendukung desktop app di MacOS (Apple) yang tersedia pada versi alpha. Pada platform Windows dan Linux, Flutter masih mengembangkan untuk dukungan platform tersebut.

Persyaratan :

Untuk membuat aplikasi Flutter dengan dukungan macOS, memerlukan perangkat lunak berikut:

• Flutter SDK
• XCode
• CocoaPods
• IDE (VSCode, Android Studio)
  

Membuat Project Baru :

1. Setup Flutter SDK

Pada command line dibawah ini merupakan cara untuk mengaktifkan dukungan desktop MacOS pada Flutter.

$ flutter channel master
$ flutter upgrade
$ flutter config --enable-macos-desktop

Untuk memastikan konfigurasi desktop sudah berhasil, kita dapat melihat device MacOs yang terdeteksi oleh Flutter dengan command line berikut :

$ flutter devices

Pada gambar dibawah ini merupakan hasil flutter doctor tanpa ada masalah. Cek flutter kalian jika ada masalah dengan command berikut :

$ flutter doctor

Catatan : ketitka kalian sudah melakukan konfigurasi mengaktifkan dukungan desktop MacOS, kalian harus me-restart IDE kalian.

2. Membuat Project

Untuk membuat project baru buka terminal serta menggunakan editor Visual Studio Code, ikuti langkah berikut:

$ flutter create kopicoding
$ cd kopicoding
$ code .

3. Source Code :

Pada folder project buka file main.dart yang berada di folder lib, lalu hapus semua code dan masukkan code berikut:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var title = 'Kopi Coding';
    return MaterialApp(
      title: title,
      home: Scaffold(
          appBar: AppBar(
            title: Text(title),
          ),
          body: Center(
            child: Text('Created By Kopi Coding'),
          )),
    );
  }
}

Simpan source code dengan nama main.dart dan jangan lupa harus berektensi .dart

Penjelasan :

Berikut adalah penjelasan source code programnya :

• Baris 1: Mengimport library material.dart
• Baris 3: Membuat fungsi main yang memanggil class MyApp
• Baris 5: membuat class MyApp yang ber-extends StatelessWidget
• Baris 8: Mendeklarasikan variable title dengan value “Kopi Coding”
• Baris 10-15: Inisialisasi variable untuk konfigurasi AppBar
• Baris 16: inisialisasi body dengan memanggil constructor Center dengan child berupa Text dengan value yaitu “Created By Kopi Coding”

4. Menjalankan Flutter:

Berikut adalah cara menjalankan flutter desktop dengan platform MacOS secara manual:

$ flutter run -d macos

berikut gambar hasil compile dan run source code programnya:

MacOS :

Kesimpulan :

Dari hasil konfigurasi dan aplikasi yang telah dibuat serta dijalankan, source code tersebut berhasil dapat dijalankan tanpa ada error dan menampilkan hasil berupa text serta dapat berjalan di desktop MacOS.

Sekian tutorial cara konfigurasi dan membuat project desktop MacOS dengan flutter, semoga bermanfaat 🙂

Happy Coding!

Referensi: https://flutter.dev/desktop