3

Hi I am new to react native. I just made a new application. When I don't have a map component in my application and my other components work fine. However when I add this in my render(){return(..

  <MapView
    ref={ref => { this.map = ref; }}
    mapType={MAP_TYPES.TERRAIN}
    style={styles.map}
    initialRegion={this.state.region}
    onRegionChange={region => this.onRegionChange(region)}
  />

I get the error:

enter image description here

I did a search of the project folder to find a AndroidMainfest.xml and I found a couple. I changed the one in: \android\app\build\intermediates\manifests\full\debug

from this:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.pickup_sports_app"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="16"
        android:targetSdkVersion="22" />

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" />
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" /> <!-- Include required permissions for Google Maps API to run. -->
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

    <uses-feature
        android:glEsVersion="0x00020000"
        android:required="true" />

    <android:uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <android:uses-permission android:name="android.permission.READ_PHONE_STATE" />
    <android:uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

    <application
        android:name="com.pickup_sports_app.MainApplication"
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="com.pickup_sports_app.MainActivity"
            android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
            android:label="@string/app_name"
            android:windowSoftInputMode="adjustResize" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
        <activity
            android:name="com.google.android.gms.common.api.GoogleApiActivity"
            android:exported="false"
            android:theme="@android:style/Theme.Translucent.NoTitleBar" />

        <meta-data
            android:name="com.google.android.gms.version"
            android:value="@integer/google_play_services_version" />
    </application>

</manifest>

To this:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.pickup_sports_app"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="16"
        android:targetSdkVersion="22" />

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" />
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" /> <!-- Include required permissions for Google Maps API to run. -->
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

    <uses-feature
        android:glEsVersion="0x00020000"
        android:required="true" />

    <android:uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <android:uses-permission android:name="android.permission.READ_PHONE_STATE" />
    <android:uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

    <application
        android:name="com.pickup_sports_app.MainApplication"
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="com.pickup_sports_app.MainActivity"
            android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
            android:label="@string/app_name"
            android:windowSoftInputMode="adjustResize" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
        <activity
            android:name="com.google.android.gms.common.api.GoogleApiActivity"
            android:exported="false"
            android:theme="@android:style/Theme.Translucent.NoTitleBar" />

        <meta-data
            android:name="com.google.android.gms.version"
            android:value="@integer/google_play_services_version" />
        <meta-data
            android:name="com.google.android.geo.API_KEY"
            android:value="AIzaSyC-V3J1Wz4wqgHqrqffIeZqhVM0gDfTsIg" />

    </application>

</manifest>

I even just tried it with only the meta-deta API Key one.

Some other information: I got the API key from here: https://developers.google.com/maps/documentation/android-api/signup.

After I changed it I just saved the file and restarted the simulator restarted the app with react-native run-android in the directory with command prompt. I'm not sure if this is the correct way to "Rebuild" the project.

I am using the Airbnb react-native-maps component that Facebook recommends using: https://github.com/airbnb/react-native-maps

I did the npm install react-native-maps --save and react-native link react-native-maps recently because this is a brand new project (error in the new version they provide or something?). The emulator is android 7.1.1.

Here is the SDK Manager for the android studio simulator: enter image description here

2 Answers 2

2

You are doing the correct change of adding the API_KEY element. However, edit the file at location:

\android\app\\**src**\main (Source directory)

instead of

\android\app\\**build**\intermediates\manifests\full\debug (Build directory)
Sign up to request clarification or add additional context in comments.

1 Comment

I've added API_KEY at right place in right file, but I'm still getting the same error
0

Try to delite from manifest this:

<meta-data android:name="com.google.android.gms.version" android:value="@integer/google_play_services_version"/>

This data you can move to build.gradle config in chapter dependencies:

compile 'com.google.android.gms:play-services-maps:10.0.1'compile 'com.google.android.gms:play-services-ads:10.0.1'

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.