본문 바로가기

플러터3

[Flutter] 3. Wrap 3. Wrap class 수평 또는 수직으로 여러개의 자식들이 실행되는 것을 표시하는 위젯. Wrap은 각각의 자식을 배치하고 main축에서 direction이 주어지고 사이에 공간이 생긴 이전의 자식을 그 자식에 맞게 위치한다. 만약 충분한 공간이 없다면, Wrap 은 cross축 존재하는 children에 맞게 새로 실행한다. 모든 자식이 할당된 후, 실행된 자식들은 메인축에 따라 위치한다. runSpacing과 runAlignment에 따라 교차 축에 배치된다. Wrap 클래스는 디바이스를 벗어났을때, 줄내림을 해줄때 사용한다. 자동으로 내려감. Ex) 댓글, 글이 길때, 줄내림을 할때 사용. Wrap( children: [ SizedBox( width: 200, child: FlatButton( .. 2020. 6. 22.
[Flutter] 2. Expanded https://flutter.dev/docs/codelabs/layout-basics#expanded-widget flexible 과 비슷하게, Expanded 위젯은 위젯을 감쌀 수 있고, 여분의 공간에 강제로 채워넣을 수 있다. 💡Tip : Flexible 과 Expanded 위젯의 차이점은 무엇일까? Flexible 은 Row 나 Column 위젯에서 특정 위젯을 resize하기 위해 사용한다. 이렇게하면 부모 위젯과 관련하여 크기를 유지하면서 자식 위젯의 간격을 조정할 수 있다. Expanded 위젯은 자식 위젯의 제약을 변경하고 다른 여백의 공간을 채운다. 남아있는 공간을 알아서 채워줌. css에서의 flex 를 먹일수도있음. class FirstWeek extends StatelessWidge.. 2020. 6. 15.
[Flutter] 1. SafeArea https://api.flutter.dev/flutter/widgets/SafeArea-class.html 위젯은 각 OS에 따라 침범을 피하기 위한 충분한 패팅에 의한 위젯의 child를 넣는다. 예를들면, 이렇게하면 화면 상단의 statusbar를 피할 수있을만큼 child가 들여 쓰기된다. 또한 이것은 iphoneX의 노치바나, 다른 디스플레이의 물리적인 기능을 피하는데 필요한만큼 child를 들여쓰기 한다. 최소한 padding이 명시되었을때, 더 나은 최소한의 padding이나 safe area padding이 적용될 것이다. Widget의 가장 최상단에 SafeArea 로 덮는다. Inheritance Object > DiagnositicableTree > Widget > StatelessWi.. 2020. 6. 14.