본문 바로가기
Flutter

[Stateful Widgets] Stateless Widget, Stateful Widget, setState, BuildContext, Widget Lifecycle

by 2yy 2023. 3. 14.


[Stateless Widget]
- 변경되지 않을 데이터
- build 메서드를 통해 UI를 출력해줌

[Stateful Widget]
- 상태를 가지고 있음
- 상태에 따라 변하게 될 데이터
- 데이터가 변경될 때의 변화를 UI에 실시간으로 반영하여 확인
- 데이터는 단지 Dart 클래스 프로퍼티일 뿐
- State는 위젯의 데이터와 UI를 저장하고, 데이터가 변경되면 위젯의 UI도 변경됨
- Stateful Widget은 두 가지 특징이 있음 
 => 1. Widget이고 이 위젯들은 모두 상태를 가지고 있음, State는 데이터를 가지고 있는 부분이고,
         데이터는 단지 Dart 클래스 프로퍼티임
      2. State 클래스는 위젯의 UI도 가지고 있음, State의 데이터가 바뀔 때 위젯의 UI도 새로운 데이터로 변경

[setState] 
- State 클래스에게 데이터가 변경되었다고 알리는 함수
- setState를 호출하면 Flutter의 위젯에게 새로운 데이터가 있다고 알려주는 것, 
  따라서 Flutter는 bulid 메서드를 다시 실행함, setState는 기본적으로 build 메서드를 새로운 데이터와 함께
  다시 한번 실행하는 역할을 함

[BuildContext]
- 부모에 직접 접근하기 위해 BuildContext 사용
- context는 위젯 트리에 대한 정보가 담겨 있기 때문에,
  이전에 있는 모든 상위 요소들에 대한 정보를 알고 있음 (부모 요소들의 모든 정보를 담고 있음)
- Dart는 null safety 언어이기 때문에 상위 요소 정보를 가져올 때 ? 혹은 !(강제)를 이용함

[Widget Lifecycle]
- initState()는 상태를 초기화 하기 위한 메서드
 -> 부모 요소에 의존하는 데이터를 초기화해야 하는 경우에 사용, 
     initState는 항상 build 메서드보다 먼저 호출되어야 함,
     오직 단 한 번만 호출, 사용시에 super.initState(); 호출해야 함
- dispose()는 위젯이 스크린에서 제거될 때 호출되는 메서드(사라지고 있을 때)
 -> API 업데이트나 이벤트 리스너로부터 구독을 취소하거나, form의 리스너로부터 벗어나고 싶을 때 사용,
     위젯이 위젯 트리에서 제거되기 전에 무언가를 취소하고 싶을 때 사용, 위젯을 숨기거나 없애면
     위젯 트리에서 제거되므로 dispose 메서드가 실행됨
- StatefulWidget은 life cycle을 가짐 (initState, dispose, build ...)
-> build는 위젯에서 UI를 만들고, initState는 build 이전에 호출되는 메서드이고 여기서 변수를 초기화하고
    API 업데이트를 구독할 수 있게 함, 그 다음 build 메서드가 실행됨, 또 위젯이 위젯트리에서 사라질 때
    dispose 메서드가 실행되고 이벤트 리스너 같은 것들을 구독 취소함