npm.io
0.1.0 • Published 21h ago

expo-motion-blur

Licence
MIT
Version
0.1.0
Deps
0
Size
387 kB
Vulns
0
Weekly
0
Stars
35

expo-motion-blur

Native Motion Blur for Android & iOS

https://github.com/user-attachments/assets/77cb3937-59c4-4eb8-b522-1c9b5352c7aa

Installation

npx expo install expo-motion-blur

This package contains native code and requires a development build. It is not supported in Expo Go.

Usage

Wrap any moving content in MotionBlurView. The blur follows the view's on-screen velocity, whatever is driving it.

import { MotionBlurView } from 'expo-motion-blur';

<MotionBlurView intensity={40} speedForMaxBlur={1500}>
  <Card />
</MotionBlurView>;

API

MotionBlurView accepts all View props, plus the following:

Prop Type Default Description
intensity number 40 Maximum streak length, in points, on each side of the content.
speedForMaxBlur number 1500 Speed, in points per second, at which intensity is reached.
samples number 32 Texture reads per pixel (4–64). Higher values are smoother but cost more.
enabled boolean true When false, children render as in a plain View.
live boolean false Re-captures children every frame. Use for content that changes mid-motion.

Platform support

Platform Behavior
iOS / tvOS 16.4+ Per-pixel Metal shader
Android 13+ Per-pixel runtime shader
Android 12 Directional blur along the view's center of motion
Android 11 and below, Web No blur; children render normally

License

MIT

Keywords