I don't use this module anymore, and don't have time to maintain it. I've been handing out both github and npm write access to folks that seem interested, so feel free to ask.
CMMotionManager wrapper for react-native, exposing Accelerometer, Gyroscope, and Magnetometer.
npm install react-native-motion-manager@latest --save
- In XCode, in the project navigator, right click
Libraries
➜Add Files to [your project's name]
- Go to
node_modules
➜react-native-motion-manager
and addRNMotionManager.xcodeproj
- In XCode, in the project navigator, select your project. Add
libRNMotionManager.a
to your project'sBuild Phases
➜Link Binary With Libraries
- Click
RNMotionManager.xcodeproj
in the project navigator and go theBuild Settings
tab. Make sure 'All' is toggled on (instead of 'Basic'). Look forHeader Search Paths
and make sure it contains both$(SRCROOT)/../react-native/React
and$(SRCROOT)/../../React
- mark both asrecursive
. - Run your project (
Cmd+R
)
If you get stuck, take a look at Brent Vatne's blog. He was gracious enough to help out on this project, and his blog is my go to reference for this stuff.
var {
Accelerometer,
Gyroscope,
Magnetometer
} = require('NativeModules');
var {
DeviceEventEmitter // will emit events that you can listen to
} = React;
Accelerometer.setAccelerometerUpdateInterval(0.1); // in seconds
DeviceEventEmitter.addListener('AccelerationData', function (data) {
/**
* data.acceleration.x
* data.acceleration.y
* data.acceleration.z
**/
});
Accelerometer.startAccelerometerUpdates(); // you'll start getting AccelerationData events above
Accelerometer.stopAccelerometerUpdates();
Gyroscope.setGyroUpdateInterval(0.1); // in seconds
DeviceEventEmitter.addListener('GyroData', function (data) {
/**
* data.rotationRate.x
* data.rotationRate.y
* data.rotationRate.z
**/
});
Gyroscope.startGyroUpdates(); // you'll start getting GyroscopicData events above
Gyroscope.stopGyroUpdates();
Magnetometer.setMagnetometerUpdateInterval(0.1); // in seconds
DeviceEventEmitter.addListener('MagnetometerData', function (data) {
/**
* data.magneticField.x
* data.magneticField.y
* data.magneticField.z
**/
});
Magnetometer.startMagnetometerUpdates(); // you'll start getting MagnetomerData events above
Magnetometer.stopMagnetometerUpdates();
This repo contains an example react-native app to help get you started. Source code here.