问题描述
我在 Stack Manager 中有 4 个地图屏幕,可让我的用户在完成任务时查看他们的当前位置。在他们完成一项任务后,它会将他们发送到下一个地图屏幕,直到该任务完成。有时从一个地图屏幕到另一个屏幕会有大量的延迟(10 秒)。当应用重新加载它们的当前位置时,我已经实现了一个 ActivityIndicator,它会一直运行到函数挂载为止。然后,当他们导航离开时,该函数将卸载并触发下一页加载当前位置的安装,然后重复。有没有办法加快这个过程并使地图加载速度更快?
编辑:到目前为止,我已经关闭了 trackViewChanges。我目前使用的是图标,而不是我的自定义标记的图像。我尝试在开发模式下运行,看看它是否会运行得更快(根据一些报告说它会),但它并没有影响它的渲染能力。
function Screen({navigation}) {
const [user_latitude,setUserLatitude] = useState(0)
const [user_longitude,setUserLongitude] = useState(0)
const [position_error,setPositionError] = useState(null)
const [ isLoading,setIsLoading ] = useState(true)
const [ location,setLocation ] = useState(null);
const renderLoading = () => {
if (isLoading) {
return (
<View style = {{flex:1,justifyContent: 'center',alignItems: 'center',backgroundColor: '#d3d3d3',height: height*0.75,width: width}}>
<ActivityIndicator
color = 'black'
size = 'large'
animated = {false}
/>
<Text style = { styles.text }>{i18n.t('')}</Text>
</View>
);
}else {
return null;
}
}
useFocusEffect(
React.useCallback(()=> {
let isActive = true;
const fetchGeoPosition = () => {
navigator.geolocation.getCurrentPosition(
position => {
if (isActive){
setUserLatitude(position.coords.latitude);
setUserLongitude(position.coords.longitude);
setPositionError(null);
console.log('Location Accessed')
}
setIsLoading(false)
},error => isActive && setPositionError(error.message),{enableHighAccuracy: true,timeout: 0,maximumAge: 1000}
);
}
const permission_get = async () => {
if (Platform.OS === 'android' && !Constants.isDevice) {
setErrorMsg(
'Oops,this will not work on Snack in an Android emulator. Try it on your device!'
);
return;
}
let { status } = await Location.requestPermissionsAsync();
if (status !== 'granted') {
setErrorMsg('Permission to access location was denied');
console.log('Not permitted')
return;
}
let location = await Location.getCurrentPositionAsync({});
setLocation(location);
console.log('Permitted')
}
permission_get()
fetchGeoPosition()
return () =>{
isActive = false
console.log('Location Severed')
}
},[],),)
if (!exercise.trim()){
return;
}
Alert.alert(
(i18n.t('')),(i18n.t('')),[
{
text: (i18n.t('')),onPress: () => navigation.navigate('Screen2')
},{
text: (i18n.t('')),}]
)
}
return(
<View style = {styles.container}>
<View style = {styles.header}>
<MapView
provider={PROVIDER_GOOGLE}
style={styles.map}
region= {{
latitude: user_latitude,longitude: user_longitude,latitudeDelta: 0.0451,longitudeDelta: 0.0451
}}>
<Marker
coordinate={
{latitude: user_latitude,error: position_error,}}
>
</Marker>
</MapView>
<View style = { styles.blank }>
<View style = {{flex:1,backgroundColor: '#fff' }}>
{(renderLoading())}
</View>
</View>
</View>
</View>
)
}
export {Screen};
const {height}= Dimensions.get("screen");
const { width } = Dimensions.get("screen")
const styles = StyleSheet.create({
container: {
flex: 1,flexDirection: 'column',backgroundColor: '#fff',},});
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)