Git Product home page Git Product logo

react-native-gps's Introduction

react-native-gps

Native GPS location support for React Native for Android and IOS. This module was inspired in project of timfpark and syarul. For the moment is not compatible for a PR back to one of that repositories because some methods are not implemented yet and some structure changed. Only a few methods are implemented so if you want to contribute, any contribution of new missing methods will be appreciated.

Installation

Install the npm package

npm i --save https://github.com/agrass/react-native-gps

IOS

You then need to add the Objective C part to your XCode project. Drag RNLocation.xcodeproj from the node_modules/react-native-location folder into your XCode project. Click on the your project in XCode, goto Build Phases then Link Binary With Libraries and add libRNLocation.a and CoreLocation.framework.

NOTE: Make sure you don't have the RNLocation project open separately in XCode otherwise it won't work.

Android

  • In android/settings.gradle
...
include ':RNLocation'
project(':RNLocation').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gps')
  • In android/app/build.gradle
...
dependencies {
    ...
    compile project(':RNLocation')
}
  • register module (in MainActivity.java)
import com.syarul.rnlocation.RNLocation;  // <--- import

public class MainActivity extends Activity implements DefaultHardwareBackBtnHandler {
  ......

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    mReactRootView = new ReactRootView(this);

    mReactInstanceManager = ReactInstanceManager.builder()
      .setApplication(getApplication())
      .setBundleAssetName("index.android.bundle")
      .setJSMainModuleName("index.android")
      .addPackage(new MainReactPackage())
      .addPackage(new RNLocation()) // <-- Register package here
      .setUseDeveloperSupport(BuildConfig.DEBUG)
      .setInitialLifecycleState(LifecycleState.RESUMED)
      .build();

    mReactRootView.startReactApplication(mReactInstanceManager, "example", null);

    setContentView(mReactRootView);
  }

  ......

}

Add permissions to your Project

Add this to your AndroidManifest file;

// file: android/app/src/main/AndroidManifest.xml

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

Location Usage

var React = require('react-native');
var { DeviceEventEmitter } = React;

var { RNLocation: Location } = require('NativeModules');

Location.startUpdatingLocation();

var subscription = DeviceEventEmitter.addListener(
    'locationUpdated',
    (location) => {
        /* Example location returned
        {
          speed: -1,
          longitude: -0.1337,
          latitude: 51.50998,
          accuracy: 5,
          heading: -1,
          altitude: 0,
          altitudeAccuracy: -1
        }
        */
    }
);

Methods

To access the methods, you need import the react-native-location module.

Location.requestWhenInUseAuthorization

Location.requestWhenInUseAuthorization();

This method should be called before anything else. It requests location updates while the application is open. If the application is in the background, you will not get location updates (for the moment, background work not implemented yet).

Location.startUpdatingLocation

Location.startUpdatingLocation();
var subscription = DeviceEventEmitter.addListener(
    'locationUpdated',
    (location) => {
        // do something with the location
    }
);

Location.stopUpdatingLocation

Location.stopUpdatingLocation();

License

MIT, for more information see LICENSE

react-native-gps's People

Contributors

agrass avatar alienxp03 avatar andrew-stupchuk avatar kicktheken avatar merapi avatar mischkew avatar nicinabox avatar timfpark avatar

Watchers

 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.