Как нарисовать виджет на доступной высоте в флаттере

Question

У меня есть виджет, который нужно нарисовать на оставшейся высоте, где этот виджет должен быть нарисован между верхним и нижним виджетом (нижний виджет нарисован с атрибутом нижнего центра).

Пример:

Контейнер () - Первый контейнер почти занимает половину экрана

Контейнер () - Второй контейнер рисует в нижней части экрана, например: виджет как кнопка

Container () - Третий контейнер должен быть нарисован между двумя контейнерами.

Answer 1

Расширенный виджет будет работать для этого сценария, где нам нужно обернуть его средним виджетом.

Например:

Expanded(
        child: Container(
              ...         
            ),
         ),

Answer 2

Если у вас есть что-то вроде Column, вы, вероятно, захотите использовать виджет Expanded.

Попробуйте этот код

Column(
  children: [
    Container(color: Colors.red, height: 100),
    Expanded(
      child: Container(color: Colors.yellow, height: 100),
    ),
    Container(color: Colors.red, height: 100),
  ],
)

Из расширенного класса документация:

Виджет, расширяющий дочерний элемент строки, столбца или изгиба таким образом, чтобы дочерний элемент заполнял доступное пространство.