[flutter] Row 위젯에서의 가중치 설정하기

Flutter에서 Row 위젯을 사용하여 여러 개의 자식 위젯을 가로로 배치할 수 있습니다. Row 위젯은 자식 위젯들 사이의 가로 공간을 분배하는 방법을 결정할 수 있습니다. 이 때, 가중치(Weight)를 설정하여 각 자식 위젯이 차지하는 공간의 비율을 조절할 수 있습니다.

가중치를 설정하기 위해서는 Expanded 위젯을 사용합니다. Expanded 위젯은 자식 위젯을 감싸고, 가중치를 설정하여 자식 위젯이 얼마만큼의 공간을 차지할지를 결정합니다. 가중치는 해당 자식 위젯의 flex 속성을 사용하여 결정합니다.

Row(
  children: [
    Expanded(
      flex: 1,
      child: Container(
        color: Colors.red,
        height: 100,
      ),
    ),
    Expanded(
      flex: 2,
      child: Container(
        color: Colors.blue,
        height: 100,
      ),
    ),
    Expanded(
      flex: 3,
      child: Container(
        color: Colors.green,
        height: 100,
      ),
    ),
  ],
)

위의 예제에서는 Row 위젯 안에 3개의 Container 위젯이 있습니다. 첫 번째 Containerflex 속성을 1로 설정하여 가중치를 1로 지정하였고, 두 번째 Container는 2, 세 번째 Container는 3으로 가중치를 지정하였습니다.

결과적으로 첫 번째 Container는 1/6의 가로 공간을 차지하고, 두 번째 Container는 2/6, 세 번째 Container는 3/6의 가로 공간을 차지하게 됩니다.

이와 같이 가중치를 설정하여 Row 위젯에서 자식 위젯들에게 원하는 비율의 공간을 할당할 수 있습니다.

더 자세한 사용법은 공식 문서를 참고하시기 바랍니다.