강의 목표

• 플러터 프로젝트 생성 및 구조
• Emulator와 Simulator
• 프로젝트 메타데이터, 종속성 설정 파일
• 위젯이란?
• 위젯 생명주기
• 가장 많이 쓰는 위젯들
• 이미지추가하기
• 실습 : 첫번째 Flutter앱 만들기

복습

• compile
• build
• run
• debug build
• release build
• hot reload
• naming convention
  • 카멜케이스 :함수명, 변수명
  • 파스칼케이스 : 클래스명
  • 스네이크케이스: 프로젝트명, 파일명에 사용(my_app_project)

프로젝트 생성

• 도구

  • 플러터 CLI : flutter create project_name
  • 안드로이드 스튜디오
  • 비주얼 스튜디오

• 안드로이드 스튜디오

  • new flutter project
    
  • Project name : 프로젝트 이름 정하여 입력 (대문자는 사용 불가)
  • Project location : 해당 프로젝트를 어디에 저장할지 선택
  • Description : 프로젝트 요약 설명
  • Project type : 어떤 타입으로 만들것인지 선택
  • Organization : 소속 기관 url 입력, 앱스토어에 배포하기위해서는 다른 앱과 겹치면 안된다.
  • Android language : 안드로이드 개발 언어 선택
  • iOS language : iOS 개발 언어 선택
  • Platforms : 어느 플랫폼으로 개발을 진행할지 선택

• flutter pub

프로젝트 파일 구성

• pubspec.yaml
  • assets : 이미지파일 설정 (띄어쓰기에 주의)

위젯

• 플러터의 모든것이 위젯이다.
• ui를 구성하는 기본 단위
• 눈에 보이지않는 요소들도 있다(Padding, Center 위젯 등등)
• Stateless 위젯(상태 변화없는), Stateful 위젯(상태변화하는)
• 위젯 트리: 플러터는 위젯들을 트리형태로 관리
• 렌더 트리

Stateless 위젯

• 상태 변경이 불가능한 위젯
• 클래스 내부 변수는 모두 final 변수를 사용
• build()함수를 사용해서 위젯을 조합

Stateful 위젯

• 상태 변경이 가능한 위젯

위젯

• MaterialApp 위젯
  • 구글 Material Design사용할수 있다.
• Scaffold 위젯
  • MaterialApp 레이아웃 구조를 구현하는데 사용
  • AppBar
• Container
  • 감싸는 위젯
  • 다양한 프로퍼티를 가지고 있음
  • 가로/세로 길이, 색, padding, margin 등의 설정
  • child로 다른 위젯을 자식으로 가질수 있다.
• SizedBox
  • Container보다 가벼운, 단순 사이즈만 변경
• Column
  • 위젯을 수직 방향으로 나열
  • children으로 여러 개의 자식 위젯 리스트를 가진다.
• Row
  • 위젯을 수평 방향으로 나열
  • children으로 여러 개의 자식 위젯 리스트를 가진다.
• Stack
  • children으로 여러 개의 자식 위젯을 가지고, 나열한 여러 위젯을 순서대로 겹치게 한다.
  • 사진 위에 글자를 표현하거나, 화면 위로 로딩 표시를 하는 상황등에 사용가능
• Text
• Icon
• Padding
• 위젯만들어서 재사용함
  • 스테이스리스하나 더 만들어서 재사용하기!!!!!

출처
https://jinhan38.com/138
https://nomad-programmer.tistory.com/244
https://byounghonglim.tistory.com/128