Флаттерный контейнер внутри контейнера

Question

В эти дни я тренируюсь с флаттерным контейнером, и этот пример, который я придумал, просто удивителен

Я поместил Контейнер размером 50x50 внутрь Контейнера размером 200x200. Странно, что внутренний контейнер расширяется до 200x200, хотя он имеет жесткое ограничение 50x50.

Вот код

Container(
  width: 200.0,
  height: 200.0,
  color: Colors.orange,
  child: Container(
    width: 50.0,
    height: 50.0,
    color: Colors.blue,
  ),
)

Я ожидаю маленькую синюю коробку внутри большой оранжевой коробки.

Может кто-нибудь объяснить, почему?

Answer 1

Вам необходимо указать, где в оранжевом поле вы хотели бы, чтобы синий блок отображался, в противном случае синий блок увеличится до размера его родителя.

  Container(
    width: 200.0,
    height: 200.0,
    color: Colors.orange,
    alignment: Alignment.center, // where to position the child
    child: Container(
      width: 50.0,
      height: 50.0,
      color: Colors.blue,
    ),
  ),