State의 데이터가 바뀔 때 위젯의 UI도 새로운 데이터와 함께 새로고침된다. state의 데이터가 바뀌고 flutter에게 UI를 새로 그려달라고 해야 화면에 변경된 데이터가 나오게 된다. 그 메서드로 setState를 사용한다.

ex) setState

import 'package:flutter/material.dart';

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

class App extends StatefulWidget {
  const App({super.key});

  @override
  State<App> createState() => _AppState();
}

class _AppState extends State<App> {
  int counter = 0;

  void onClicked() {
     setState(() {
       counter = counter + 1;
     }); // 권장 방법
    
    // 아래와 같이도 할 수 있다.
    // counter = counter + 1; // 데이터를 수정하고
    // setState(() {}); // 데이터가 수정되었음을 flutter에게 알린다.
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        backgroundColor: const Color(0xFFF4EDDB),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center, // 세로 가운데
            children: [
              const Text(
                'Click Count',
                style: TextStyle(fontSize: 30),
              ),
              Text(
                '$counter',
                style: const TextStyle(fontSize: 30),
              ),
              IconButton(
                iconSize: 40,
                onPressed: onClicked,
                icon: const Icon(
                  Icons.add_box_rounded,
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}