round 1 (#9876)

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

@@ -2,6 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import 'dart:ui' show ImageFilter;
 import 'package:flutter/foundation.dart';
 import 'package:flutter/widgets.dart';
 
@@ -10,18 +11,18 @@ import 'package:flutter/widgets.dart';
 const TextStyle _kCupertinoDialogTitleStyle = const TextStyle(
   fontFamily: '.SF UI Display',
   inherit: false,
-  fontSize:  17.0,
+  fontSize:  17.5,
   fontWeight: FontWeight.w600,
   color: const Color(0xFF000000),
-  height: 1.35,
+  height: 1.25,
   textBaseline: TextBaseline.alphabetic,
 );
 
 const TextStyle _kCupertinoDialogContentStyle = const TextStyle(
   fontFamily: '.SF UI Text',
   inherit: false,
-  fontSize:  12.0,
-  fontWeight: FontWeight.w400,
+  fontSize:  12.4,
+  fontWeight: FontWeight.w500,
   color: const Color(0xFF000000),
   height: 1.35,
   textBaseline: TextBaseline.alphabetic,
@@ -30,18 +31,18 @@ const TextStyle _kCupertinoDialogContentStyle = const TextStyle(
 const TextStyle _kCupertinoDialogActionStyle = const TextStyle(
   fontFamily: '.SF UI Text',
   inherit: false,
-  fontSize:  16.0,
+  fontSize:  16.8,
   fontWeight: FontWeight.w400,
   color: const Color(0xFF027AFF),
   textBaseline: TextBaseline.alphabetic,
 );
 
 const double _kCupertinoDialogWidth = 270.0;
-const BoxDecoration _kCupertinoDialogDecoration = const BoxDecoration(
-  // TODO(abarth): Rather than being opaque, this decoration should actually be
-  // partially transparent and have a subtle background blur effect.
-  color: const Color(0xFFF8F8F8),
-  borderRadius: const BorderRadius.all(const Radius.circular(15.0)),
+const BoxDecoration _kCupertinoDialogFrontFillDecoration = const BoxDecoration(
+  color: const Color(0xCCFFFFFF),
+);
+const BoxDecoration _kCupertinoDialogBackFill = const BoxDecoration(
+  color: const Color(0x77FFFFFFF),
 );
 
 /// An iOS-style dialog.
@@ -68,11 +69,22 @@ class CupertinoDialog extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return new Center(
-      child: new Container(
-        margin: const EdgeInsets.all(10.0),
-        width: _kCupertinoDialogWidth,
-        decoration: _kCupertinoDialogDecoration,
-        child: child,
+      child: new ClipRRect(
+        borderRadius: const BorderRadius.all(const Radius.circular(12.0)),
+        child: new DecoratedBox(
+          // To get the effect, 2 white fills are needed. One blended with the
+          // background before applying the blur and one overlayed on top of
+          // the blur.
+          decoration: _kCupertinoDialogBackFill,
+          child: new BackdropFilter(
+            filter: new ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
+            child: new Container(
+              width: _kCupertinoDialogWidth,
+              decoration: _kCupertinoDialogFrontFillDecoration,
+              child: child,
+            ),
+          ),
+        ),
       ),
     );
   }
@@ -123,11 +135,11 @@ class CupertinoAlertDialog extends StatelessWidget {
   Widget build(BuildContext context) {
     final List<Widget> children = <Widget>[];
 
-    children.add(const SizedBox(height: 20.0));
+    children.add(const SizedBox(height: 18.0));
 
     if (title != null) {
       children.add(new Padding(
-        padding: const EdgeInsets.only(left: 20.0, right: 20.0, bottom: 12.0),
+        padding: const EdgeInsets.only(left: 20.0, right: 20.0, bottom: 2.0),
         child: new DefaultTextStyle(
           style: _kCupertinoDialogTitleStyle,
           textAlign: TextAlign.center,
@@ -150,7 +162,7 @@ class CupertinoAlertDialog extends StatelessWidget {
       ));
     }
 
-    children.add(const SizedBox(height: 20.0));
+    children.add(const SizedBox(height: 22.0));
 
     if (actions != null) {
       children.add(new _CupertinoButtonBar(