Map shows correctly and so does location in EMULATOR. Built app crashes on MapView

Expo CLI 3.28.2 environment info:
System:
OS: Windows 10 10.0.19041
Binaries:
Node: 15.2.1 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.10 - C:\Users\Fresqui\AppData\Roaming\npm\yarn.CMD
npm: 6.14.8 - C:\Program Files\nodejs\npm.CMD
npmPackages:
expo: ^39.0.4 => 39.0.5
react: 16.13.1 => 16.13.1
react-dom: 16.13.1 => 16.13.1
react-native: https://github.com/expo/react-native/archive/sdk-39.0.4.tar.gz => 0.63.2
react-native-web: ~0.13.12 => 0.13.18
Expo Workflow: managed

My map works perfectly on the emulator, showing the actual location and map working.
As soon as the map should show in the apk, it crashes and restarts the app.

I’ve configured a separate screen to isolate the issue. I’ve added a text that says “Longitude” and “Latitude”, and it shows the numbers, ergo location is working.

In this screen I’ve made to test the issue, as soon as I click the open map button the app reloads. If I click the map button, a map renders but doesn’t go to the location position.
2
2720×1280 47 KB

Does anybody know anything about this? I’m sure I’ve already configured the API key correctly but maybe I missed something?

import React, { useState, useEffect } from ‘react’;
import {Text, View, TouchableOpacity, Modal} from ‘react-native’;
import * as Location from ‘expo-location’;
import MapView, { PROVIDER_GOOGLE } from ‘react-native-maps’;
import { Marker } from ‘react-native-maps’;
import Geojson from ‘react-native-geojson’;
//
export default function App() {
const [location, setLocation] = useState(null);
const [errorMsg, setErrorMsg] = useState(null);
const [elMapa, setelMapa] = useState(null);
useEffect(() => {
(async () => {
let { status } = await Location.requestPermissionsAsync();
if (status !== ‘granted’) {
setErrorMsg(‘Permission to access location was denied’);
}
//
let location = await Location.getCurrentPositionAsync({});
setLocation(location);
})();}, );
//
var lat = null;
var long = null;
let text = ‘Waiting…’;
//
if (errorMsg) {
text = errorMsg;
} else if (location) {
text = JSON.stringify(location);
lat = location.coords.latitude
long = location.coords.longitude
}
//
return (

<TouchableOpacity style={{alignSelf: “center”, margin: “20%%”}} onPress={() => {setelMapa(true)}}>
Mapa6

{location == null &&
No hay ubicación
}
{location != null &&
Latidude: {lat}
Longitude: {long}
}
//
<Modal visible={elMapa}
animationType=“fade”
transparent={true}
onRequestClose={() => {setelMapa(false)}}>

{location != null && <MapView
style={{height: “70%%”, width: “100%%” }}
provider={PROVIDER_GOOGLE}
showsUserLocation
//customMapStyle={mapStyle}
initialRegion={{
latitude: -34.603,
longitude: -58.3952,
latitudeDelta: 0.0222,
longitudeDelta: 0.0121}}>
<Marker coordinate={{latitude: lat,longitude: long,latitudeDelta: 0.0222,longitudeDelta: 0.0121}}image={require(’…/assets/home.png’)}/>
}
{/* {text} */}



);}

app.json

{
“expo”: {
“name”: “Multicobertura”,
“slug”: “Multicobertura”,
“version”: “1.0.0”,
“orientation”: “portrait”,
“icon”: “./assets/favicon.png”,
“splash”: {
“image”: “./assets/splash.png”,
“backgroundColor”: “#C20F2F”
},
“updates”: {
“fallbackToCacheTimeout”: 0
},
“assetBundlePatterns”: [
“**/*”
],
“ios”: {
“supportsTablet”: true
},
“web”: {
“favicon”: “./assets/favicon.png”
},
“android”: {
“package”: “com.cratag.Multicobertura”,
“config”: {
“googleMaps”: {
“apiKey”: “Key I’ve got from google”
}
}
}
}
}

I’ve made a post in the expo forums but they couldn’t help me.

Please tell me if there’s anything else I can update for you. Thanks in advance

1 possible answer(s) on “Map shows correctly and so does location in EMULATOR. Built app crashes on MapView

    1. expo init a new app,
    2. expo install react-native-maps in it
    3. Edit app.js with the expo mapview example code
    4. expo build:android -t apk
    5. Do the deploy to standalone thing (without Google Sign in configured)
      5.1(optional). I would check if everything is working in the emulator/android expo app, but that’s not needed
    6. After it’s done, expo build:android -t apk again

    Hey! Thanks a lot for the reply. I went step by step and I actually installed the APK file in my phone, tested it that way and it worked fine at first. Then, uploaded it to the Play Store and got the map to show grey. I tried with the SHA-1 cert from the Play Store and then it showed up.

    Thanks again for the reply and the help. Hopefully other people having the same issue see it here. 🙂