![](/img/trans.png)
[英]Why the wrap buttons block by the below components in react-native?
[英]React Native Maps , components below map are displayed above map and not below it
我正在嘗試反應本機地圖,我想在地圖下方顯示文本字段和其他組件,但所有組件都顯示在地圖上方
ContactComponent-(在我正在使用地圖組件的地方,並且它下面要顯示其他組件)
render() {
return (
<View style={styles.container}>
<MapComponent />
<Text>Akas</Text>
</View>
);
}
MapComponent-
render() {
return (
<View style={styles.container}>
<MapView
provider={PROVIDER_GOOGLE} // remove if not using Google Maps
style={styles.map}
initialRegion={{
latitude: 19.15384,
longitude: 72.92902,
latitudeDelta: 0.0922,
longitudeDelta: 0.0421
}}
>
<Marker
coordinate={{
latitude: 19.15384,
longitude: 72.92902
}}
title={"Hello"}
description={"desc"}
/>
</MapView>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
...StyleSheet.absoluteFillObject,
height: 200,
width: 400,
justifyContent: "flex-end",
alignItems: "center"
},
map: {
...StyleSheet.absoluteFillObject
}
});
StyleSheet.absoluteFillObject
內容基本相同:
position:absolute,
top: 0,
left: 0,
...
當組件處於絕對位置時,它會與正常的布局流程分離(就像在CSS中一樣),因此請盡量不要將其用於地圖。 而是使用flex:1,
或width: 100%
等。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.