Hari 16: StatefulWidget & State Management Dasar

StatefulWidget

Berbeda dengan StatelessWidget, StatefulWidget memiliki State yang bisa berubah. Ketika state berubah (via setState()), Flutter akan me-rebuild UI.

import "package:flutter/material.dart";

class Counter extends StatefulWidget {
  const Counter({super.key});
  @override State createState() => _CounterState();
}

class _CounterState extends State {
  int _count = 0;

  void _increment() => setState(() => _count++);
  void _decrement() => setState(() => _count--);
  void _reset() => setState(() => _count = 0);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Counter App")),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text("Count: $_count", style: TextStyle(fontSize: 48)),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                ElevatedButton(onPressed: _decrement, child: Icon(Icons.remove)),
                SizedBox(width: 20),
                ElevatedButton(onPressed: _reset, child: Text("Reset")),
                SizedBox(width: 20),
                ElevatedButton(onPressed: _increment, child: Icon(Icons.add)),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

void main() => runApp(MaterialApp(home: Counter()));

Lifecycle StatefulWidget

class MyWidget extends StatefulWidget {
  const MyWidget({super.key});
  @override State createState() => _MyWidgetState();
}

class _MyWidgetState extends State {
  @override
  void initState() {
    super.initState();
    print("initState — widget dibuat pertama kali");
    // Tempat: inisialisasi data, setup listener, HTTP call pertama
  }

  @override
  void dispose() {
    print("dispose — widget dihapus dari tree");
    // Tempat: cleanup controller, cancel subscription
    super.dispose();
  }

  @override
  Widget build(BuildContext context) => Container();
}