Skip to content

FAQs

What's the difference between this and Modifier.blur?

On Android, Modifier.blur and Haze both use the same concepts underneath, and enable blurring when running on Android 12 devices (or newer). There are some key differences though. The obvious one is multiplatform support.

Ignoring that though...

  • Haze allows selective blurring based on the rectangles provided to it. This is super useful for blurring selective pieces of content (such as any content behind top app bars).
  • Haze will automatically apply a tint color to the blurred content, in keeping with the 'glassmorpism' style. This primarily enables content to be displayed over the blurred content, with enough contrast to be visible.
  • On older devices (API 30 and below), Haze uses a fallback translucent scrim, unlike blur which is a no-op.

Are the blur implementations the same across different platforms?

Broadly speaking, we try to keep the platforms as consistent as possible, but the platforms each have their own API surfaces so what we can do on each is different (easily).

Skia backed platforms (iOS and Desktop)

The iOS and Desktop implementations are enabled by using Skia APIs directly, giving us a broad API surface to use. The Modifier.haze on these platforms largely mirrors what is documented in this blog post, using the Skia-provided guassian blur image filter, and perlin noise shader, brought together in a custom runtime shader (which also applies the tint).

Android (Jetpack Compose)

Jetpack Compose

Please note, this section refers to the Jetpack Compose implementation. Please read the Android guide if you haven't already.

On Android, we don't have direct access to the Skia APIs, therefore we need to use the APIs which are provided by the Android framework. We have access to RenderEffect.createBlurEffect for the blurring, and createColorFilterEffect for the tinting, both of which were added in API 31. A noise effect is applied using a BitmapShader drawing a tiled precomputed blue noise texture (bundled in the library). We may investigate making the noise computed on device in the future, but this will require runtime shader support, added in API 33.

Thanks to Romain Guy for the pointers.