1. npm install
打开终端进入目标项目文件夹下,执行npm install react-native-amap-location --save
2. Gradle 设置
进入项目文件夹下android目录下settings.gradle文件,加上如图标出的语句.
include ':reactamaplocation'
project(':reactamaplocation').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-amap-location')
3. 更新App Gradle编译设置
进入项目文件夹下android/app/build.gradle,打开文件
4. 注册React Package
进入项目进入项目文件夹android/app/src/main/java..下MainActivity.java文件
import com.xiaobu.amap.AMapLocationReactPackage;
...//不要忘记导入包
@Override
protected List getPackages() {
returnArrays.asList(
newMainReactPackage(),
newAMapLocationReactPackage());// <-- Register package here
}
5. 添加地图Service,Appkey和权限配置
进入项目进入项目文件夹android/app/src/main下的XML文件
android:value="一定要输入自己申请的key值".下面会讲如何申请key值.
6. 高德地图key值申请
这里提供给你们一个申请key值得链接http://lbs.amap.com/,进入这个网站,按照提示注册账号,然后进入[控制台]
大致会看到下图的界面.
点击创建新应用,这里创建一个test应用,点击添加新key值
根据自己需要设置,上述所说针对Android平台
SHA1的值需要自己获取.这里提供一种方式,IDE,电脑系统不同获取方式也可能不同,可以自己百度查看如何获取.
http://lbs.amap.com/api/android-location-sdk/guide/creat-project/get-key/#sha1
Package需要和自己设置的包名一致,最简单的方式查看这个文件,填写Package.
7. 使用实例
import AMapLocation from'react-native-amap-location';
...
componentDidMount() {
this.unlisten = AMapLocation.addEventListener((data) => console.log('data', data));
AMapLocation.startLocation({
accuracy:'HighAccuracy',
killProcess:true,
needDetail:true,
});
}
componentWillUnmount() {
AMapLocation.stopLocation();
this.unlisten();
}
...
代码就是这么简单,console打印出来的信息格式如下
可以根据自己需要的参数通过data.latitude这种格式获得.
