Giter VIP home page Giter VIP logo

react-native-estimote-proximity's Introduction

react-native-estimote-proximity

React Native wrapper for Estimote Proximity SDK.

You can read more about Estimote Proximity on developer.estimote.com.

Installation

$ npm install react-native-estimote-proximity --save
$ react-native link react-native-estimote-proximity

On iOS, you also need to add Estimote Proximity SDK and its dependencies to your app's Xcode project. The easiest way to do that is via CocoaPods:

  1. Install CocoaPods: https://cocoapods.org

  2. In the ios directory of your app, add a Podfile with this content:

    platform :ios, '10.0'
    
    target 'NAME_OF_YOUR_APP' do
      pod 'EstimoteProximitySDK'
    end

    The NAME_OF_YOUR_APP is usually the same thing you used with react-native init.

  3. Inside the ios directory, run:

    $ pod --repo-update install
    

On Android, you need to bump the minSdkVersion of your app to 18, since that's the lowest Estimote Proximity SDK supports. In the android/app/build.gradle file: find minSdkVersion 16 and change it to 18.

Location permission

Since detecting proximity to Bluetooth beacons gives you some idea of the user's location, both iOS and Android require that the user agrees to that, even though we're not actually using GPS or the likes. Location services must also be globally enabled in the system.

import * as RNEP from 'react-native-estimote-proximity'

// this will trigger a popup with "allow this app to access your location?"
RNEP.locationPermission.request()
  .then(permission => { // this is the user's decision
    // permission can be equal to:
    // * RNEP.locationPermission.DENIED - proximity detection won't work
    // * RNEP.locationPermission.WHEN_IN_USE - only when the app is active
    // * RNEP.locationPermission.ALWAYS - even when the app is not active
  })

On iOS, you also need to make sure you have the following entries in your app's Info.plist file: (you'll usually find it at ios/APP_NAME/Info.plist)

<key>NSLocationWhenInUseUsageDescription</key>
<string>We'll show you things near you in the app.</string>
<key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
<string>We'll show you things near you in the app. With "always" access, we'll
        also send you notifications when you're near something interesting.</string>

These are the messages that iOS will show as part of the location permission popup.

On Android, you need to bump the targetSdkVersion of your app to 23, since that's when the new permissions system was introduced. In the android/app/build.gradle file: find targetSdkVersion 22 and change it to 23.

Background support

Other than obtaining the ALWAYS location permission, there's just a little bit more to do if you want your app to keep getting the enter/exit/change callbacks in the background.

On iOS, you need to:

  1. Open the Xcode project.
  2. Click on the top-level item in the project navigator to access the project settings.
  3. Make sure your app is selected in the "TARGETS" section.
  4. Go to the "Capabilities" tab.
  5. Enable "Background Modes" and check "Uses Bluetooth LE accessories".

On Android, you need to:

  1. Make sure your target API level is at least 23.
    • In the android/app/build.gradle file: find targetSdkVersion 22 and change it to 23.
  2. [TBD]

Usage & examples

Check example/index.js for a quick run-down of how to use this library.

You can run the example app with the usual react-native run-android and run-ios. Note that iOS and Android simulators don't support Bluetooth, so you need to run it on a physical device.

To run the example on iOS, you also need to install pods (dependencies) first:

  1. Install CocoaPods: https://cocoapods.org

  2. Inside the example/ios directory, run:

    $ pod --repo-update install
    

Contact & feedback

Let us know your thoughts, feedback, and questions on forums.estimote.com.

react-native-estimote-proximity's People

Contributors

heypiotr avatar timsatterfield avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.