React Native Maps 自定义标记 (Android)

Question

我试图让标记在地图上居中，同时在标记周围拖动地图，就像优步在用户尝试选择位置时所做的那样。下面的代码在 IOS 上完美运行，但标记在 Android 上被隐藏了我想，如何解决 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

我用过类似的东西

<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>

并使用此样式`

[![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

您的代码在 Android 和 IOS 上应该可以正常工作，您只是犯了一个简单的错误，您将自定义标记包装在 MapView 中，您只需将其移到外面，一切都会正常就像一个魅力。

React Native Maps 自定义标记 (Android)

React Native Maps Custom marker (Android)

android

google-maps-markers

react-native

react-native-maps