Flutter Scaffold allow child behind the system Navigation Bar

Question

I post this question due to the difficult to find the response I need, but I guess it must have been replied somewhere. If it indeed was asked and replied somewhere else, please point me to the right direction

See the image below, taken from a kitkat device. The Scaffold has a red background, and it's body a green one. I need the green to cover all scaffold, including the area behind the Navigation Bar.

Ps.: Code, as requested

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        scaffoldBackgroundColor: Colors.red,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      body: Container(
        color: Colors.green,
        child: Center(

        ),
    ),
      // Set bg to blue, to show that the Scaffold is indeed behind the Nav Bar...
      backgroundColor: Colors.blue,
    );
  }

  @override
  void dispose() {
    super.dispose();
  }
}

Ps².: To make things clear, my problem is that I'm trying to draw behind the Navigation Bar. The Scaffold clearly draws itself behind it, but it doesn't let me do this, and if I use SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top]); the Navigation Bar is hidden, and I need it to be visible, like the Status Bar is.

Answer 1

Adding: extendBody: true, on Scaffold works here. Body will extend under bottomNavigationBar.