Apply media bottom padding to CupertinoTabBar (#13372)

This adjusts the CupertinoTabBar height in the presence of bottom
padding. On the iPhone X, this will increase the height to account for
the home indicator widget.

packages/flutter/lib/src/cupertino/bottom_tab_bar.dart

@@ -92,6 +92,7 @@ class CupertinoTabBar extends StatelessWidget implements PreferredSizeWidget {
 
   @override
   Widget build(BuildContext context) {
+    final double bottomPadding = MediaQuery.of(context).padding.bottom;
     Widget result = new DecoratedBox(
       decoration: new BoxDecoration(
         border: const Border(
@@ -105,7 +106,7 @@ class CupertinoTabBar extends StatelessWidget implements PreferredSizeWidget {
       ),
       // TODO(xster): allow icons-only versions of the tab bar too.
       child: new SizedBox(
-        height: _kTabBarHeight,
+        height: _kTabBarHeight + bottomPadding,
         child: IconTheme.merge( // Default with the inactive state.
           data: new IconThemeData(
             color: inactiveColor,
@@ -119,10 +120,13 @@ class CupertinoTabBar extends StatelessWidget implements PreferredSizeWidget {
               fontWeight: FontWeight.w500,
               color: inactiveColor,
             ),
-            child: new Row(
-              // Align bottom since we want the labels to be aligned.
-              crossAxisAlignment: CrossAxisAlignment.end,
-              children: _buildTabItems(),
+            child: new Padding(
+              padding: new EdgeInsets.only(bottom: bottomPadding),
+              child: new Row(
+                // Align bottom since we want the labels to be aligned.
+                crossAxisAlignment: CrossAxisAlignment.end,
+                children: _buildTabItems(),
+              ),
             ),
           ),
         ),

packages/flutter/test/cupertino/bottom_tab_bar_test.dart

@@ -35,20 +35,23 @@ void main() {
   });
 
   testWidgets('Active and inactive colors', (WidgetTester tester) async {
-    await pumpWidgetWithBoilerplate(tester, new CupertinoTabBar(
-      items: <BottomNavigationBarItem>[
-        const BottomNavigationBarItem(
-          icon: const ImageIcon(const TestImageProvider(24, 24)),
-          title: const Text('Tab 1'),
-        ),
-        const BottomNavigationBarItem(
-          icon: const ImageIcon(const TestImageProvider(24, 24)),
-          title: const Text('Tab 2'),
-        ),
-      ],
-      currentIndex: 1,
-      activeColor: const Color(0xFF123456),
-      inactiveColor: const Color(0xFF654321),
+    await pumpWidgetWithBoilerplate(tester, new MediaQuery(
+      data: const MediaQueryData(),
+      child: new CupertinoTabBar(
+        items: <BottomNavigationBarItem>[
+          const BottomNavigationBarItem(
+            icon: const ImageIcon(const TestImageProvider(24, 24)),
+            title: const Text('Tab 1'),
+          ),
+          const BottomNavigationBarItem(
+            icon: const ImageIcon(const TestImageProvider(24, 24)),
+            title: const Text('Tab 2'),
+          ),
+        ],
+        currentIndex: 1,
+        activeColor: const Color(0xFF123456),
+        inactiveColor: const Color(0xFF654321),
+      ),
     ));
 
     final RichText actualInactive = tester.widget(find.descendant(
@@ -64,34 +67,79 @@ void main() {
     expect(actualActive.text.style.color, const Color(0xFF123456));
   });
 
-  testWidgets('Opaque background does not add blur effects', (WidgetTester tester) async {
-    await pumpWidgetWithBoilerplate(tester, new CupertinoTabBar(
+  testWidgets('Adjusts height to account for bottom padding', (WidgetTester tester) async {
+    final CupertinoTabBar tabBar = new CupertinoTabBar(
       items: <BottomNavigationBarItem>[
         const BottomNavigationBarItem(
           icon: const ImageIcon(const TestImageProvider(24, 24)),
-          title: const Text('Tab 1'),
+          title: const Text('Aka'),
         ),
         const BottomNavigationBarItem(
           icon: const ImageIcon(const TestImageProvider(24, 24)),
-          title: const Text('Tab 2'),
+          title: const Text('Shiro'),
         ),
       ],
+    );
+
+    // Verify height with no bottom padding.
+    await pumpWidgetWithBoilerplate(tester, new MediaQuery(
+      data: const MediaQueryData(),
+      child: new CupertinoTabScaffold(
+        tabBar: tabBar,
+        tabBuilder: (BuildContext context, int index) {
+          return const Placeholder();
+        },
+      ),
+    ));
+    expect(tester.getSize(find.byType(CupertinoTabBar)).height, 50.0);
+
+    // Verify height with bottom padding.
+    await pumpWidgetWithBoilerplate(tester, new MediaQuery(
+      data: const MediaQueryData(padding: const EdgeInsets.only(bottom: 40.0)),
+      child: new CupertinoTabScaffold(
+        tabBar: tabBar,
+        tabBuilder: (BuildContext context, int index) {
+          return const Placeholder();
+        },
+      ),
+    ));
+    expect(tester.getSize(find.byType(CupertinoTabBar)).height, 90.0);
+  });
+
+  testWidgets('Opaque background does not add blur effects', (WidgetTester tester) async {
+    await pumpWidgetWithBoilerplate(tester, new MediaQuery(
+      data: const MediaQueryData(),
+      child: new CupertinoTabBar(
+        items: <BottomNavigationBarItem>[
+          const BottomNavigationBarItem(
+            icon: const ImageIcon(const TestImageProvider(24, 24)),
+            title: const Text('Tab 1'),
+          ),
+          const BottomNavigationBarItem(
+            icon: const ImageIcon(const TestImageProvider(24, 24)),
+            title: const Text('Tab 2'),
+          ),
+        ],
+      ),
     ));
 
     expect(find.byType(BackdropFilter), findsOneWidget);
 
-    await pumpWidgetWithBoilerplate(tester, new CupertinoTabBar(
-      items: <BottomNavigationBarItem>[
-        const BottomNavigationBarItem(
-          icon: const ImageIcon(const TestImageProvider(24, 24)),
-          title: const Text('Tab 1'),
-        ),
-        const BottomNavigationBarItem(
-          icon: const ImageIcon(const TestImageProvider(24, 24)),
-          title: const Text('Tab 2'),
-        ),
-      ],
-      backgroundColor: const Color(0xFFFFFFFF), // Opaque white.
+    await pumpWidgetWithBoilerplate(tester, new MediaQuery(
+      data: const MediaQueryData(),
+      child: new CupertinoTabBar(
+        items: <BottomNavigationBarItem>[
+          const BottomNavigationBarItem(
+            icon: const ImageIcon(const TestImageProvider(24, 24)),
+            title: const Text('Tab 1'),
+          ),
+          const BottomNavigationBarItem(
+            icon: const ImageIcon(const TestImageProvider(24, 24)),
+            title: const Text('Tab 2'),
+          ),
+        ],
+        backgroundColor: const Color(0xFFFFFFFF), // Opaque white.
+      ),
     ));
 
     expect(find.byType(BackdropFilter), findsNothing);
@@ -100,22 +148,25 @@ void main() {
   testWidgets('Tap callback', (WidgetTester tester) async {
     int callbackTab;
 
-      await pumpWidgetWithBoilerplate(tester, new CupertinoTabBar(
-      items: <BottomNavigationBarItem>[
-        const BottomNavigationBarItem(
-          icon: const ImageIcon(const TestImageProvider(24, 24)),
-          title: const Text('Tab 1'),
+      await pumpWidgetWithBoilerplate(tester, new MediaQuery(
+        data: const MediaQueryData(),
+        child: new CupertinoTabBar(
+          items: <BottomNavigationBarItem>[
+            const BottomNavigationBarItem(
+              icon: const ImageIcon(const TestImageProvider(24, 24)),
+              title: const Text('Tab 1'),
+            ),
+            const BottomNavigationBarItem(
+              icon: const ImageIcon(const TestImageProvider(24, 24)),
+              title: const Text('Tab 2'),
+            ),
+          ],
+          currentIndex: 1,
+          onTap: (int tab) { callbackTab = tab; },
         ),
-        const BottomNavigationBarItem(
-          icon: const ImageIcon(const TestImageProvider(24, 24)),
-          title: const Text('Tab 2'),
-        ),
-      ],
-      currentIndex: 1,
-      onTap: (int tab) { callbackTab = tab; },
     ));
 
     await tester.tap(find.text('Tab 1'));
     expect(callbackTab, 0);
   });
-}
+}
\ No newline at end of file