A React Native module that provides device orientation angles (pitch, roll, yaw) using quaternion data with optional angle smoothing. Works for both iOS and Android.
- Provides pitch, roll, and yaw from device motion
- Uses Core Motion (iOS) and SensorManager (Android)
- Supports optional low-pass filtering using configurable
alphavalue - Easy subscription-based API
yarn add react-native-filtered-orientation
# For RN >= 0.60
cd ios && pod installimport { orientationAngle } from 'react-native-filtered-orientation'
orientationAngle.subscribe((angles) => {
console.log(angles) // { pitch: number, roll: number, yaw: number }
})orientationAngle.unsubscribe()Set how often orientation updates are emitted (in milliseconds).
orientationAngle.setUpdateInterval(100) // 100msorientationAngle.getUpdateInterval((ms) => {
console.log('Current interval:', ms)
})Set the smoothing factor (alpha) for pitch, roll, and yaw.
A higher alpha means smoother but slower-to-react values.
orientationAngle.setAlpha(0.8) // Range: 0.0 to 1.0, default is 0.8orientationAngle.getAlpha((alpha) => {
console.log('Current alpha:', alpha)
})import { useEffect } from 'react'
import { orientationAngle } from 'react-native-filtered-orientation'
export const useOrientationAngle = () => {
useEffect(() => {
orientationAngle.setUpdateInterval(300)
orientationAngle.setAlpha(0.75)
orientationAngle.subscribe((angles) => {
console.log('Orientation:', angles)
})
return () => {
orientationAngle.unsubscribe()
}
}, [])
}The angles object returned from subscribe() looks like:
{
pitch: number, // In degrees
roll: number, // In degrees
yaw: number // In degrees
}- ✅ iOS (Core Motion)
- ✅ Android (SensorManager)
- 🔲 Web (not supported)
- Make sure motion permissions are handled on iOS 13+ (e.g.
NSMotionUsageDescription) - Filtering (
alpha) is applied only if you use the native module directly. If you compute angles in JS, apply your own smoothing.