flutter 기초_Expanded 위젯

Expanded : Row, Column 내에서 자식 위젯이 남아있는 공간을 동적으로 차지하도록 하는 데 사용되는 위젯. 부모 위젯이 Row 또는 Column이고, 자식 위젯들 간의 가변 크기 비율을 설정하려는 경우 매우 유용

 

주요 특징

1. 남은 공간을 채움: Expanded는 부모의 남아있는 공간을 모두 차지합니다.
   • Row에서는 가로 방향.
   • Column에서는 세로 방향.
2. Flex 비율 설정 가능:
   • flex 속성을 사용하여 다른 Expanded 위젯들 간의 공간 비율을 조정할 수 있습니다.
   • 기본값은 flex: 1이며, 비율에 따라 공간을 나눕니다.
3. 오버플로 방지:
   • 공간이 부족하면 위젯은 축소되며 화면에 맞게 조정됩니다.

Row(
  children: [
    Expanded(
      flex: 1, // 공간의 1 비율 차지
      child: Container(color: Colors.red),
    ),
    Expanded(
      flex: 2, // 공간의 2 비율 차지
      child: Container(color: Colors.blue),
    ),
  ],
)