react-native-maps / react-native-maps

React Native Mapview component for iOS + Android
MIT License
15.04k stars 4.85k forks source link

Continuous Location Marker Flickering on Android Devices #5134

Open yaminichhabra opened 1 month ago

yaminichhabra commented 1 month ago

Summary

Current location flickers continuously on Android. The location marker updates sporadically, causing a jarring user experience. This issue disrupts the visibility of the user's location, making the map unreliable for real-time navigation.

https://github.com/user-attachments/assets/85fbf0f6-d441-4848-9e11-2a1153df9617

Reproducible sample code

import React, { useEffect } from "react";
import { Dimensions, PermissionsAndroid, Platform, StyleSheet } from "react-native";
import MapView, { PROVIDER_GOOGLE } from "react-native-maps";

const styles = StyleSheet.create({
  container: {
    marginTop: -80,
    width: Dimensions.get("window").width,
    height: Dimensions.get("window").height,
  },
});

export const MapDebugScreen = function MapDebugScreen() {
  useEffect(() => {
    if (Platform.OS === 'android') {
      requestLocationPermission();
    }
  }, []);

  const requestLocationPermission = async () => {
    try {
      const granted = await PermissionsAndroid.request(
        PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION
      );
      if (granted === PermissionsAndroid.RESULTS.GRANTED) {
        console.log('You can use the location');
      } else {
        console.log('Location permission denied');
      }
    } catch (err) {
      console.warn(err);
    }
  };

  return (
    <MapView
      style={[styles.container]}
      provider={PROVIDER_GOOGLE}
      showsUserLocation={true} 
    />
  );
};

Steps to reproduce

Implement the provided sample code in a React Native project. Run the app on an Android device. Observe the location marker flickering continuously.

Expected result

The location marker should update smoothly and consistently without flickering.

Actual result

The location marker flickers continuously, leading to a poor user experience.

React Native Maps Version

1.8.0

What platforms are you seeing the problem on?

Android

React Native Version

0.63.5

What version of Expo are you using?

Not using Expo

Device(s)

Real devices (issue not replicable on simulators)

Additional information

No response

ssommelet21 commented 1 month ago

They're not going to help you. We've made tons of comments about this, for example:

https://github.com/react-native-maps/react-native-maps/issues/5112

<MapView
  liteMode={true}
/>

Is not a solution as well.