Javascript 无法在本机映射内移动按钮
我正在尝试移动地图组件中的一个按钮。我用的是本地地图 让我给你看看我的Javascript 无法在本机映射内移动按钮,javascript,react-native,react-native-maps,Javascript,React Native,React Native Maps,我正在尝试移动地图组件中的一个按钮。我用的是本地地图 让我给你看看我的 render() { console.log(this.state) const { region } = this.state; return ( <View style={styles.container}> <MapView provider={this.props.provider} mapType="standard" style={styles.m
render() {
console.log(this.state)
const { region } = this.state;
return (
<View style={styles.container}>
<MapView
provider={this.props.provider}
mapType="standard"
style={styles.map}
showsUserLocation={true}
initialRegion={region}
>
<UrlTile
urlTemplate="XXX"
zIndex={-1}
/>
<Button style={{ borderWidth: 2, alignItems:'right',justifyContent:'right'}} title="Info" onPress={() => console.log("This is not fired")}/>
</MapView>
<View>
</View>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
},
map: {
marginTop: 20,
flex: 1,
},
});
render(){
console.log(this.state)
const{region}=this.state;
返回(
console.log(“未触发”)}/>
);
}
}
const styles=StyleSheet.create({
容器:{
弹性:1,
},
地图:{
玛金托普:20,
弹性:1,
},
});
在这种情况下,我的按钮位于地图的中间/顶部,我想将其移动到地图的中间/右侧
有什么想法吗?
谢谢首先关闭MapView组件,并将按钮按如下方式放置在其下方
<View style={{ flex: 1 }}>
<MapView
style={{ flex: 1 }}
/>
<View
style={{
position: 'absolute',//use absolute position to show button on top of the map
top: '50%', //for center align
alignSelf: 'flex-end' //for align to right
}}
>
<Button />
</View>
首先关闭MapView组件,并将按钮按如下方式放置在其下方
<View style={{ flex: 1 }}>
<MapView
style={{ flex: 1 }}
/>
<View
style={{
position: 'absolute',//use absolute position to show button on top of the map
top: '50%', //for center align
alignSelf: 'flex-end' //for align to right
}}
>
<Button />
</View>