[Flutter] 플러터 Stateful Widget Lifecycle(생명주기)란??

플러터가 StatefulWidget을 만들 때, State객체를 만든다. 이 개체는 해당 위젯의 모든 가변 상태가 유지 되는 곳이다.

state의 개념은 두 가지로 정의 된다:

1. 위젯이 사용하는 데이터는 변경 될  수 있다.
2. 위젯이 빌드 될때 데이터를 동시에(synchronously) 읽을 수 없다. (모든 state는 build 메서드가 호출 될때 까지 설정 되어야 한다.)

• Stateless : 상태가 없고 변화가 없는 위젯
• Stateful : 상태가 있고 액션의 변화가 있는 위젯

 

라이프 싸이클은 아래와 같은 단계를 구성한다.

• createState()
• mounted == true
• initState()
• didChangeDependencies()
• build()
• didUpdateWidget()
• setState()
• deactivate()
• dispose()
• mounted == false

라이플 사이클(로직)의 구조

1. createState()

이 메서드는 새로운 Stateful 위젯을 만들 때 호출되며 필수 메서드입니다. 연결된 State의 인스턴스를 반환한다.

class Home extends StatefulWidget {
  @override
  HomeState<StatefulWidget> createState() => Home();
}

2. initState()

위젯이 생성될때 처음으로 호출되는 메서드 이다. initState는 오직 한번 만 호출 된다. 또한 반드시 super.initState()를 호출해야 한다.

initState에서 실행되면 좋은 것들

1. 생성된 위젯 인스턴스의 BuildContext에 의존적인 것들의 데이터 초기화
2. 동일 위젯트리내에 부모위젯에 의존하는 속성 초기화
3. Stream 구독, 알림변경, 또는 위젯의 데이터를 변경할 수 있는 다른 객체 핸들링.

@override
void initState(){
  super.initState();
}

3. didChangeDependencies()

didChangeDependencies 메서드는 위젯이 최초 생성될때 initState 다음에 바로 호출 된다.
또한 위젯이 의존하는 데이터의 객체가 호출될때마다 호출된다. 예를 들면 업데이트되는 위젯을 상속한 경우.
공식문서 또한 상속한 위젯이 업데이트 될때 네트워크 호출(또는 다른 비용이 큰 액션 , API호출 이 필요한 경우 유용하다고 함

@override
void didChangeDependencies() { 
 
}

4. build()

이 메서드는 자주 호출된다(fps + render로 생각하세요.). 필수이며 재정의 대상(@override)이고 반드시 Widget을 리턴해야 한다.

Padding, Center 조차도 child 또는 children을 가진 위젯이며 화면에 모든 UI 위젯으 랜더링 할 때 마다 호출한다.

@override
Widget build(BuildContext context) {
 //add your widgets
}

5. didUpdateWidget(Widget oldWidget)

didUpdateWidget()는 부모 위젯이 변경되어 이 위젯을 재 구성해야 하는 경우(다은 데이터를 제공 해야하기 때문)

이것은 플러터가 오래동안 유지 되는 state를 다시 사용하기 때문이다. 이 경우 initState()에서 처럼 읿부 데이터를 다시 초기화 해야 한다.

build() 메서드가 Stream이나 변경 가능한 데이터에 의존적인경우 이전 객체에서 구독을 취소하고 didUpdateWidget()에서 새로운 인스턴스에 다시 구독 해야함.

tip: 이 메서드는 기본적으로 위젯의 상태와 관련된 위젯을 재 구성해야 하는 경우 initState()을 대치한다.

플러터는 항상 이 메서드 수행 후에 build()메서드 호출 하므로, setState() 이후 모든 추가 호출은 불필요 하다.

@protected
void didUpdateWidget(Home oldWidget) {
  super.didUpdateWidget(oldWidget);
}

6 setState()

setState() 메서드는 플러터 프레임워크 자체적, 또는 개발자로 부터 자주 호출된다.
'데이터가 변경되었음’을 프레임워크에 알리는데 사용되며 build context의 위젯을 다시 빌드하게 한다.
setState()는 비동기적이 않은 callback을 사용한다.(역자주: callback으로 비동기를 사용할 수 없다는 말임).

setState(() {
 
});

7. mounted is true

createState가 state클래스를 생성하면 buildContext는 state에 할당 된다.
BuildContext는 위젯이 배치된 위젯 트리의 위치를 단순화 한 것이다.

모든 위젯은 bool형식의 this.mounted 속성을 가지고 있다. buildContext가 할당되면 true를 리턴한다. 위젯이 unmounted상태일때 setState를 호출하면 error가 발생

8. deactivate()

이 메서드는 거의 사용되지 않는다.
deactivate()는 tree에서 State가 제거 될때 호출 된다. 그러나 현재 프레임 변경이 완료되기 전에 다시 삽입 될 수 있다. 이 메서드는 State객체가 tree의 한 지점에서 다른 지점으로 이동 할 수 있기 때문에 기본적으로 존재한다.
필요에 따라 자주 호출 할 수 있는 이유는 다시 그리(repainting)는데 소용되는 비용이 저렴하기 때문)

9. dispose()

dispost()는 State객체가 영구히 제거 된다.

@override
void dispose(){
   super.dispose();
}

10. mounted is false

이 상태에서 state 객체는 결코 다시 mount되지 않으며, setState()가 호출되면 에러가 발생한다.

 

 

플러터 라이프사이클의 단계는 많지만 실제 코드에서 볼 수 있는 메소드는

createState() 

initState()

build()

dispose()

이정도 되는 것 같다.

 

본문의 참고

https://jaceshim.github.io/2019/01/28/flutter-study-stateful-widget-lifecycle/

https://velog.io/@ieed0205/Flutter-1.-Lifecycle%EC%83%9D%EB%AA%85%EC%A3%BC%EA%B8%B0