widget fluter

 

🧩 Apa itu Widget di Flutter?

Widget adalah komponen dasar antarmuka (UI) di Flutter.

Semua yang kamu lihat di layar aplikasi Flutter (teks, tombol, gambar, layout, dsb) adalah widget.

---

⚙️ Jenis-Jenis Widget Utama

1. StatelessWidget

➜ Tidak berubah selama aplikasi berjalan.

Contoh: Text, Icon, Container.

import 'package:flutter/material.dart';

class HaloWidget extends StatelessWidget {

  @override

  Widget build(BuildContext context) {

    return Center(

      child: Text('Halo Flutter!'),

    );

  }

}

2. StatefulWidget

➜ Bisa berubah sesuai interaksi pengguna atau data.

Contoh: Checkbox, TextField, Slider.

import 'package:flutter/material.dart';

class CounterApp extends StatefulWidget {

  @override

  _CounterAppState createState() => _CounterAppState();

}

class _CounterAppState extends State<CounterApp> {

  int count = 0;

  @override

  Widget build(BuildContext context) {

    return Scaffold(

      appBar: AppBar(title: Text('Contoh StatefulWidget')),

      body: Center(

        child: Column(

          mainAxisAlignment: MainAxisAlignment.center,

          children: [

            Text('Kamu menekan tombol sebanyak: $count kali'),

            ElevatedButton(

              onPressed: () {

                setState(() {

                  count++;

                });

              },

              child: Text('Tambah'),

            ),

          ],

        ),

      ),

    );

  }

}

---

💡 Contoh Widget yang Sering Digunakan

Jenis Widget Fungsi

Teks Text() Menampilkan teks

Tombol ElevatedButton() Membuat tombol

Gambar Image.asset() / Image.network() Menampilkan gambar

Tata letak Row(), Column(), Container() Menata tampilan

Input TextField(), Checkbox(), Radio() Input dari pengguna

Navigasi Scaffold(), AppBar(), BottomNavigationBar() Struktur halaman

---

Kamu mau aku buatin contoh aplikasi Flutter sederhana (misal: tamp

ilan profil, galeri, login, atau counter) biar kamu lihat cara kerja widget-nya langsung?