쉬운 플러터 2강 : 가로세로 배치하는 법과 Scaffold

저번 시간에는 사진/글/아이콘/박스 위젯을 배웠습니다. 

그리고 위젯안에 위젯넣기가 가능합니다.   이번 시간에는 레이아웃을 알아보겠습니다. 

 

MaterialApp() 위젯은 구글이 제공하는 구글스타일 Material 테마도 사용할 수 있습니다. 

MaterialApp안에 Scaffold 위젯도 사용할 수 있습니다.  scaffold 는 상중하로 나눠주는 역할도 합니다. 

 

return MaterialApp(
  home: Scaffold(
      appBar: AppBar(),  // 상단에 들어갈 위젯
      body: Container(),  // 중단에 들어갈 위젯
     bottomNavigationBar: BottomAppBar(),  // 하단에 들어갈 위젯
  )
);

 

여러개의 위젯을 가로로 배치하고 싶을 때는 Row( children: [] ) 위젯을 사용합니다. 

여러개의 위젯을 세로로 배치하고 싶을 때는 Column( children: [] ) 위젯을 사용합니다. 

Row, Column 요소들 정렬하려면  mainAxisAlignment : MainAxisAlignment.center 를 사용하면 됩니다. 

세로축 정렬은 crossAxisAlignment를 사용합니다.  

 

 

 

Reference

https://www.youtube.com/watch?v=U6rLIFn59Kw&list=PLfLgtT94nNq1izG4R2WDN517iPX4WXH3C&index=3