Repository: flutter
Issue: Background color leaks outside in a PageView with blurred children
Labels: framework,f: material design,f: scrolling,has reproducible steps,P2,found in release: 2.2,found in release: 2.6,team-design,triaged-design

As you can see in the video the background color always leaks into the right side of an item. The left side does not have that issue. I'm not sure if it's related to https://github.com/flutter/flutter/issues/14288 but if I remove the blur from an element then there's no gap between children so maybe not. 

https://user-images.githubusercontent.com/29712386/132356633-ed31e4c4-37a7-4836-bb47-77d2baf9ce24.MP4

<details>
  <summary>code sample</summary>
  
 ```dart
import 'package:flutter/material.dart';
import 'dart:ui';

void main() {
  runApp(App());
}

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Colors.black,
        body: PageView.builder(
          itemBuilder: (context, index) {
            return Stack(
              children: [
                Container(color: Colors.white),
                Positioned(
                  child: Container(
                    clipBehavior: Clip.hardEdge,
                    decoration: BoxDecoration(),
                    child: BackdropFilter(
                      filter: ImageFilter.blur(
                        sigmaX: 20,
                        sigmaY: 20,
                      ),
                      child: Center(
                        child: Text(
                          'Page #${index + 1}',
                          style: TextStyle(
                            fontWeight: FontWeight.bold,
                            fontSize: 32,
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              ],
            );
          },
        ),
      ),
    );
  }
}

```
</details>


<details>
  <summary>flutter doctor output</summary>
  
```
[✓] Flutter (Channel stable, 2.2.3, on macOS 11.4 20F71 darwin-x64, locale en-US)
    • Flutter version 2.2.3 at /Users/alexmiller/flutter
    • Framework revision f4abaa0735 (10 weeks ago), 2021-07-01 12:46:11 -0700
    • Engine revision 241c87ad80
    • Dart version 2.13.4

[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
    • Android SDK at /Users/alexmiller/Library/Android/sdk
    • Platform android-30, build-tools 30.0.2
    • ANDROID_HOME = /Users/alexmiller/Library/Android/sdk
    • Java binary at: /Users/alexmiller/.sdkman/candidates/java/current/bin/java
    • Java version OpenJDK Runtime Environment (AdoptOpenJDK)(build 1.8.0_275-b01)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 12.5, Build version 12E262
    • CocoaPods version 1.10.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[!] Android Studio (version 2020.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    ✗ Unable to find bundled Java version.
    • Try updating or re-installing Android Studio.

[✓] VS Code (version 1.58.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.25.0

[✓] Connected device (3 available)
    • Alex’s iPhone (mobile) • 00008020-0019358426F1002E • ios            • iOS 14.6
    • macOS (desktop)        • macos                     • darwin-x64     • macOS 11.4 20F71 darwin-x64
    • Chrome (web)           • chrome                    • web-javascript • Google Chrome 93.0.4577.63

! Doctor found issues in 1 category.
```
</details>