Lompat ke konten Lompat ke sidebar Lompat ke footer

Widget HTML #1

Struktur Widget pada Flutter

Struktur widget pada aplikasi Flutter mengikuti konsep hierarki tree atau pohon yang terdiri dari kumpulan widget yang saling berhubungan. 

Berikut adalah beberapa struktur widget yang umum digunakan dalam pengembangan aplikasi Flutter:

  • Widget Utama (Root Widget): Setiap aplikasi Flutter memiliki widget utama yang bertanggung jawab untuk mengatur tampilan aplikasi. Widget utama biasanya adalah MaterialApp atau CupertinoApp, tergantung pada tema yang digunakan (Material Design atau iOS). Widget utama juga dapat memiliki widget-widget lain di dalamnya, seperti MaterialApp bisa memiliki widget seperti Scaffold atau CupertinoTabScaffold.
Berikut adalah contoh kode untuk widget utama (root widget) dalam Flutter:
<script src="https://pastebin.com/embed_js/FzrLamJ0"></script>

 

  • Scaffold: Scaffold adalah widget yang menyediakan struktur dasar untuk tampilan aplikasi. Biasanya, widget Scaffold berisi AppBar, Body, dan BottomNavigationBar atau FloatingActionButton, serta berbagai komponen lainnya seperti Drawer, SnackBar, dan sebagainya.

  • AppBar: AppBar adalah widget yang menampilkan judul aplikasi dan daftar tindakan (actions). Biasanya, AppBar ditempatkan di bagian atas tampilan aplikasi dan dapat berisi tombol kembali, ikon aksi, judul aplikasi, dan sebagainya.

  • Body: Body adalah area utama konten aplikasi. Di dalam Body, Anda dapat menempatkan widget-widget seperti Container, ListView, GridView, atau widget kustom yang mengatur tata letak dan konten aplikasi.

  • Container: Container adalah widget yang digunakan untuk mengatur tata letak dan gaya elemen-elemen dalam aplikasi. Container dapat memiliki properti seperti margin, padding, warna latar belakang, dan sebagainya.

  • ListView: ListView adalah widget yang digunakan untuk menampilkan daftar item yang dapat digulir. ListView dapat memiliki item yang ditempatkan secara vertikal (ListView) atau horizontal (ListView.horizontal).

  • GridView: GridView adalah widget yang digunakan untuk menampilkan item dalam susunan kotak seperti grid. GridView dapat memiliki jumlah kolom yang ditentukan atau bisa mengatur jumlah kolom secara otomatis.

  • Widget Kustom: Selain widget bawaan, Anda juga dapat membuat widget kustom yang sesuai dengan kebutuhan aplikasi Anda. Widget kustom dapat digunakan untuk menggabungkan widget-widget yang ada atau mengimplementasikan logika dan tampilan khusus.

Penting untuk mencatat bahwa struktur widget dapat beragam tergantung pada kompleksitas dan kebutuhan aplikasi Anda. Anda dapat menggabungkan, menyusun, dan menyusun widget-widget ini sesuai dengan keinginan dan tampilan yang diinginkan dalam aplikasi Flutter Anda.

Welly Eka Cipta
Welly Eka Cipta Halo, My name is Welly, and I am the Epilog Society channel's digital designer.