본문 바로가기
Flutter/Flutter FAQ

Flutter 컬럼의 나머지 공간을 위젯으로 채우는 방법, How to make a widget fill remaining space in a Column

by 베타코드 2023. 8. 14.
반응형

질문


Android에서는 다음과 같이 할 수 있습니다. TextView의 크기에 따라 ImageView가 가능한 한 많은 공간을 차지하도록 설정할 수 있습니다.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_weight="1"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>
</LinearLayout>

Flutter에서는 어떻게 이를 구현할 수 있을까요? Datetime(녹색)이 가능한 한 많은 공간을 차지하도록 설정해야 한다고 가정합니다.

new Column(
    children: <Widget>[
        new Text('Title',
            style: new TextStyle(fontWeight: FontWeight.bold)
        ),
        new Text('Datetime',
            style: new TextStyle(color: Colors.grey)
        ),
    ],
)

enter image description here


답변


100% 확실하지는 않지만 아마도 이 말씀하시는 건 이거겠지요. Expanded 위젯은 사용 가능한 공간까지 확장됩니다. 그런데 Row나 Column에서는 조금 다르게 동작한다고 생각합니다.

new Column(
children: <Widget>[
    new Text('제목',
        style: new TextStyle(fontWeight: FontWeight.bold)
    ),
    new Expanded(
        child: new Text('날짜시간',
             style: new TextStyle(color: Colors.grey)
        ),
    ),
],
)
반응형

댓글