Flutter의 위젯(Widget)이란?
Flutter에서 위젯(Widget) 은 화면을 구성하는 모든 요소를 의미한다.
버튼, 텍스트, 이미지, 동영상 등 우리가 보는 모든 것이 위젯으로 이루어져 있다.
Flutter 앱을 개발할 때는 위젯을 쌓아 화면을 구성한다고 생각하면 된다.
평면처럼 보이지만, 사실은 위젯을 쌓은 것!
틱톡 같은 앱을 보면 단순한 평면 화면처럼 보이지만, 실제로는 여러 개의 위젯이 겹쳐 있는 구조다.
예를 들어, 틱톡 화면을 분석해 보면 다음과 같이 쌓여 있다.
- 하단 : 배경 위젯 → 빈 화면(앱의 기본 틀)
- 중간 : 영상 위젯 → 전체 화면을 차지하는 동영상
- 상단 : 아이콘 위젯 & 텍스트 위젯 → 좋아요, 댓글, 공유 버튼과 영상 설명 텍스트
이처럼 Flutter에서는 위젯을 레고 블록처럼 쌓아서 화면을 만들게 된다.
이 개념을 이해하면, Flutter UI를 쉽게 구성할 수 있다!
위젯을 쉽게 이해하는 방법
새로운 개념을 배울 때는 나만의 연상법을 만드는 것이 중요한 것 같다.
예를 들어, 식당에서 "몇 g이 몇 스푼인지", "몇 ml가 몇 컵인지"를 파악하면 저울 없이 밀가루 반죽을 할 수 있고, "물 몇 ml가 끓는데 걸리는 시간"을 알면 끓이는 동안 여유롭게 다른 일을 병행 할 수 있기 때문에 나만의 방법을 정하면 편하다.
Flutter의 위젯도 마찬가지!
"화면을 쌓는다" 라는 개념만 기억하면, 앞으로 앱 개발이 훨씬 쉬워질 것이라 생각한다.
'TIL(Today I Learned)' 카테고리의 다른 글
[TIL-006] Dart로 콘솔 쇼핑몰 만들기-1 (0) | 2025.03.10 |
---|---|
[TIL-005] Flutter 위젯 생명 주기(Widget Life Cycle) (0) | 2025.03.07 |
[TIL-004] 내가 Dart, Flutter 중에 무엇을 사용하고 있는 것일까? (0) | 2025.03.06 |
[TIL-003] Dart 실전 문법 파헤치기 - 'const 생성자' (1) | 2025.03.06 |
[TIL-001] Dart 기본 문법은 JS와 비슷했다 (1) | 2025.03.04 |