본문 바로가기
공부방/Flutter

[Flutter] StatefulWidget위젯(함수)

by SmartCow 2024. 3. 20.
목차

1. StatefulWidget의 개요
 1) StatefulWidget이란?
 2) StatelessWidget과의 차이점
 3) StatefulWidget의 구성 요소

2. StatefulWidget의 동작 원리
 1) State 객체와 관계
 2) 생명 주기 메서드
 3) setState() 메서드의 역할

3. StatefulWidget의 활용
 1) 사용 사례
 2) 고급 기능 추가하기

4. StatefulWidget의 주의 사항
 1) 성능 고려 사항
 2) 상태 관리 패턴

5. Flutter와 다른 상태 관리 방법 비교
 1) Provider 패키지
 2) Bloc 패턴
 3) Riverpod 패키지

1. StatefulWidget의 개요

1) StatefulWidget이란?

  • Flutter에서 사용되는 위젯 중 하나로, 상태가 변경될 수 있는 위젯을 생성.
  • 사용자 인터랙션 또는 데이터 변경 등으로 인해 UI를 업데이트해야 할 때 유용하게 활용.

2) StatelessWidget과의 차이점

  • StatelessWidget은 불변(immutable)한 위젯이며, 한 번 그려진 후에는 변경할 수 없다.
  • StatefulWidget은 상태를 가지고 있어서 상태가 변경될 때마다 다시 그려지게 된다.

3) StatefulWidget의 구성 요소

  • StatefulWidget은 두 가지 주요 구성 요소로 이루어진다:
  • StatefulWidget: UI를 생성하는 부분.
  • State: 위젯의 상태를 관리하는 부분.


2. StatefulWidget의 동작 원리

1) State 객체와 관계

  • StatefulWidget은 불변하고 상태가 변하는 State 객체를 가지고 있다.
  • State 객체는 StatefulWidget의 생명 주기와 동일한 생명 주기를 가지고 있다.

2) 생명 주기 메서드

  • createState(): StatefulWidget의 상태를 생성한다.
  • initState(): State 객체가 처음으로 생성될 때 호출된다.
  • didChangeDependencies(): State 객체의 종속성이 변경될 때 호출된다.
  • build(): UI를 생성.
  • setState(): 상태가 변경되었음을 Flutter에 알린다.
  • deactivate(), dispose(): State 객체가 제거될 때 호출.

3) setState() 메서드의 역할

  • setState() 메서드를 호출하면 Flutter에게 상태가 변경되었음을 알린다.
  • 이 메서드는 build() 메서드를 호출하여 UI를 다시 그리게 한다.


3. StatefulWidget의 활용

1) 사용 사례

  • 사용자 입력에 따라 UI 업데이트.
  • 네트워크 호출 결과에 따른 UI 변경.
  • 애니메이션 구현 등.

2) 고급 기능 추가하기

  • 키보드 포커스 관리, 애니메이션 효과 추가 등의 고급 기능을 학습할 수 있다.


4. StatefulWidget의 주의 사항

1) 성능 고려 사항

  • 상태가 변경될 때마다 UI가 다시 그려지기 때문에 성능에 영향을 줄 수 있다.
  • 불필요한 setState() 호출을 피하고, 상태 관리 패턴을 잘 활용하여 성능을 최적화해야 한다.

2) 상태 관리 패턴

  • Provider, Bloc 패턴, Riverpod 등의 상태 관리 패턴을 사용하여 복잡한 애플리케이션에서 상태를 효과적으로 관리할 수 있다.


5. Flutter와 다른 상태 관리 방법 비교

1) Provider 패키지

  • InheritedWidget을 기반으로 한 상태 관리 패키지로, Flutter 팀에서 권장하는 방법 중 하나.

2) Bloc 패턴

  • 비즈니스 로직과 UI를 분리하기 위해 사용되는 패턴으로, 복잡한 애플리케이션에서 유용하다.

3) Riverpod 패키지

  • Provider 패키지의 개선된 버전으로, 더 많은 기능과 편의성을 제공한다.
  • 이러한 패턴들을 고려하여 애플리케이션의 요구 사항에 맞는 상태 관리 방법을 선택할 수 있다.

'공부방 > Flutter' 카테고리의 다른 글

[Flutter] Flexible위젯(함수)  (0) 2024.03.26
[Flutter] ThemeData위젯(함수)  (0) 2024.03.24
[Flutter] Container위젯(함수)  (0) 2024.03.17
[Flutter] BoxDecoration()위젯(함수)  (0) 2024.03.13
[Flutter] Padding()위젯(함수)  (0) 2024.03.10