react-native-sensors

Supported React Native Versions

Cool Projects using react-native-sensors

• react-native-live-translator
• imagination-react-native
• react-native-game-engine-handbook
• react-native-iridescent
• FlyThru

Do you want your project listed here? Just send a PR.

Getting started

$ npm install react-native-sensors --save

Automatic installation

$ react-native link react-native-sensors

Option: With CocoaPods (iOS only)

Add the following to your Podfile and run $ pod install:

pod 'RNSensors', :path => '../node_modules/react-native-sensors'

Manual installation

iOS

1. In XCode, in the project navigator, right click Libraries ➜ Add Files to [your project's name]
2. Go to node_modules ➜ react-native-sensors and add RNSensors.xcodeproj
3. In XCode, in the project navigator, select your project. Add libRNSensors.a to your project's Build Phases ➜ Link Binary With Libraries
4. Run your project (Cmd+R)<

Android

1. Open up android/app/src/main/java/[...]/MainApplication.java

• Add import com.sensors.RNSensorsPackage; to the imports at the top of the file
• Add new RNSensorsPackage() to the list returned by the getPackages() method

2. Append the following lines to android/settings.gradle:

   include ':react-native-sensors'
   project(':react-native-sensors').projectDir = new File(rootProject.projectDir, 	'../node_modules/react-native-sensors/android')

3. Insert the following lines inside the dependencies block in android/app/build.gradle:

     implementation project(':react-native-sensors')

Running on Simulator

• iOS simulators currently have no support for sensors. In order to retrieve any sensor output, you must develop on a real device
• Android simulators offer support for some sensors. This article documents how to use them (see "Virtual Sensors" section)

Usage

RxJS API

import {
  Accelerometer,
  Gyroscope,
  setUpdateIntervalForType
} from "react-native-sensors";

setUpdateIntervalForType("Accelerometer", 400); // defaults to 100ms
const accelerationObservable = new Accelerometer();

// Normal RxJS functions
const subscription = accelerationObservable
  .map(({ x, y, z }) => x + y + z)
  .filter(speed => speed > 20)
  .subscribe(
    speed => console.log(`You moved your phone with ${speed}`),
    error => {
      console.log("The sensor is not available");
    }
  );

setTimeout(() => {
  // If it's the last reference to an Accelerometer
  // we will stop the native API
  subscription.unsubscribe();
}, 1000);

Decorator usage

import React, { Component } from "react";
import { Text, View } from "react-native";
import {
  decorator as sensors,
  setUpdateIntervalForType
} from "react-native-sensors";

setUpdateIntervalForType("Accelerometer", 400);

function MyComponent({ sensorsFound, Accelerometer, Gyroscope }) {
  if (!Accelerometer || !Gyroscope) {
    // One of the sensors is still initializing
    return null;
  }

  return (
    <View style={styles.container}>
      <Text style={styles.welcome}>
        {(sensorsFound["Accelerometer"] &&
          `Acceleration has value: ${Accelerometer}`) ||
          "Acceleration is not available"}
        {(sensorsFound["Gyroscope"] && `Gyro has value: ${Gyroscope}`) ||
          "Gyro is not available"}
      </Text>
    </View>
  );
}

export default sensors({
  Accelerometer: true,
  Gyroscope: true
})(MyComponent);

FAQ

Accelerometer and/or Gyroscope show strange values

It seems like iOS and Android have these two swapped from what the common understanding of what an Accelerometer or a Gyroscope is. It might make sense to swap them to see if they now fit your perception. We chose against switching them out because we want to stay in line with the rest of the industy.

Changelog

Please see the changelog here

Credits

This project is inspired by the react-native-sensor-manager and by the react-native-motion-manager. Both have similar solutions with a non-uniform interface and this project aims to unify both.

Contributing

• We use semantic-release for the deployment of new versions, so please stick to this format

Contributors

Thanks goes to these wonderful people (emoji key):

Daniel Schmidt 💻	Noitidart 📖	Christophe Lemonnier 💻	Gennady 📖	Jiaming Lu 💻	Alex Wasner 💻	Nam Đàm 💻
Mike Knapp 💻	Kevin Gonnord 💻	ImAtome 💻	Lisa Huynh 💻	Cory Smith 💻	Esa-Matti Suuronen 💻	Viet Nguyen 💻
Simon Bengtsson 💻	maxkomarychev 💻	Alexander Baygeldin 💻	Noane Dan 💻	David Escalera 💬 💻	Ethan Neff 💻	Manuel Alabor 💻
Michael Elsdörfer 💻	jmichalc 💻

This project follows the all-contributors specification. Contributions of any kind welcome!