나만의 Flutter 위젯 분류

 

목차

위젯들을 이해하고 활용하는 것이 Flutter 개발의 핵심!!.

0. 위젯의 종류

Flutter는 풍부한 UI 위젯을 제공한다. 자세한 내용은 공식 문서에서 확인할 수 있다.

위젯들을 이해하기 쉽게 직접 나누어 보자

1. 플랫폼별 위젯

• Material (Android) 위젯
  • Google의 Material Design 가이드라인을 따르는 위젯들이다.
• Cupertino (iOS) 위젯
  • Apple의 Human Interface Guidelines를 기반으로 한 iOS 스타일 위젯들이다.

대부분의 경우 Material 위젯을 사용하지만, 플랫폼별 특성을 살리고 싶다면 각각의 위젯을 적절히 활용할 수 있다.

2. 기본 위젯 (Basic Widgets)

• Text: 다양한 스타일의 텍스트를 표현한다.
• Row와 Column: CSS의 flexbox와 유사한 방식으로 수평, 수직 레이아웃을 구성한다.
• Stack: 위젯들을 겹쳐 배치할 수 있으며, Positioned 위젯과 함께 사용하여 정교한 위치 조정이 가능하다.
• Container: 다재다능한 박스 위젯으로, 배경, 테두리, 그림자 등 다양한 스타일링이 가능하다.

이러한 위젯들을 조합하고 커스터마이징하여 원하는 UI를 구현할 수 있다. Flutter의 강력함은 이 위젯들의 유연성과 확장성에 있다.

3. 상태 관리에 따른 위젯 분류

Flutter에서는 상태 관리 방식에 따라 위젯을 두 가지로 분류한다:

• Stateless Widget: 내부 상태가 없는 정적 위젯으로, 한 번 렌더링된 후 변경되지 않는다.
• Stateful Widget: 동적 상태를 가진 위젯으로, 사용자 상호작용이나 이벤트에 따라 UI가 변경될 수 있다.

성능 최적화를 위해서는 가능한 Stateless Widget을 사용하는 것이 좋다. Stateless Widget은 빌드 시 한 번만 생성되지만, Stateful Widget은 상태 변경 시마다 재빌드되기 때문이다.

목차로 돌아가기