본문 바로가기

Flutter-플러터/플러터로 첫 코딩!

플러터로 첫 코딩 하기! 12 - 화면 구성에 대해

반응형

목차

- 들어가기 

- 코딩과 개발언어 

- 왜 Flutter를 배워야 할까?

- 용어 정리 1편 (다트.객체지향언어)

- 용어 정리 2편 (변수.자료형)

- 용어 정리 3편 (함수)

- 용어 정리 4편 (조건문)

- 용어 정리 5편 (반복문)

- 용어 정리 6편 (플러터의 위젯)

- 잠시 쉬어가기편 - 플러터는 어떤 IDE가 좋을까? IDE의 미래?

- Flutter가 실행되는 구조 

- Flutter 화면 구성에 대해 

 

 

오늘은 Flutter 의 화면 구조에 대해 알아보겠습니다.

 

 

우리가 흔히 알고 있는 어플을 기억하신 다면

총 세 영역으로 나누어져 있다는 것을 알고 계실 것 입니니다. 

 

그 세 영역의 정확한 명칭은 아래와 같습니다. 

 

1.  appbar  : 제목 , 검색기능, 도움말등 보조적인 기능을 많이 넣습니다. 

 

 2. body  : 어플의 주요 화면입니다. 쇼핑몰 어플이라면 다양한 상품 사진이 노출될 것이고 ,

가계부 어플이라면 다양한 카테고리에 금액을 입력하는 공간이 될 것입니다. 

 

3. bottomNavigatorBar : 어플에는 다양한 페이지가 존재하며 그 페이지를 손 쉽게 이동 할 수 있게 도와주는 곳입니다. 

 

 

 

 

즉 다른 사람의 코드를 볼 때, 스스로 코드를 작성할 때
이 세 영역으로 나누어서 생각하면 쉽게 이해할 수 있습니다.

 

 

 

다음시간에는 appbar에 대해 알아보겠습니다. 

 

 

 

 

반응형