A lightweight React Native library that detects shake gestures on both iOS and Android. Built with support for React Native's New Architecture (Turbo Modules).
Works best on real devices β shake detection is limited in simulators/emulators.
If this project helps you, consider buying me a pizza π
| Minimum | |
|---|---|
| iOS | iOS 13.0+ |
| Android | API 21+ (Android 5.0) |
| React Native | 0.68+ |
- π± Cross-Platform: Works on both iOS and Android
- β‘ New Architecture: Built with Turbo Module support
- π· TypeScript: Full TypeScript definitions included
- πͺΆ Lightweight: Minimal footprint, no heavy dependencies
- π Simple API: Subscribe and unsubscribe with one call each
npm install react-native-shakeor
yarn add react-native-shakeRun pod install after installing the package:
cd ios && pod installNo additional configuration required. The library links automatically via autolinking (React Native 0.60+).
import React from 'react';
import RNShake from 'react-native-shake';
export const MyComponent = () => {
React.useEffect(() => {
const subscription = RNShake.addListener(() => {
// Your shake handler here...
});
return () => {
subscription.remove();
};
}, []);
return null;
};import RNShake from 'react-native-shake';
// For v4.x.x:
class MyComponent extends React.Component {
componentDidMount() {
RNShake.addListener(() => {
// Your code...
});
}
componentWillUnmount() {
RNShake.removeListener();
}
}
// For v3.x.x and below:
class MyComponent extends React.Component {
componentDidMount() {
RNShake.addEventListener('ShakeEvent', () => {
// Your code...
});
}
componentWillUnmount() {
RNShake.removeEventListener('ShakeEvent');
}
}Registers a listener for the shake event. Returns a subscription object.
| Parameter | Type | Description |
|---|---|---|
callback |
() => void |
Function called when a shake is detected |
Returns: EmitterSubscription β call .remove() to unsubscribe.
const subscription = RNShake.addListener(() => {
console.log('Device shaken!');
});
// Later, to unsubscribe:
subscription.remove();Removes all active shake event listeners.
RNShake.removeAllListeners();Configures how much force is required to trigger a shake event. Android only β has no effect on iOS, which relies on the system's built-in shake gesture.
| Parameter | Type | Description |
|---|---|---|
sensitivity |
number |
Required shake force, as a multiple of Earth's gravity. Lower values trigger more easily. |
Reference points: 0.75 (light), 1.33 (normal, default), 1.8 (heavy) β or pass any custom value.
RNShake.configure(1.8); // require a harder shakeThis package includes full TypeScript definitions. Import and use it directly with type safety:
import RNShake from 'react-native-shake';
import type { EmitterSubscription } from 'react-native';
const subscription: EmitterSubscription = RNShake.addListener(() => {
console.log('Shake detected!');
});See the contributing guide to learn how to contribute to the repository and the development workflow.
MIT
