Flexible

박스를 일정 비율로 나누고 싶을 때 Flexible사용, flex로 비율 조절

return MaterialApp(
  home: Scaffold(
    appBar: AppBar(
      title: Text('앱임')
    ),
    body: Row(
      children: [
        Flexible(child: Container(color: Colors.blue), flex: 3),
        Flexible(child: Container(color: Colors.amber), flex: 3,),
        Flexible(child: Container(color: Colors.green), flex: 3,),
      ],
    )
  )
);

---

Expanded

하나의 박스가 화면을 차지하게 하기 위해서는 Expanded사용
Expanded는 flex:1을 가진 Flexible 박스랑 같다

return MaterialApp(
  home: Scaffold(
    appBar: AppBar(
      title: Text('앱임')
    ),
    body: Row(
      children: [
        Expanded(child: Container(color: Colors.blue)),
        Container(width: 100, color: Colors.amber)
      ],
    )
  )
);

혼자서만 flex:1을 가지면 박스가 화면을 꽉 채우지만 위처럼 width가 지정된 박스가 있으면 그박스도 표시한다.

참조
yunulog