[FLUTTER] 기초 화면 구성

기초적인 Flutter 화면을 구성하는 패턴

1. 'package:flutter/material.dart' 임포트
2. MaterialApp으로 메인 위젯 트리 감싸기
3. title과 theme과 같은 속성 설정
4. home : 속성을 주 페이지로 정의
5. Scaffold:
   • 앱의 시각적 레이아웃에 대한 기본 구조 제공
   • appBar 및 body와 같은 속성 설정
     • 레이아웃 요소 제공 (예: AppBar, Drawer, BottomNavigationBar)
       • 각 구성요소는 또 다른 위젯으로 각각의 사용법은 이후에 정리하기로 함
     • body에 실제 화면 관련 위젯 정의
6. 'package:flutter/material.dart' 임포트
7. MaterialApp으로 메인 위젯 트리 감싸기
8. title과 theme과 같은 속성 설정
9. home : 속성을 주 페이지로 정의
10. Scaffold:
    • 앱의 시각적 레이아웃에 대한 기본 구조 제공
    • appBar 및 body와 같은 속성 설정
      • 레이아웃 요소 제공 (예: AppBar, Drawer, BottomNavigationBar)
        • 각 구성요소는 또 다른 위젯으로 각각의 사용법은 이후에 정리하기로 함
      • body에 실제 화면 관련 위젯 정의

 

MaterialApp의 주요 property와 사용법

• theme: 앱의 전체 테마, 색상 구성 등이 포함 (예, theme: ThemeData(primarySwatch: Colors.red))
• home: 앱이 시작할 때 보여질 기본 경로 또는 위젯

 

home: Scaffold(
  appBar: AppBar(title: const Text('FunCoding')),
),