瞭解Flutter Widget前，你須要先理解這些前置知識

初學flutter基礎widget時，如Container Widget,查閱官方文檔時，常常會碰到

to size itself to the child, to honor the width, height, and constraints, to expand to fit the parent, to be as small as possible.

咱們有必要了解：

• 什麼是Constraints(約束)?
• Flutter中有幾種Constraints子類?
• Constraints與Widget Size 的關聯？
• BoxConstraints的類型？
• BoxConstraints的做用？

什麼是Constraints(約束)？

An abstract set of layout constraints.

Concrete layout models (such as box) will create concrete subclasses to communicate layout constraints between parents and children.

Constraints是抽象佈局約束類，

具體的佈局模型須要建立對應的Constraints子類，用來傳遞父Widget與子Widget之間的佈局約束；

Flutter中有幾種Constraints子類?

經過查看flutter代碼，目前Flutter中有兩個Constraints子類，（ 之後估計會有更多子類）BoxConstraints和SliverConstraints,根據Constraints的說明，BoxConstraints是專爲Box佈局模型建立的，SilverConstraints是專爲Silver佈局模型建立的， 咱們只需知道，前者用於顯示在2D（笛卡爾座標系中的）對象，後者用於顯示對滾動作出反應的對象，具體這兩種佈局模型的區別，後續文章再述；咱們先看下BoxConstraints：

BoxConstraints有maxWidth,minWidth,maxHeight,minHeight四個成員變量，且BoxConstraints須要知足：

• 0.0 <= minWidth <= maxWidth <= double.infinity
• 0.0 <= minHeight <= maxHeight <= double.infinity

double.infinity在此處表示無窮大；

Constraints與Widget Size 的關聯？

Widget結點的大小（size：由指定的width和height組成）會遵循父結點傳遞給它的約束（Constraints），可是要求其知足如下條件：

• minWidth <= Size.width <= maxWidth
• minHeight <= Size.height <= maxHeight

BoxConstraints的類型？

• tight constraints(緊密約束):
  指的是這些約束嚴格地限定了渲染對象確認大小（Size）時的可選餘地（當constraints的minWidth等於maxWidth時，這種狀況下，咱們稱這個約束有緊密寬度）,例如MaterialApp Widget（flutter 提供的應用框架），會被傳遞緊密約束以直充滿整個手機屏幕（根據不一樣的手機屏幕，會有不一樣的具體值）；
• loosen constraints(寬鬆約束)：
  與緊密約束相比，寬鬆約束只會限定maxWidth或者maxHeight的值，minWidth或者minHeight的值爲0;
• bounded constraints(有邊界約束):
  constraints中的maxWidth或者maxHeight小於double.infinity
  bool get hasBoundedWidth => maxWidth < double.infinity;
  
  
  bool get hasBoundedHeight => maxHeight < double.infinity;
  
• unbounded constraints(無邊界約束)：
  constraints中的maxWidth或者maxHeight的值爲double.infinity
• expending constraints(擴展約束)：
  constraints中的maxWidth,maxHeight,minWidth,minHeight都爲double.infinity;

Constraints的做用？

在Flutter中，widget只會存儲一些基本信息，具體的渲染由RenderBox對象完成，RenderBox由其父級給出約束，並根據這些約束自行調整自身大小；具體來講，Flutter框架中的佈局模型是由一個個RenderBox對象排列組成的樹形結構，從該樹狀模型的根結點開始渲染，向子結點傳遞約束，這些約束會被傳遞到最終子結點，並從最終子結點返回根結點，返回過程當中，子結點會根據接收到的約束調整自身大小，並將此大小（Size）向上傳遞給父結點：

1，父結點A向每一個子結點傳遞constraints,子結點的最終佈局須要遵照這些約束，就像小時候出門玩，父母跟你的約定，你能夠隨便玩，可是6點前必須回家吃飯；

2，子結點B1,B2能夠有本身的約束，同時B1也向它的子結點C傳遞該限制，直到C沒有子結點爲止，當你長大成家了，你也讓你的孩子6點前必須回家吃飯

3，子結點B1能夠根據接收來自父結點A的約束，自身的狀況（width,height）,子結點C上傳過來的Size這三個因素來肯定自身大小（Size），收集完這些佈局信息以後，子結點B就能夠把這些信息向上傳給結點A；

對於Box模型(Box Model)，由父結點向下傳遞給子結點的約束稱爲盒約（BoxConstraints）,它決定了容許其子結點可佔用的最大、最小寬度和最大最小高度，好比下圖是父結點傳遞給子結點的盒約束，意味着子結點能夠任意佔用綠色框內大小，即：子結點的寬度介於150和300之間，高度介於100和無窮大（infinity），而後子結點在知足父結點的約束和自身需佔用的大小等因素確認最終大小（Size）,並通知其父結點；

結語：

本篇梳理了Flutter的一些佈局及相關術語，下篇將會進入Flutter Widget Container的詳解，Container與本篇中說起的知識點結合比較緊，是充分理解Container的必要基礎知識。