Flutter App Lifecycle (Simple)

main.dart

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Lifecycle Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Lifecycle Demo'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});
  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> with WidgetsBindingObserver {
  int _counter = 0;

  // Called when this object is inserted into the tree
  @override
  void initState() {
    super.initState();
    print('1. initState: Widget is initialized');
    // Register this class as an observer of app lifecycle changes
    WidgetsBinding.instance.addObserver(this);
  }

  // Called when this object is removed from the tree
  @override
  void dispose() {
    print('5. dispose: Widget is being removed');
    // Remove the observer when the widget is disposed
    WidgetsBinding.instance.removeObserver(this);
    super.dispose();
  }

  // Called after initState and whenever parent widget changes
  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    print('2. didChangeDependencies: Dependencies changed');
  }

  // Called whenever the widget configuration changes
  @override
  void didUpdateWidget(MyHomePage oldWidget) {
    super.didUpdateWidget(oldWidget);
    print('3. didUpdateWidget: Widget was updated');
  }

  // Called when app lifecycle state changes (resumed, inactive, paused)
  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    super.didChangeAppLifecycleState(state);
    print('4. App lifecycle state changed to: ${state.name}');
    // state.name can be:
    // resumed - App is visible and responding to user input
    // inactive - App is in an inactive state and not receiving user input
    // paused - App is not visible to user, running in background
    // detached - App is still hosted on Flutter engine but disconnected from host views
  }

  void _incrementCounter() {
    setState(() {
      _counter++;
      print('setState called: Counter incremented to $_counter');
    });
  }

  // Build method is called when:
  // - After initState()
  // - After didUpdateWidget()
  // - After setState()
  // - When parent widget changes
  @override
  Widget build(BuildContext context) {
    print('build: Widget is being built/rebuilt');
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headlineMedium,
            ),
            const Text(
              '\nCheck the debug console to see lifecycle events!',
              textAlign: TextAlign.center,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}