expanded 용도:
Row나 Column등에서 핸드폰 화면에 맞게 균일하게 배치하기 위해서 사용합니다.
pixel기준으로 할 경우, 핸드폰 규격에 맞추기 어렵지만, expanded를 사용할 경우 핸드폰 규격에 맞추기 쉽습니다.
expanded 이론:
부모의 남은 범위를 flex의 비율에 맞춰서 모두 가져갑니다.
expanded가 없는 것이 우선적으로 넓이를 가지고, expanded가 남은 것들을 가져갑니다.
expanded 예시:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
child: Column(
children: [
Expanded( //Expanded 안에 child로 다른걸 넣는다.
child: Container(
color: Colors.red,
),
flex: 2, //총 flex 합에서 2만큼의 비율을 가져간다.
),
Text('hello'), //Expanded 범위에 포함되지 않음
Expanded(
child:Container(
color:Colors.green,
),
flex: 1, //총 flex 합에서 1만큼의 비율
),
],
),
|
cs |
'모바일 공부 > Flutter' 카테고리의 다른 글
DropdwonButton (0) | 2024.05.17 |
---|---|
future , async , await (0) | 2024.05.17 |
TextEditingController (0) | 2024.03.26 |
BottomSheet (0) | 2024.03.25 |
intl , (0) | 2024.03.23 |