fix date/time picker borders (#16240)

packages/flutter/lib/src/material/date_picker.dart

@@ -896,6 +896,7 @@ class _DatePickerDialogState extends State<_DatePickerDialog> {
 
   @override
   Widget build(BuildContext context) {
+    final ThemeData theme = Theme.of(context);
     final Widget picker = new Flexible(
       child: new SizedBox(
         height: _kMaxDayPickerHeight,
@@ -916,7 +917,7 @@ class _DatePickerDialogState extends State<_DatePickerDialog> {
         ],
       ),
     );
-    return new Dialog(
+    final Dialog dialog = new Dialog(
       child: new OrientationBuilder(
         builder: (BuildContext context, Orientation orientation) {
           assert(orientation != null);
@@ -933,7 +934,20 @@ class _DatePickerDialogState extends State<_DatePickerDialog> {
                 child: new Column(
                   mainAxisSize: MainAxisSize.min,
                   crossAxisAlignment: CrossAxisAlignment.stretch,
-                  children: <Widget>[header, picker, actions],
+                  children: <Widget>[
+                    header,
+                    new Container(
+                      color: theme.dialogBackgroundColor,
+                      child: new Column(
+                        mainAxisSize: MainAxisSize.min,
+                        crossAxisAlignment: CrossAxisAlignment.stretch,
+                        children: <Widget>[
+                          picker,
+                          actions,
+                        ],
+                      ),
+                    ),
+                  ],
                 ),
               );
             case Orientation.landscape:
@@ -945,8 +959,9 @@ class _DatePickerDialogState extends State<_DatePickerDialog> {
                   children: <Widget>[
                     header,
                     new Flexible(
-                      child: new SizedBox(
+                      child: new Container(
                         width: _kMonthPickerLandscapeWidth,
+                        color: theme.dialogBackgroundColor,
                         child: new Column(
                           mainAxisSize: MainAxisSize.min,
                           crossAxisAlignment: CrossAxisAlignment.stretch,
@@ -962,6 +977,13 @@ class _DatePickerDialogState extends State<_DatePickerDialog> {
         }
       )
     );
+
+    return new Theme(
+      data: theme.copyWith(
+        dialogBackgroundColor: Colors.transparent,
+      ),
+      child: dialog,
+    );
   }
 }
 

packages/flutter/lib/src/material/time_picker.dart

@@ -1523,6 +1523,7 @@ class _TimePickerDialogState extends State<_TimePickerDialog> {
     final MediaQueryData media = MediaQuery.of(context);
     final TimeOfDayFormat timeOfDayFormat = localizations.timeOfDayFormat(alwaysUse24HourFormat: media.alwaysUse24HourFormat);
     final bool use24HourDials = hourFormat(of: timeOfDayFormat) != HourFormat.h;
+    final ThemeData theme = Theme.of(context);
 
     final Widget picker = new Padding(
       padding: const EdgeInsets.all(16.0),
@@ -1552,7 +1553,7 @@ class _TimePickerDialogState extends State<_TimePickerDialog> {
       )
     );
 
-    return new Dialog(
+    final Dialog dialog = new Dialog(
       child: new OrientationBuilder(
         builder: (BuildContext context, Orientation orientation) {
           final Widget header = new _TimePickerHeader(
@@ -1564,6 +1565,17 @@ class _TimePickerDialogState extends State<_TimePickerDialog> {
             use24HourDials: use24HourDials,
           );
 
+          final Widget pickerAndActions = new Container(
+            color: theme.dialogBackgroundColor,
+            child: new Column(
+              mainAxisSize: MainAxisSize.min,
+              children: <Widget>[
+                new Expanded(child: picker), // picker grows and shrinks with the available space
+                actions,
+              ],
+            ),
+          );
+
           assert(orientation != null);
           switch (orientation) {
             case Orientation.portrait:
@@ -1575,8 +1587,9 @@ class _TimePickerDialogState extends State<_TimePickerDialog> {
                   crossAxisAlignment: CrossAxisAlignment.stretch,
                   children: <Widget>[
                     header,
-                    new Expanded(child: picker),
-                    actions,
+                    new Expanded(
+                      child: pickerAndActions,
+                    ),
                   ]
                 )
               );
@@ -1590,12 +1603,7 @@ class _TimePickerDialogState extends State<_TimePickerDialog> {
                   children: <Widget>[
                     header,
                     new Flexible(
-                      child: new Column(
-                        children: <Widget>[
-                          new Expanded(child: picker),
-                          actions,
-                        ]
-                      )
+                      child: pickerAndActions,
                     ),
                   ]
                 )
@@ -1605,6 +1613,13 @@ class _TimePickerDialogState extends State<_TimePickerDialog> {
         }
       )
     );
+
+    return new Theme(
+      data: theme.copyWith(
+        dialogBackgroundColor: Colors.transparent,
+      ),
+      child: dialog,
+    );
   }
 
   @override