Baseline
Flutter에서 위젯의 수직적 위치는 상단이 시작하는 위치와 높이의 함수가 된다. 상단이 시작되는 첫 부분이 우리가 원하는 부분이다.
그런데 만약 알고 있는 위치에 맞춰 하단을 조정해야 하는 사이즈 박스 내에 텍스트가 있다면 어떻게 될까? 텍스트의 크기는 플랫폼과 기기를 망라하고 예측하기 어렵기 때문에 이러한 결과를 위해 텍스트 상단을 배치해야 할 지점을 쉽게 알기 어렵다. 하지만 하단의 배치 지점을 알고 있으니 바로 그곳이 기준선이 위치하는 곳이다. 기준선의 위젯을 행갈이 하고 baseline Type를 alphabetic에 설정하고 기준선 파라미터에 오프셋을 제공한다.
기준선이 값이 Flutter에 텍스트를 위치할 곳을 알려주어 하단은 부모의 상단아래에서 많은 양의 픽셀을 갖는다. 하지만 위젯의 높이가 100픽셀인데 기준선이 50으로 설정되어 있다면 기준을 이탈하게 되어 위젯은 다른곳을 침범하게 된다.
baseline(
baseline: 100,
baselineType: TextBaseline.alphabetic,
child: MyText(),
)따라서 baseline은 위젯들이 배치될 오프셋을 제공하는 위젯이다.
properties
- baseline(double)
- 자식들이 위에 부터 몇 픽셀만큼 아래에 배치될지 정하는 값 - baselineType(TextBaseline)
- 자식의 위치를 정하는데 사용되는 baseline의 타입 - child(Widget?)
- 이 위젯의 자식들
Center
자신의 자식들을 자신의 가운데에 배치한다.
Constructors
Center({key? key, double? widthFactor, double? heightFactor, Widget? child})
Properties
alignment(AlignmentGeometry)
어떻게 자식위젯들을 배치할 것인가?
child(Widget?)
자식 위젯들
heightFactor(double?)
null이 아니라면 자식위젯들의 높이의 배가 된다.
widthFactor(double?)
null이 아니라면 자식위젯들의 너비의 배가 된다.
ConstrainedBox
자식 위젯들에게 제약을 추가하는 위젯
예를 들어 자식들에게 minimum height를 50.0으로 정하고 싶다면
BoxConstraints(minHeight: 50.0)으로 제약을 추가할 수 있다.
Flutter의 위젯 크기 설정 기능이 위치와 부모에 최적화되어 있다곤 하지만 우리의 디자인에 딱 맞게 넓이와 높이를 조정하고 싶을 때가 있다.
ConstraintBox 위젯으로 간단하게 해결할 수 있다.
ConstraintedBox를 통해 넓이와 높이의 최대 및 최솟값을 설정 할 수 있다.
예를 들면, ConstrainedBox를 사용해 텍스트 위젯 넓이의 최댓값을 여러 줄에 적용되게 할 수 있다. 또한 높이의 최솟값을 설정해 버튼의 높이를 키울수도 있다.
Constructors
ConstrainedBox({key? key, required BoxConstraints, Widget? child})
properties
- child(Widget?)
- 자식 위젯들 - constraints(BoxConstraints)
- 자식 위젯에 적용할 추가 제약
BoxConstraints
Constructors
- BoxConstraints({double minWidth = 0.0, double maxWidth = double.infinity, double minHeight = 0.0, double maxHeight = double.infinity})
생성자가 더 있지만 나중에 찾아보도록 하자
Properties
- biggest(size)
- 제약을 만족하는 가장 큰 사이즈 - filpped(BoxConstraints)
- 가로 세로의 제약조건이 뒤바뀐 박스 - hasBoundedHeight(bool)
- 최대 높이에 상한선이 있는지 - hasBoundedWidth(bool)
- 최대 너비에 상한선이 있는지 - hasInfiniteWidth(bool)
- 너비제한이 무한인지 - hasTightHeight(bool)
- 제약조건을 만족하는 높이값이 하나인지 - hasTightWidth(bool)
- 제약조건을 만족하는 너비값이 하나인지 - isNormalized(bool)
- 객체의 제약이 정규화 되었는지 리턴한다.- 최소값이 해당 최대값보다 작거나 같으면 제약 조건이 정규화된다
- isTight(bool)
- 하나의 사이즈로 제약을 만족하는지 - maxHeight(double)
- 최대 높이 - maxWidth(double)
- 최대 넓이 - smallest(size)
- 제약을 만족하는 가장 작은 사이즈
