본문 바로가기
Flutter/Flutter FAQ

Flutter 플러터에서 열 너비 설정하기, Set column width in flutter

by 베타코드 2023. 6. 24.
반응형

질문


I need to set a Column width in flutter, I have to do a layout with 3 sections, one should be 20% of the screen, the other one 60% and the last one 20%.

I know that those 3 columns should be into a row, but I don't know a way to set the size, when I do that, the 3 columns take the same size.

I will appreciate any feedback.


답변


크기를 하드 코딩하는 대신 Flex를 사용하는 것을 제안합니다.

Row(
      children: <Widget>[
        Expanded(
          flex: 2, // 20%
          child: Container(color: Colors.red),
        ),
        Expanded(
          flex: 6, // 60%
          child: Container(color: Colors.green),
        ),
        Expanded(
          flex: 2, // 20%
          child: Container(color: Colors.blue),
        )
      ],
    )

아래와 같이 생성됩니다.

enter image description here

반응형

댓글