react-native-location-permission
Version:
A react Native module to enable location based services on Android and IOS
176 lines (140 loc) • 5.17 kB
Markdown
A react Native module to enable location based services on Android and IOS.
<img src="https://raw.githubusercontent.com/Amenulhaq/react-native-location-permission/master/preview/previewAndroid.gif" width="200" /> <img src="https://raw.githubusercontent.com/Amenulhaq/react-native-location-permission/master/preview/previewIOS.gif" width="193" />
- react-native >= 0.38.0
- android buildToolsVersion 26.0.1
- gradle build tools 2.3.3
1. ```npm install react-native-location-permission```
2. add the following 2 lines to your <project>/android/settings.gradle file
```
include ':react-native-location-permission'
project(':react-native-location-permission').projectDir = new File(settingsDir, '../node_modules/react-native-location-permission/android')
```
3. add the following line to your <project>/android/app/build.gradle file
```
compile project(':react-native-location-permission')
```
4. add the "LocationSwitchPackage" import into your MainApplication.java file:
```java
import org.amen.reactnative.locationswitch.LocationSwitchPackage;
```
5. add the "LocationSwitchPackage" into your MainApplication.java file (getPackages method):
```java
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
... // your other react native packages
new LocationSwitchPackage()
);
}
```
6. add the "LocationSwitch" import into your MainActivity.java file:
```java
import org.amen.reactnative.locationswitch.LocationSwitch;
```
7. add the following code into your MainActivity.java file:
```java
@Override
public void onActivityResult(int requestCode, int resultCode, Intent data) {
super.onActivityResult(requestCode, resultCode, data);
LocationSwitch.getInstance().onActivityResult(requestCode, resultCode);
}
```
Using Pods :
1. add the following into your podfile :
```
pod 'ReactNativeLocationSwitch', :path => '../node_modules/react-native-location-permission/ios'
```
Using xcode :
1. Open the project in xCode, left click on the Libraries folder -> Add files to ... and select
```
./node_modules/react-native-location-permission/ios/RNReactNativeLocationSwitch.xcodeproj
```
2. Open the project -> Build Phases -> Link Binary With Libraries and select libRNReactNativeLocationSwitch.a
```javascript
LocationSwitch.enableLocationService(
interval,
requestHighAccuracy,
successCallback,
errorCallback
);
```
```javascript
LocationSwitch.isLocationEnabled(
successCallback,
errorCallback
);
```
Option | Default | Info
------ | ------- | ----
interval | 1000 | Update interval in ms (ignored on IOS)
requestHighAccuracy | false | If true, highest accuracy is requested. If false, "block" level accuracy is requested (ignored on IOS)
successCallback | null | Is called when the user allows access to the location services or when the location services are already enabled
errorCallback | null | Is called when the user denies access to the location services
## Usage
```javascript
import React, { Component } from 'react';
import { AppRegistry, Text, View, TouchableOpacity, StyleSheet, Alert } from 'react-native';
import LocationSwitch from 'react-native-location-permission';
const style = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
},
button: {
padding: 20,
},
text: {
fontSize: 20,
},
textSuccess: {
fontSize: 20,
color: 'green',
},
});
export default class LocationSwitchApp extends Component {
constructor(props) {
super(props);
this.state = { locationEnabled: false };
this.onEnableLocationPress = this.onEnableLocationPress.bind(this);
}
componentDidMount() {
LocationSwitch.isLocationEnabled(
() => {
Alert.alert('Location is enabled');
this.setState({ locationEnabled: true });
},
() => { Alert.alert('Location is disabled'); },
);
}
onEnableLocationPress() {
LocationSwitch.enableLocationService(1000, true,
() => { this.setState({ locationEnabled: true }); },
() => { this.setState({ locationEnabled: false }); },
);
}
renderLocationStatus() {
if (this.state.locationEnabled) {
return <Text style={style.textSuccess} >Location enabled</Text>;
}
return <Text style={style.text}>Location disabled</Text>;
}
render() {
return (
<View style={style.container}>
<TouchableOpacity style={style.button} onPress={this.onEnableLocationPress}>
<Text style={style.text}>Enable location service</Text>
</TouchableOpacity>
{this.renderLocationStatus()}
</View>
);
}
}
AppRegistry.registerComponent('reactClientSandbox', () => LocationSwitchApp);
```