Skip to content

Cupertino blurs should boost saturation #29483

@JulianBissekkou

Description

@JulianBissekkou

Apple makes extensive use of blur on iOS/MacOS to guide the users focus and attention. As announced in the 2019 roadmap, Flutter wants to expand to platforms beyond mobile (such as Mac/Web) but still wants to provide the most native experience possible. This could be easily improved by providing a more open ImageFilter API to give developers the power to customize blur effects.

In order to add a iOS like blur effect in CSS, apple is using the backdrop-filter: blur(20px) saturation(180%) property. It´s particulary important to have control over the saturation to achive a high similarity to the iOS/MacOS translucency.

No saturation:
no_saturation

With saturation:
with_saturation

Most of the effects defined in UIBlurEffect.Style could be recreated when providing a saturation filter.

Similar issues like this by @matthew-carroll
or this question on stackoverflow show that these APIs are requested for a long time. I am curious if the Flutter team is currently working on improving blur and how those APIs would look like since Hummingbird needs support for this as well.

Metadata

Metadata

Assignees

No one assigned

    Labels

    P3Issues that are less important to the Flutter projectc: new featureNothing broken; request for a new capabilitycustomer: crowdAffects or could affect many people, though not necessarily a specific customer.engineflutter/engine related. See also e: labels.f: cupertinoflutter/packages/flutter/cupertino repositoryframeworkflutter/packages/flutter repository. See also f: labels.team-designOwned by Design Languages teamtriaged-designTriaged by Design Languages team

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions