** Guide for views
$$ Widget Tree (Flutter App Structure)
$ Reference
- https://velog.io/@rokwon_k/Flutter%EC%97%90%EC%84%9C-%EC%95%B1-%EA%B5%AC%EC%A1%B0
$ [0Level] CustomApp
- 보통 처음시작할때 MyApp이라고 부릅니다.
전체 앱을 감싸는 껍데기 이며 이 클래스에서 MaterialApp(안드로이드 디자인)이나 CupertinoApp(iOS 디자인)를 리턴해줍니다.
- Simon >>> AppMain
$ [1Level] MaterialApp, CupertinoApp
- Flutter에서 지원해주는 두 개의 디자인(안드로이드, iOS) 중 어느 디자인 뼈대를 사용할지 지정합니다.
이 두가지 위젯은 Flutter SDK에서 지원해며 이름을 커스텀할 수 없습니다.
위의 CustomApp이 이름이 있는 껍데기라면 이 레벨의 두 위젯은 Flutter 앱에서 UI를 그릴 수 있도록 지원합니다.
이 두가지 위젯안에서 Flutter SDK에서 제공하는 위젯들을 전부 사용가능합니다.
- Simon >>> ~Frame
$ [2Level] Custom PageApp
- 어플 내에서도 웹처럼 화면에 보이는 하나하나의 페이지가 존재합니다.
0Level과 1Level에서 이름 및 환경을 제공해 줬으니 이제부턴 그런 환경을 이용해 UI를 그려야겠죠?
각 페이지의 이름을 정의해 주며 이 class에서 Scaffold를 리턴해줍니다.
한 페이지 내에서의 환경과 이름을 정하는 역할을 한다고 할 수 있겠습니다.(모듈화)
$ [3Level] - Scaffold
- 한 페이지 내에서 필요한 많은 UI를 내포하고 있습니다.
가령 (iOS 기준으로) 최상단에 위치하는 네비게이션 바, 본문, 하단의 탭바 등 이 Scaffold 위젯에서 쉽게 구현할 수 있도록 제공해줍니다.
즉, 페이지의 기본적인 디자인 뼈대를 제공해주는 위젯입니다.
기본적으로 우리가 페이지를 만들때 많이 사용하는 뷰들을 Flutter는 Scaffold라는 위젯으로 뼈대를 만들어서 제공해주고 있습니다.
- Simon >>> ~Page
$ [4Level] ~
- Scaffold 내에서 위젯들을 부모 자식 관계로 엮어가며 UI를 만들어 갈 수 있습니다.
뷰, 버튼, 슬라이드 등 유저에게 보여지는 UI를 그려 넣습니다.
- Simon >>> ~Widget
각각의 모듈단위
예) 검색Widget:검색Text, 검색버튼
로그인Widget:UID,PWD,버튼
