1. Container

Container : 그릇, 용기

아무것도 없는 위젯이다.

다양한 특성을 가지고 있기 때문에 사용하기에 따라 다양한 응용이 가능하다.

body: Container(
color: Colors.amber,
)

2. Column

수직방향으로 위젯들을 나란히 배치하는 위젯

레이아웃은 대부분 Column과 Row를 조합하여 만들기 때문에 자주 사용된다.

body: Column(          
      children: [
        Container(
              color: Colors.amber,
              width: 100,
              height: 100,
            ),
        Container(
              color: Colors.blueAccent,
              width: 100,
              height: 100,
            ),
        Container(
              color: Colors.greenAccent,
              width: 100,
              height: 100,
            ),
      ],
        )

3. Row

수직방향으로 위젯들을 나란히 배치하는 위젯

body: Row(
          children: [
            Container(
              color: Colors.amber,
              width: 100,
              height: 100,
            ),
            Container(
              color: Colors.blueAccent,
              width: 100,
              height: 100,
            ),
            Container(
              color: Colors.greenAccent,
              width: 100,
              height: 100,
            ),
          ],
        )

4. Stack

Children 에 나열한 여러 위젯을 순서대로 겹치게 하는 위젯이다.

body: Stack(
          children: [
            Container(
              color: Colors.amber,
              width: 120,
              height: 120,
            ),
            Container(
              color: Colors.blueAccent,
              width: 110,
              height: 110,
            ),
            Container(
              color: Colors.greenAccent,
              width: 100,
              height: 100,
            ),
          ],
        )

5. SingleChildScrollView

화면을 구성하다 보면 화면의 크기를 넘어서 스크롤이 필요한 경우가 있다.

SingleChildScrollView은 하나의 자식을 포함하는 스크롤이 가능한 위젯이다.