flutter의 wrap_content 및 match_parent에 해당합니까?

flutter의 wrap_content 및 match_parent에 해당합니까?

---

안드로이드 match_parent와 wrap_content위젯에 포함 된 내용에 자신의 부모를 자동으로 상대 위젯의 크기를 조정하는 데 사용됩니다.

Flutter에서는 기본적으로 모든 위젯이로 설정되어있는 것 같습니다.이 위젯 과 상위 위젯 wrap_content을 채울 수 있도록 어떻게 변경 합니까?widthheight

---

짧은 대답은 아이가 크기를 가질 때까지 부모는 크기가 없다는 것입니다.

Flutter에서 레이아웃이 작동하는 방식은 각 위젯이 각각의 자식에게 제약 조건을 제공한다는 것입니다. 최소 너비, 최대 너비, 최소 높이 및 최대 높이 가져 오기). 각 자식은 이러한 제약 조건을 취하고 어떤 작업을 수행하고 해당 제약 조건과 일치하는 크기 (너비 및 높이)를 선택합니다. 그런 다음 각 자식이 작업을 마치면 위젯은 자체 크기를 선택할 수 있습니다.

일부 위젯은 부모가 허용하는만큼 커지려고합니다. 일부 위젯은 부모가 허용하는만큼 작아야합니다. 일부 위젯은 특정 "자연"크기 (예 : 텍스트, 이미지)와 일치 시키려고합니다.

일부 위젯은 자녀에게 원하는 크기를 지정할 수 있다고 말합니다. 일부는 자녀에게 부모로부터받은 것과 동일한 제약 조건을 부여합니다.

---

주문 동작을 얻을에서 match_parent 및 wrap_content 우리가 사용할 필요가 mainAxisSize의 재산을 행 / 열 위젯의 mainAxisSize의 속성이 소요 MainAxisSize의 두 개의 값을 가지는 열거 MainAxisSize.min을 하는 것처럼 동작 wrap_content 와 MainAxisSize.max 로 동작 match_parent .

원본 기사 링크

---

당신은 작은 트릭으로 할 수 있습니다 : (폭, 높이)의 요구 사항이 있다고 가정하십시오.

Wrap_content, Wrap_content :

 //use this as child
 Wrap(
  children: <Widget>[*your_child*])

Match_parent, Match_parent :

 //use this as child
Container(
        height: double.infinity,
    width: double.infinity,child:*your_child*)

Match_parent, Wrap_content :

 //use this as child
Row(
  mainAxisSize: MainAxisSize.max,
  children: <Widget>[*your_child*],
);

Wrap_content, Match_parent :

 //use this as child
Column(
  mainAxisSize: MainAxisSize.max,
  children: <Widget>[your_child],
);

---

실제로 사용할 수있는 몇 가지 옵션이 있습니다.

You can use SizedBox.expand to make your widget match parents dimensions, or SizedBox(width: double.infinity) to match only the width or SizedBox(heigth: double.infinity) to match only the heigth.

If you want a wrap_content behavior it depends on the parent widget you are using, for example if you put a button on a column it will behave like wrap_content and to use it like match_parent you can wrap the button with a Expanded widget or a sizedbox.

With a ListView the button gets a match_parent behavior and to get a wrap_content behavior you can wrap it with a Flex widget like Row.

Using an Expanded widget makes a child of a Row, Column, or Flex expand to fill the available space in the main axis (e.g., horizontally for a Row or vertically for a Column). https://docs.flutter.io/flutter/widgets/Expanded-class.html

Using a Flexible widget gives a child of a Row, Column, or Flex the flexibility to expand to fill the available space in the main axis (e.g., horizontally for a Row or vertically for a Column), but, unlike Expanded, Flexible does not require the child to fill the available space. https://docs.flutter.io/flutter/widgets/Flexible-class.html

---

A simple workaround:

If a container has only one top level child, then you can specify alignment property for the child and give it any available value. it'll fill all the space in the container.

Container(color:Colors.white,height:200.0,width:200.0,
 child:Container(
    color: Colors.yellow,
    alignment:Alignment.[any_available_option] // make the yellow child match the parent size
   )
)

Another way:

Container(color:Colors.white,height:200.0,width:200.0,
 child:Container(
    color: Colors.yellow,
    constraints:  BoxConstraints.expand(height: 100.0), // height will be 100 dip and width will be match parent
   )
)

---

Stack(
  children: [
    Container(color:Colors.red, height:200.0, width:200.0),
    Positioned.fill(
      child: Container(color: Colors. yellow),
    )
  ]
),

---

Use this line of codes inside the Column. For wrap_content : mainAxisSize: MainAxisSize.min For match_parent : mainAxisSize: MainAxisSize.max

---

The simplest way to mach parent is wrapping the Widget into Center widget like this

child:
Center(child: Text('Bla Bla Bla'),

참조 URL : https://stackoverflow.com/questions/42257668/the-equivalent-of-wrap-content-and-match-parent-in-flutter