我正在尝试在地图的中间和中间叠加一些元素,但无济于事。到目前为止,我已经尝试按照文档中所述使用“ OverlayComponent”
<button onClick={()=>home.renderNewCard()}>New</button>
render() {
return (
<MapView
region={this.state.region}
/>
<OverlayComponent
style={{position: “absolute”, bottom: 50}}
/>
);
}
似乎不再将该组件导出为
react-native-maps
import MapView, { OverlayComponent } from 'react-native-maps';
的收益率不确定。
有什么想法吗?我对如何处理这个问题感到茫然。
我尝试将OverlayComponent
设置为View
的情况下在地图上覆盖pointerEvents
,但是尝试覆盖的元素之一需要捕获输入,特别是TextInput尝试变成搜索栏。
谢谢邦格
答案 0 :(得分:1)
react-native-maps
有一个<Overlay>
Component API。这似乎仅适用于图像。
为什么不通过完全放置TouchableOpacity
并将其包裹在<View>
中来覆盖import { Text, TouchableOpacity, View } from 'react-native';
import MapView from 'react-native-maps';
...
render() {
return (
<View style={styles.container}>
<MapView
style={styles.map}
...
/>
<TouchableOpacity style={styles.overlay}>
<Text style={styles.text}>Touchable Opacity</Text>
</TouchableOpacity>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
},
map: {
...StyleSheet.absoluteFillObject,
},
overlay: {
position: 'absolute',
bottom: 50,
backgroundColor: 'rgba(255, 255, 255, 1)',
},
});
:
{{1}}
答案 1 :(得分:1)
我们服用了mapbox药,整个团队的生活在很多方面都比以前更好了:)