Ответ
Во Flutter система ограничений (constraints) — это фундаментальный механизм лейаута. Родительский виджет передает дочернему BoxConstraints, определяя минимальные и максимальные допустимые размеры по ширине и высоте. Дочерний виджет должен выбрать свой размер в рамках этих ограничений, после чего родитель его позиционирует.
Ключевые принципы:
- Ограничения идут сверху вниз. Родитель задает constraints ребенку.
- Размер идет снизу вверх. Ребенок выбирает свой размер в заданных рамках и сообщает его родителю.
- Виджет не может выйти за переданные ему constraints. Если
maxWidth: 200, виджет не может быть шире 200 пикселей.
Пример с ConstrainedBox:
ConstrainedBox(
constraints: BoxConstraints(
minWidth: 100,
maxWidth: 300,
minHeight: 50,
maxHeight: 150,
),
child: Container(
color: Colors.red,
width: 400, // Это значение будет проигнорировано, т.к. превышает maxWidth:300
height: 100,
),
)
В этом примере Container будет шириной 300px (максимум) и высотой 100px (в пределах min/max).
Особые виджеты:
SizedBox: Игнорирует часть constraints, жестко задавая размер.UnconstrainedBox: Временно снимает ограничения для своего ребенка (но может вызвать overflow).LayoutBuilder: Позволяет виджету узнать constraints, переданные от родителя, и динамически строить на их основе свой дочерний widget tree.
Ответ 18+ 🔞
Давай разберём эту тему, а то она у многих мозги выносит. Представь, что ты родитель, а твой виджет — это твой ребёнок. Ты ему говоришь: «Слушай сюда, сынок, ты можешь быть не уже вот этой линии и не шире вот этой стены, но и не меньше этой табуретки, понял?» Это и есть BoxConstraints — минималка и максималка по ширине и высоте. Дитё потом само решает, какого размера ему быть в этих рамках, и докладывает тебе. А ты его уже на выбранное место ставишь.
Суть в трёх пунктах, запоминай:
- Приказ сверху. Ты (родитель) диктуешь правила (constraints) ребёнку.
- Отчёт снизу. Ребёнок, покрутившись в этих рамках, говорит: «Па, я буду вот такого размера».
- Выйти за рамки — ни хуя себе. Если ты сказал «шириной не больше 200», то хоть обосрись, больше 200 он не станет. Вообще. Это закон.
Смотри на примере ConstrainedBox:
ConstrainedBox(
constraints: BoxConstraints(
minWidth: 100,
maxWidth: 300,
minHeight: 50,
maxHeight: 150,
),
child: Container(
color: Colors.red,
width: 400, // Это значение будет проигнорировано, т.к. превышает maxWidth:300
height: 100,
),
)
Что тут происходит? Контейнеру захотелось быть шириной в 400 пикселей, но папа-ConstrainedBox сказал: «Не, сынок, максимум — 300». И контейнер, скрипя зубами, сжимается до 300. Высоту 100 ему разрешили, она в пределах дозволенного. Вот и вся магия.
Есть ещё спецотряды виджетов, которые правила немного гнут:
SizedBox: Этот чувак вообще похуй на часть ограничений. Он как слон в посудной лавке — говорит: «Будет вот такой размер, и не спорь». Жёстко фиксирует.UnconstrainedBox: А этот — тот ещё анархист. Он временно снимает с ребёнка все оковы: «Делай что хочешь». Но будь готов, что ребёнок вылезет за границы и будет overflow — предупреждение в консоли и кусок виджета, которого не видно. Эдакая хитрая жопа.LayoutBuilder: Вот это, бля, самый умный. Он позволяет виджету заглянуть в constraints, которые ему передали, и на лету, в зависимости от них, строить свою внутреннюю разметку. Очень мощная штука, когда нужно адаптивность сделать. Сам от такого охуеваю, когда получается.