Coaspe

Flutter - AnimatedBuilder 본문

Flutter/API

Flutter - AnimatedBuilder

Coaspe 2023. 2. 17. 13:56

애니매이션을 만들기 위한 위젯입니다. Animated되는 요소와 Animated 되지 않는 요소들이 위젯 트리에 포함되어 있을 때 사용합니다. Animation의 값이 바뀔 때 마다 builder 함수가 호출됩니다.

 

더 큰 빌드 함수에 애니메이션을 부분으로 추가하려는 복잡한 위젯에 AnimatedBuilder은 유용합니다. AnimatedBuilder를 사용하려면, 위젯을 만들고 builder 함수로 넘기세요.

 

추가적인 state가 없는 간단한 위젯을 만드는 경우에는, AnimatedWidget을 사용하세요.

 

 

성능 최적화

만약 builder 함수가 애니메이션과 관련이 없는 서브트리를 포함하고 있다면, 애니매이션 틱 마다 해당 서브트리를 리빌딩하는 것이 아닌, 한 번만 빌드하는 것이 더 효과적입니다.

 

만약 child 파라미터로 pre-built 서브트리를 넘기면, AnimatedBuilder 가 이것을 builder 함수로 다시 보내서 통합시킵니다. 

 

이런 pre-built child를 사용하는 것은 전적으로 선택이지만, 몇몇의 경우에서 성능을 매우 향상시킬 수 있고 좋은 습관입니다.

 

한마디로 정리하면, Animation과 연관된 요소는 builder로 넘겨서 animation value가 바뀔 때 마다 rebuild 되게 하고, 연관되지 않는 요소는 child로 넘겨서 불필요한 rebuild를 감소시킨다는 말이다.

 

AnimatedBuilder를 사용하여 rebuild 성능을 항상시키기

AnimatedBuilder 이라는 이름에도 불구하고,  AnimatedBuilderAnimations에만 국한되지 않습니다. ChangeNotifierValueNotifier 같은 Listenable의 서브 타입은 Listenable이 리스너에게 변화를 알렸을 때, 위젯의 특정 부분만을 rebuild하기 위해 AnimatedBuilder와 함께 사용할 수 있습니다. 이 테크닉은 다른 부분들은 건들지 않고, 특정 위젯만 rebuild 하는 성능향상을 이룹니다.

 

 

See also:

 

상속 구조

 

생성자

AnimatedBuilder({

Key? key, 

required Listenable animation, 

required TransitionBuilder builder, 

Widget? child

})

'Flutter > API' 카테고리의 다른 글

Flutter - SlideTransition  (0) 2023.02.17
Flutter - FloatingActionButton  (0) 2023.02.17
Flutter - AnimationController  (0) 2023.02.17
Flutter - PageRouteBuilder<T>  (0) 2023.02.17
Flutter - AnimatedContainer  (0) 2023.02.17
Comments