❮
flutter 어이없는 점들 (계속 추가 예정)
20210518
flutter의 직관적이지 않은 부분들 정리
1. 스택의 base widget은 부모 위젯이 아니라 스택 children의 첫 번째 위젯이다.
Stack
Use Stack to arrange widgets on top of a base widget—often an image. The widgets can completely or partially overlap the base widget.
Summary (Stack)
Use for widgets that overlap another widget
The first widget in the list of children is the base widget; subsequent children are overlaid on top of that base widget
A Stack’s content can’t scroll
You can choose to clip children that exceed the render box
2. Container
MaterialApp 바로 아래에 다음 위젯이 있는 경우.
class ConPitfall extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
width: 100.0,
height: 100.0,
color: Colors.red,
);
}
constraint가 없기 때문에 전체 화면을 채우게 된다.
3. Container 2
class ConPitfall2 extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.lightBlue,
body: GestureDetector(
onTap: () {
debugPrint('click');
},
child: Container(
width: double.infinity,
height: double.infinity,
child: Center(
child: Text('inner text'),
),
),
),
);
}
}
Container에 double.infinity 로 잡혀있지만 GestureDetector의 onTap이 적용되는 부분은 가운데 텍스트 영역 뿐이다.
3-2. Padding
class PadPitfall extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.lightBlue,
body: GestureDetector(
onTap: () {
debugPrint('click');
},
child: Padding(
padding: const EdgeInsets.all(100.0),
child: Center(
child: Text('inner text'),
),
),
),
);
}
}
Padding 영역을 클릭해도 onTap 인식이 안됨