[Flutter] StatefulWidget 란?

Flutter StatefulWidget

StatefulWidget은 Flutter에서 상태를 유지할 수 있는 위젯입니다. 상태(State)는 사용자의 상호작용에 따라 변할 수 있는 값이나 UI의 변경 사항을 의미합니다. 즉, StatefulWidget은 상태가 변경될 때마다 다시 빌드되어 화면에 변경 사항을 반영할 수 있습니다.

 

 

 

 

 

StatefulWidget 특징

• 상태 유지: StatefulWidget은 위젯의 상태를 유지합니다. 예를 들어, 사용자가 버튼을 클릭하거나 입력 폼에 값을 입력할 때 그 상태가 변경됩니다.
• State 클래스: StatefulWidget은 상태를 관리하기 위해 State 클래스와 함께 사용됩니다. 상태가 변경되면 setState() 메서드를 호출하여 UI를 다시 렌더링합니다.
• 생명주기: StatefulWidget은 위젯의 생명주기 동안 여러 번 빌드되며, 상태가 유지되면서 화면에 반영됩니다.

 

 

 

 

 

 

 

StatefulWidget 구조

StatefulWidget은 두 부분으로 나누어집니다:

• StatefulWidget 클래스: 위젯 자체의 불변 속성을 정의합니다.
• State 클래스: 상태를 저장하고, UI를 업데이트하는 역할을 합니다.

 

 

 

 

 

 

 

 

StatefulWidget 예제

class MyStatefulWidget extends StatefulWidget {
  @override
  _MyStatefulWidgetState createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('StatefulWidget 예제'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              '버튼을 누른 횟수:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}
    

 

 

 

 

 

 

 

StatefulWidget의 특징 요약

• StatefulWidget은 상태가 변경될 수 있는 UI를 만드는데 사용됩니다.
• setState() 메서드를 호출하여 상태가 변경될 때마다 UI를 다시 빌드합니다.
• 위젯의 상태가 변경될 때마다 자동으로 UI를 업데이트할 수 있습니다.