1.1.0 • Published 6 years ago
react-native-device-heading v1.1.0
react-native-device-heading
TOC
Installation
Using npm:
npm install --save react-native-device-headingor using yarn:
yarn add react-native-device-headingLinking (For React Native <= 0.59 only)
⚠️ React Native >= 0.60 skip this as auto-linking should work
Auto
react-native link react-native-device-infoFor iOS via CocoaPods
cd ios
pod installManual
Add the following lines to your build targets in your Podfile
pod 'RNDeviceHeading', :path => '../node_modules/react-native-device-heading'Then run pod install
In XCode, in the project navigator:
- Right click
Libraries Add Files to [your project's name]- Go to
node_modules➜react-native-device-heading - Add the file
RNDeviceHeading.xcodeproj - Add
libRNDeviceHeading.ato your project'sBuild Phases➜Link Binary With Libraries - Run your project (
Cmd+R)
- Open up
android/app/src/main/java/[...]/MainActivity.java
- Add
import com.reactlibrary.RNRNDeviceHeadingPackage;to the imports at the top of the file - Add
new RNDeviceHeadingPackage()to the list returned by thegetPackages()method
- Append the following lines to
android/settings.gradle:include ':react-native-device-heading' project(':react-native-device-heading').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-device-heading/android') - Insert the following lines inside the dependencies block in
android/app/build.gradle:compile project(':react-native-device-heading')
Usage
import React, { useState, useEffect } from 'react';
import RNDeviceHeading from 'react-native-device-heading';
...
const degreesUpdateRate = 1; //number of degrees changed before callback is triggered
const [{ deviceHeading }, setDeviceHeading] = useState(0);
useEffect(() => {
RNDeviceHeading.start(degreesUpdateRate, degree => {
setDeviceHeading(degree);
});
return () => {
RNDeviceHeading.stop();
};
}, []);
...