플러터 공식문서를 번역하여 정리한 글입니다.
위젯
목차
위젯
플러터는 모든 것이 위젯이다.
루트 위젯 밑으로 여러 위젯이 계층 구조로 이루어져있다.
UI의 변경사항이 생겼을 때 플러터 프레임워크는 변경전 위젯과 변경된 위젯을 비교하여
위젯 계층에서 해당 위젯을 새로운 위젯으로 업데이트한다.
리액트 네이티브가 OS에서 제공하는 UI를 사용하는 반면에
플러터는 OS와 관계없이 위젯을 플러터에서 직접 구성한다.
덕분에 OS에 대한 의존성을 줄이고
UI를 그리기위해 OS와 소통할 필요가 없어 빠르게 구현이 가능하다.
그리고 개발자가 임의로 위젯을 변경하기도 쉽다.
위젯 구성
플러터는 위젯을 하나의 기능을 하는 최소한의 단위로 쪼개서 구성한다.
이 최소 단위의 위젯을 조합하여
하나의 큰 기능을 담당하는 위젯을 구성해서 개발자들에게 제공하고있다.
예를 들면 Container 위젯은
LimitedBox, ConstrainedBox, Align, Padding, DecoratedBox, Transform 위젯으로 만들어져있다.
개발자는 각 위젯을 조합하여 새로운 위젯을 만들 수 있다.
위젯 Build
앞서 위젯은 모두 계층구조로 이루어져 있다고 했다.
build() 메서드는 위젯을 계층 구조를 렌더링 가능한 객체 트리로 반환한다.
렌더링 된 위젯의 상태가 변경된 경우 build() 메서드를 다시 호출하여
상태가 변경된 부분만 다시 그리는 것이 가능하다.
또한 build() 메서드는 상태변경보다
위젯이 어떻게 구성되어 있는지를 선언하는 것에 초점을 두고있다.
위젯 상태
플러터의 주요 위젯은 Stateless위젯과 Stateful위젯이다.
변하지 않는 위젯은 Stateless위젯을 상속하고
위젯의 상태가 변경되어야 하는 위젯은 Stateful위젯을 상속하여 구현해야 한다.
Stateful위젯은 setState()라는 메서드를 통해 build()메서드를 호출하여 위젯을 업데이트 한다.
Stateful위젯은 상태와 위젯객체가 분리되어 존재한다.
위젯이 build()를 통해 새로 생성되는 경우에
위젯이 가지고 있는 상태는 기존의 상태를 유지한다.
상태 관리
위젯이 가지는 상태는 어떻게 관리가 될까?
다른 클래스처럼 위젯은 생성자를 통해 데이터를 부모 위젯으로부터 받을 수 있다.
하지만 위젯 트리가 깊어질수록 상태정보를 서로 주고받기가 매우 불편해진다.
그래서 InheritedWidget을 사용하여 부모 위젯의 상태를 전달할 수 있다.
ExamWidget이나 GradeWidget이 StudentState를 필요로 할 때 아래와 같이 접근할 수 있다.
final studentState = StudentState.of(context);부모위젯의 상태를 참조하는 자식위젯이 새로 빌드되어야 하는 경우
InheritedWidget의 updateShouldNotify() 메서드를 사용할 수 있다.
플러터 프레임워크에서도 Theme이나 MediaQuery같은 상태를
Theme.of(context), MediaQuery.of(context)를 통해
MaterialApp 전역에서 사용 할 수 있다.
