mirror of
https://github.com/flutter/flutter.git
synced 2026-02-20 02:29:02 +08:00
906d520c2b
This PR adds the engine support for a new iOS-style blur. It works by adding parameters to the blur filter that specify its _blurring bounds_. This is the engine-side implementation. The corresponding framework changes that expose this to developers are in: * Framework PR: https://github.com/flutter/flutter/pull/175473 Related issues: * Main tracking issue: https://github.com/flutter/flutter/issues/99691 * Algorithm details: https://github.com/flutter/flutter/issues/164267#issuecomment-2731163225 Design doc & previous discussions: [flutter.dev/go/ios-style-blur-support](flutter.dev/go/ios-style-blur-support) ### The Visual (Before & After) This new mode, which I'm calling "bounded blur," is different from the traditional (global) gaussian blur in that blurs would not sample transparent pixels from outside the provided area. The demo below shows the old blur (left) and the new bounded blur (right). Both are blurring a black triangle. <img width="1008" height="557" alt="image" src="https://github.com/user-attachments/assets/202fa4a1-a61f-4357-9dce-73c545cf3b07" /> <img height="557" alt="image" src="https://github.com/user-attachments/assets/0d544e6a-4c88-488d-84c3-60d617c9d614" /> Notice the new version on the right no longer has the bright "lining" at the top and left edges. This is because the blur algorithm now knows its own bounds and correctly stops sampling pixels from outside that area. ### Technical details #### API Change To pass the bounds information down, I've added new parameters to `_initBlur`: ```dart // painting.dart external void _initBlur( double sigmaX, double sigmaY, int tileMode, bool bounded, // Start of new parameters double boundsLeft, double boundsTop, double boundsRight, double boundsBottom, ); ``` #### How the Bounds Are Used These bounds are passed all the way down to `GaussianBlurFilterContents` and affect two key parts of the process: * Downsampling Pass: The shader is instructed not to sample any pixels outside the provided bounds. * Blurring Passes: The final blurred result is divided by the resulting opacity. This normalizes the varying alpha (due to varying sum of weights) across the pixels near the edge. #### Notable Engine Changes To handle the downsampling logic, I created a new downsampling shader `texture_downsample_bounded`. ## Pre-launch Checklist - [ ] I read the [Contributor Guide] and followed the process outlined there for submitting PRs. - [ ] I read the [Tree Hygiene] wiki page, which explains my responsibilities. - [ ] I read and followed the [Flutter Style Guide], including [Features we expect every widget to implement]. - [ ] I signed the [CLA]. - [ ] I listed at least one issue that this PR fixes in the description above. - [ ] I updated/added relevant documentation (doc comments with `///`). - [ ] I added new tests to check the change I am making, or this PR is [test-exempt]. - [ ] I followed the [breaking change policy] and added [Data Driven Fixes] where supported. - [ ] All existing and new tests are passing. If you need help, consider asking for advice on the #hackers-new channel on [Discord]. **Note**: The Flutter team is currently trialing the use of [Gemini Code Assist for GitHub](https://developers.google.com/gemini-code-assist/docs/review-github-code). Comments from the `gemini-code-assist` bot should not be taken as authoritative feedback from the Flutter team. If you find its comments useful you can update your code accordingly, but if you are unsure or disagree with the feedback, please feel free to wait for a Flutter team member's review for guidance on which automated comments should be addressed. <!-- Links --> [Contributor Guide]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#overview [Tree Hygiene]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md [test-exempt]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#tests [Flutter Style Guide]: https://github.com/flutter/flutter/blob/main/docs/contributing/Style-guide-for-Flutter-repo.md [Features we expect every widget to implement]: https://github.com/flutter/flutter/blob/main/docs/contributing/Style-guide-for-Flutter-repo.md#features-we-expect-every-widget-to-implement [CLA]: https://cla.developers.google.com/ [flutter/tests]: https://github.com/flutter/tests [breaking change policy]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#handling-breaking-changes [Discord]: https://github.com/flutter/flutter/blob/main/docs/contributing/Chat.md [Data Driven Fixes]: https://github.com/flutter/flutter/blob/main/docs/contributing/Data-driven-Fixes.md