React Native Map Callout问题,地图弹出按钮点击不成功

问题描述 投票:3回答:1

我想点击的 Button 在react native的地图弹出里面,所以下面是我的代码

render() {
    console.log(TAG + "in render")
    return (
        <View style={{ flex: 1 }}>
        {                
            (this.state.coords != null) ?
            <MapView                    
                style={styles.map}
                region={this.state.mapRegion}
                showsUserLocation={true}
                followUserLocation={true}
                onRegionChange={this.onRegionChange.bind(this)}
                onPress={this.onMapPress.bind(this)}>

                    < MapView.Polyline
                    coordinates = {
                        this.state.coords
                    }
                    strokeWidth = {
                        4
                    }
                    />

                        <MapView.Marker 
                            coordinate={
                                {
                                    latitude: this.state.lastLat,
                                    longitude: this.state.lastLong,
                                }
                            } 
                            >
                            <MapView.Callout tooltip>

                            <View style={styles.bubble}> 
                            <View >
                                <Button title='Click Me!' onPress={() => alert('Click')} />
                                </View>      

                                </View>                                   
                            </MapView.Callout>
                        </MapView.Marker>

                        < MapView.Marker
                            coordinate={
                                {
                                    latitude: this.state.destination.latitude,
                                    longitude: this.state.destination.longitude,
                                }
                            }
                        />


            </MapView> :null
        }
        </View>
    );
}

我的样式表如下

const styles = StyleSheet.create({
bubble: {
    width: 140,
    justifyContent: 'center',
    alignItems: 'center',
    flexDirection: 'row',
    padding:5,
  },
    bubblecontent: {
        padding:5,
    }, 
    bubbleContentTextStyle:{
        fontSize:10,
    },
    iconContainer:{
        height:'50%',
        justifyContent: 'center',
        alignItems: 'center',            
    },
    iconStyle   :{
      height:15,
      weidth:15,
      backgroundColor: 'blue' 
    },
    map: {
        ...StyleSheet.absoluteFillObject,
    },
  });

当我在安卓系统中运行上述代码时,我没有得到点击的效果 Button 这是我放进去的 MapView.Callout.

onPress={() => alert('Click')} 

我无法获得按钮点击的提醒,任何想法,我可以得到按钮点击?所有你的建议都很感激。

android google-maps react-native android-mapview
1个回答
© www.soinside.com 2019 - 2024. All rights reserved.