Flutter Row не занимает полную высоту каркаса

Question

Я работаю над скелетом приложения для планшета с флаттером, и я столкнулся, вероятно, с очень простой проблемой, но мне становится сложно понять, что здесь происходит.

В основном, скелет приложения должен выглядеть примерно так:

Для этого я написал простой Stateless класс, например:

class BaseDetailsRoute extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey,
      body: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Flexible(flex: 1, child: _selectionColumn()),
          Flexible(flex: 7, child: _contentArea())
        ],
      ),
    );
  }

  Widget _contentArea() => Container(color: Colors.orange,);

  Column _selectionColumn() => Column(
    children: <Widget>[
      Expanded(child: Container(color: Colors.blue,))
    ],
  );
}

Что дает мне ПОЧТИ ожидаемый результат:

Небольшая проблема здесь внизу экрана, как вы можете видите, в Scaffold я поставил backgroundColor: Colors.grey, и после рендеринга Row на экране кажется, что по какой-то причине я не могу заставить его занять всю доступную высоту, и я все еще вижу немного серый цвет фона каркаса внизу.

Я попытался обернуть весь каркас внутри виджета SafeArea, но это не сработало.

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

Answer 1

Это немного странно, но ваш код работает так, как задумано на моей стороне (как для портретной, так и для альбомной ориентации). Какой эмулятор вы используете?

См. Изображение: Pixel 2 API 29 Портрет эмулятора Pixel 2 API 29 Emulator Lanscape

Answer 2

не могли бы вы попробовать

     child: Column(
                mainAxisSize:  MainAxisSize.max,
                children: <Widget>[

и дайте мне знать, работает ли он