Add extendBody parameter to Scaffold, body MediaQuery reflects BAB height - #27973

Fixes #17555

This PR is based on #25654 which was contributed by @IKatsuba.

If Scaffold.extendedBody is true then the Scaffold's body extends to the bottom of the Scaffold, instead of only extending to the top of Scaffold.bottomNavigationBar. This ensures that the scaffold's body will appear behind a non-rectangular or sem-transparent bottom navigation bar of behind the Scaffold's persistentFooterButtons.

Scaffold.extendedBody is false by default.

This change corrects a long standing problem with "notched" bottom navigation bars.

Before

After

...
Scaffold(extendBody: true, ...)
...

If Scaffold.extendedBody is true and the bottom navigation bar is specified then a MediaQuery whose bottom padding matches the height of the bottom navigation bar will be added above the scaffold body. Children of the scaffold body that have been enclosed in a SafeArea or that are padded to match the MedaQuery's padding, can still avoid the bottom navigation bar.

Sample App

Here's a complete example that demonstrates how the body's MediaQuery can be used.

There are 25 (0 - 24) textfield items in the list. Scrolling to the end completely exposes the last one because the list's bottom padding matches the MediaQuery:

extendBody: true,
body: Builder(
  builder: (BuildContext context) {
    return ListView(
      padding: MediaQuery.of(context).padding,
      children: List<Widget>.generate(25, (int i) {
        ...
      })
    );
  }
  ...

When the keyboard appears the Scaffold's body is resized (the Scaffold's resizeToAvoidBottomInsets is true by default) and the body's MediaQuery no longer includes bottom padding.