目次

react-native-maps

React Native Location Tracking

インストール

npm install react-native-maps --save
react-native link

Google Maps Platform ドキュメント
https://developers.google.com/maps/documentation/

Get API Key
https://developers.google.com/maps/documentation/android-sdk/signup

Step 1. Get an API key

Google Maps Platform の有効化
詳細はここ

Step 2. Add the API key to your app

native_background_timer\android\app\src\main\AndroidManifest.xml にmeta-data追加

・・・
      </activity>
      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
      ↓追加
      <meta-data
        android:name="com.google.android.geo.API_KEY"
        android:value="[STEP 1 のAPIキー]"/>
    </application>

react-native run-androidの文字化け

chcp 932をしないとreact-native run-androidが文字化けする。

エラー

FAILURE: Build failed with an exception.

* What went wrong:
Could not resolve all files for configuration ':react-native-maps:debugCompileClasspath'.
> Could not resolve com.android.support:support-compat:26.1.0.
  Required by:
      project :react-native-maps
   > Cannot find a version of 'com.android.support:support-compat' that satisfies the version constraints:
        Dependency path 'native_background_timer:react-native-maps:unspecified' --> 'com.facebook.react:react-native:0.59.1' --> 'com.android.support:appcompat-v7:28.0.0' --> 'com.android.support:support-compat:28.0.0'

native_background_timer\node_modules\react-native-maps\lib\android\build.gradleに追加 ※ファイルの場所に注意
 ↓

dependencies {
  def googlePlayServicesVersion = safeExtGet('googlePlayServicesVersion', DEFAULT_GOOGLE_PLAY_SERVICES_VERSION)
  // Variable lookup order : googlePlayServicesMapsVersion > googlePlayServicesVersion > DEFAULT_GOOGLE_PLAY_SERVICES_MAPS_VERSION
  def googlePlayServicesMapsVersion = safeExtGet('googlePlayServicesMapsVersion', safeExtGet('googlePlayServicesVersion', DEFAULT_GOOGLE_PLAY_SERVICES_MAPS_VERSION))
  def androidMapsUtilsVersion = safeExtGet('androidMapsUtilsVersion', DEFAULT_ANDROID_MAPS_UTILS_VERSION)

  compileOnly "com.facebook.react:react-native:+"
  implementation "com.google.android.gms:play-services-base:$googlePlayServicesVersion"
  implementation "com.google.android.gms:play-services-maps:$googlePlayServicesMapsVersion"
  implementation "com.google.maps.android:android-maps-utils:$androidMapsUtilsVersion"
  //↓追加しないとrunできない
  implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"  
}

react-native run-androidをするとすぐおちる

Blank map on android device #2766

> adb logcat | findstr "Google Maps Android API"  // windowsなのでgrepがない
・・・
03-29 22:27:58.592  6007  6066 E AndroidRuntime: Process: com.native_background_timer, PID: 6007
03-29 22:27:58.592  6007  6066 E AndroidRuntime: java.lang.NoClassDefFoundError: Failed resolution of: Lorg/apache/http/ProtocolVersion;
・・・

↓を参考にして native_background_timer\android\app\build.gradle に追加
Failed resolution of com.google.android.gms.maps.GoogleMapOptions #818

android {
    compileSdkVersion rootProject.ext.compileSdkVersion

・・・
    }

    defaultConfig {
        applicationId "com.native_background_timer"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 2
        versionName "1.1"
        multiDexEnabled true // ADD
    }

dependencies {
    implementation project(':react-native-maps')
    implementation ("com.google.android.gms:play-services-maps:+") { // ADD
        force = true;                                                // ADD
    }                                                                // ADD
    implementation 'com.android.support:multidex:1.0.0'              // ADD
    implementation project(':react-native-background-timer')
    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
    implementation "com.facebook.react:react-native:+"  // From node_modules

}