React Native Maps Custom marker (Android)

Question

I am trying to keep the marker centered on the map, while dragging the map around the marker, like how Uber does it, when a user is trying to choose a location. the below code work perfectly on IOS but the marker is getting hidden on Android I think, How can I solve this issue for Android?

<View style={styles.map}>
           <MapView
                region={this.getMapRegion()}
                 style={styles.map}
                 provider={PROVIDER_GOOGLE}
                 mapType="standard"
                 onRegionChangeComplete={(region) => this.setState({
                      atitude: region.latitude, longitude: region.longitude,
                      latitudeDelta: region.latitudeDelta, longitudeDelta: region.longitudeDelta
                        })} >
                        <View style={{
                            left: '50%',
                            marginLeft: -24,
                            marginTop: -48,
                            position: 'absolute',
                            top: '50%',}}>
                            <Image
                                style={{
                                    resizeMode: 'contain',
                                    height: 60, width: 60,
                            }} source={require('../../assets/fake-marker.png')} />
                        </View>
                    </MapView>
                </View>

Answer 1

i used something like that

<View style ={styles.container}>

        <MapView
            showsUserLocation
            showsMyLocationButton
            style={styles.map}
            onRegionChangeComplete={this.onRegionChange.bind(this)}
            region={this.state.region}

        >         
        </MapView>
        <View
        style={{ flex:1,
        flexDirection:'row',
        alignItems:'center',
        justifyContent:'center'}} pointerEvents="none">
          <Image style={styles.marker} source=require("./../../assets/pic/my_loc.png")} />
        </View>
   </View>

and use this styles`

[![container: {    
      flex:1,
      left: 0,
      right: 0,
      bottom: 0,
      justifyContent: 'flex-end',
      alignItems: 'center',
    },
    map: {
      position: 'absolute',
      top: 0,
      left: 0,
      right: 0,
      bottom: 0,
    },
    marker: {
      height: 48,
      width: 48,

    },`][1]][1]

Answer 2

Your code should work fine on Android and IOS, you just made a simple mistake you wrapped up your custom marker inside the MapView, you just need to move it outside and everything will work like a charm.