Lihat ke Halaman Asli

Penggunaan Flutter Pada Pembuatan Aplikasi Berbasis Mobile

Diperbarui: 13 Desember 2022   10:39

Kompasiana adalah platform blog. Konten ini menjadi tanggung jawab bloger dan tidak mewakili pandangan redaksi Kompas.

Ilmu Alam dan Teknologi. Sumber ilustrasi: PEXELS/Anthony

Pada pembuatan aplikasi berbasis mobile, beberapa platform dapat digunakan untuk mengembangkan aplikasi mobile. Sebagai bagian dari pengembangan pembelajaran yang inovatif, digunakan platform yang saat ini banyak digunakan oleh developer.

Aplikasi mobile (Mobile Apps) yaitu aplikasi yang dibuat untuk perangkat-perangkat bergerak (Mobile) seperti : Smartphone, SmartWatch, Tablet, dan lainnya. Perangkat lunak atau disebut juga software aplikasi merupakan hasil dari pemrograman mobile yang dirancang menggunakan bahasa pemrograman tertentu.

Flutter adalah platform yang digunakan para developer untuk membuat aplikasi multiplatform hanya dengan satu basis coding (codebase). Artinya, aplikasi yang dihasilkan dapat dipakai di berbagai platform, baik mobile Android, iOS, web, maupun desktop. 

Flutter memiliki dua komponen penting, yaitu, Software Development Kit (SDK) dan juga framework user interface. 

  • Software Development Kit (SDK) merupakan sekumpulan tools yang berfungsi untuk membuat aplikasi supaya bisa dijalankan di berbagai platform. 
  • Framework UI merupakan komponen UI, seperti teks, tombol, navigasi, dan lainnya, yang dapat Anda kustomisasi sesuai kebutuhan.

Bagian-bagian dalam membuat aplikasi mobile dengan flutter :

  • Header: Bagian yang menangani informasi aplikasi, title maupun icon.
  • Body: Bagian yang berisi content aplikasi yang akan dibuat.
  • Footer: Bagian optional yang bisa dicustom misalnya list menu, floating action button, dan lain-lain.

Ketiga bagian tersebut dibungkus dengan Scaffold Class. Scaffold Class inilah yang nantinya akan membentuk struktur tata letak dasar mulai dari header, body sampai footer. Sekarang mari kita mulai menerapkan beberapa code yang bisa diletakan pada masing-masing bagian.

  1. Beri nama project startup_namer (bukan flutter_app).
  2. Ganti konten lib/main.dart dengan menghapus semua kode dari lib/main.dart dan gantilah dengan code di bawah ini pada bagian header:

1

2

3

4

// Header

Halaman Selanjutnya


BERI NILAI

Bagaimana reaksi Anda tentang artikel ini?

BERI KOMENTAR

Kirim

Konten Terkait


Video Pilihan

Terpopuler

Nilai Tertinggi

Feature Article

Terbaru

Headline