Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/rit3zh/expo-backdrop/llms.txt

Use this file to discover all available pages before exploring further.

expo-backdrop targets iOS and Android. Both components throw an error if rendered on web because native compositing APIs are not available in a browser environment. The sections below describe per-platform behaviour, minimum OS requirements, and known limitations you should account for in your app.

​
iOS

BlurView — iOS 13 and later. Backed by UIVisualEffectView with a UIViewPropertyAnimator that interpolates fractional intensity values between no blur and the full material. The compositor keeps the backdrop live at essentially zero CPU cost per frame — no backdrop capture happens in your process. GaussianBlurView — iOS 13 and later. Backed by a SwiftUI UIHostingController that applies the .blur(radius:opaque:) modifier to its children. Blurs the view’s own rendered children, not the backdrop behind the view. All 21 system materials are available on iOS 13+. The full UIBlurEffect.Style surface was introduced in iOS 13 alongside the system-wide dark mode, so there are no partial availability concerns for any supported Expo SDK target. tvOS — only five legacy materials are functional on tvOS. The TintStyle enum maps every adaptive material onto its nearest legacy equivalent:
  • systemUltraThinMaterial, systemThinMaterial, systemMaterial, systemThickMaterial, systemChromeMaterial, default, and regular → .regular
  • extraLight → .extraLight
  • light and all …MaterialLight variants → .light
  • dark and all …MaterialDark variants → .dark
  • prominent → .prominent

​
Android

BlurView — all Android versions supported by the Expo SDK. Uses a frame-by-frame backdrop capture and multi-pass Gaussian blur implemented via the qmdeve BlurView library. See the Android Tuning guide for performance and quality controls. GaussianBlurView — requires API 31 (Android 12) or higher. Uses RenderEffect.createBlurEffect, which was introduced in API 31. On devices running API 30 or lower, the view renders its children without any blur effect and logs a warning to logcat — it does not crash.
GaussianBlurView will not render a blur effect on Android devices below API 31 (Android 12). If your minimum supported Android API is lower than 31, guard GaussianBlurView usage with an API level check or use BlurView as a fallback.

​
Web

Both BlurView and GaussianBlurView throw an unsupported error when rendered in a web environment. The .web.tsx implementations deliberately throw so that the error surface is clear rather than silently rendering nothing. Guard both components with a platform check before rendering: 
import { Platform } from 'react-native';
import { BlurView } from 'expo-backdrop';

{Platform.OS !== 'web' && (
  <BlurView intensity={60} style={{ borderRadius: 16, padding: 16 }} />
)}
If you need a visually similar frosted effect on web, backdrop-filter: blur(…) via a style prop on a plain View works in modern browsers, but it must be applied outside of expo-backdrop.

​
Expo Go

Expo Go is not supported. expo-backdrop includes native iOS and Android modules that Expo Go does not include in its pre-built binary. You must use a development build created with expo prebuild followed by expo run:ios or expo run:android, or use the bare workflow.

​
Detox testing

The iOS BlurView includes a Detox detection guard. When Detox test arguments are detected in the launch environment, the UIViewPropertyAnimator is bypassed and the blur effect is set directly on the UIVisualEffectView without animation. This prevents the animator’s asynchronous completion from causing test flakiness when Detox queries view state immediately after an interaction.

Build docs developers (and LLMs) love

Get started for freeTalk to us