From cb1b6502f13db8aa218742c80d27a14b00ef495a Mon Sep 17 00:00:00 2001
From: Yuqian Li <liyuqian@google.com>
Date: Fri, 8 Mar 2019 15:42:54 -0800
Subject: [PATCH] Update docs

---
 packages/flutter/lib/src/widgets/basic.dart | 64 ++++++---------------
 1 file changed, 18 insertions(+), 46 deletions(-)

diff --git a/packages/flutter/lib/src/widgets/basic.dart b/packages/flutter/lib/src/widgets/basic.dart
index b318e4142d..ba08715491 100644
--- a/packages/flutter/lib/src/widgets/basic.dart
+++ b/packages/flutter/lib/src/widgets/basic.dart
@@ -336,15 +336,14 @@ class ShaderMask extends SingleChildRenderObjectWidget {
 /// A widget that applies a filter to the existing painted content and then
 /// paints [child].
 ///
-/// The filter will only be applied to the area of the background in which the
-/// [child] (or one of its descendants) is actually going to paint in regardless
-/// of the actual size of [child].
+/// The filter will be applied to all the area within its parent or ancestor
+/// widget's clip. If there's no clip, the filter will be applied to the full
+/// screen.
 ///
 /// {@tool sample}
-/// Even though the [BackdropFilter] is wrapping the [Container] below, the
-/// background will only be blurred in the area defined by the bounding box
-/// of the [Text] because that's the only area any descendant of the
-/// [BackdropFilter] is painting in.
+/// If the [BackdropFilter] needs to be applied to an area that exactly matches
+/// its child, wraps the [BackdropFilter] with a clip widget that clips exactly
+/// to that child.
 ///
 /// ```dart
 /// Stack(
@@ -352,45 +351,18 @@ class ShaderMask extends SingleChildRenderObjectWidget {
 ///   children: <Widget>[
 ///     Text('0' * 10000),
 ///     Center(
-///       child: BackdropFilter(
-///         filter: ui.ImageFilter.blur(
-///           sigmaX: 5.0,
-///           sigmaY: 5.0,
-///         ),
-///         child: Container(
-///           alignment: Alignment.center,
-///           width: 200.0,
-///           height: 200.0,
-///           child: Text('Hello World'),
-///         ),
-///       ),
-///     ),
-///   ],
-/// )
-/// ```
-///
-/// To blur the entire area of the [Container], increase the paint area of
-/// the Container. Giving it a transparent background color will increase
-/// the paint area of the container (and hence blur the background behind the
-/// entire container) without changing other visual properties.
-///
-/// ```dart
-/// Stack(
-///   fit: StackFit.expand,
-///   children: <Widget>[
-///     Text('0' * 10000),
-///     Center(
-///       child: BackdropFilter(
-///         filter: ui.ImageFilter.blur(
-///           sigmaX: 5.0,
-///           sigmaY: 5.0,
-///         ),
-///         child: Container(
-///           color: Colors.transparent, // <-- NEW
-///           alignment: Alignment.center,
-///           width: 200.0,
-///           height: 200.0,
-///           child: Text('Hello World'),
+///       child: ClipRect(  // <-- clips to the 200x200 [Container] below
+///         child: BackdropFilter(
+///           filter: ui.ImageFilter.blur(
+///             sigmaX: 5.0,
+///             sigmaY: 5.0,
+///           ),
+///           child: Container(
+///             alignment: Alignment.center,
+///             width: 200.0,
+///             height: 200.0,
+///             child: Text('Hello World'),
+///           ),
 ///         ),
 ///       ),
 ///     ),