跟随用户使用反应映射和博览会地点行走
我目前正在开发React Native(Android App)的大学项目。 我在此组件中的目标是渲染一张地图,您可以在其中查看自己的位置,并在您走路时跟随您。
问题1 :有一个名为ClasterSerlocation的MapView道具,但仅在Apple设备上起作用。我该如何在Android手机上进行操作?
问题2 :我正在保存状态的位置,以便在其他任何地方重复使用它,但是位置对象在第一次渲染时是空的(或花一两秒模拟器)。每当我使用保存该信息的状态时,我都会出现错误,因为我有此延迟。
这是我的位置使用效果:
export default function App() {
const [userLocation, setUserLocation] = useState({})
const [isLoading, setIsLoading] = useState(false)
const mapRef = React.createRef();
React.useEffect(() => {
(async () => {
setIsLoading(true);
let { status } = await Location.requestForegroundPermissionsAsync();
if (status !== "granted") {
console.log("Permission to access location was denied");
return;
}
let location = await Location.getCurrentPositionAsync({
accuracy: Location.Accuracy.Balanced,
enableHighAccuracy: true,
timeInterval: 1,
});
//console.log(location);
//console.log(location.coords.latitude);
setUserLocation(location)
setIsLoading(false);
})();
}, []);
我是新来的React Native,谢谢您的耐心! :)
I'm currently developing an university project in React Native (android app).
My goal in this component is to render a map where you can see your location, and it follows you as you walk.
Problem 1: there's a MapView props named followsUserLocation, but it only works on Apple devices. How can I do it on an android phone?
Problem 2: I'm saving the location on a state in order to reuse it everywhere else, but the Location object is empty on first render (or takes a second or two to get the location info from the emulator). Whenever I use the state where I saved that info I get an error since I have this delay.
Here's my location useEffect:
export default function App() {
const [userLocation, setUserLocation] = useState({})
const [isLoading, setIsLoading] = useState(false)
const mapRef = React.createRef();
React.useEffect(() => {
(async () => {
setIsLoading(true);
let { status } = await Location.requestForegroundPermissionsAsync();
if (status !== "granted") {
console.log("Permission to access location was denied");
return;
}
let location = await Location.getCurrentPositionAsync({
accuracy: Location.Accuracy.Balanced,
enableHighAccuracy: true,
timeInterval: 1,
});
//console.log(location);
//console.log(location.coords.latitude);
setUserLocation(location)
setIsLoading(false);
})();
}, []);
I'm new in React Native, thank you for you patience! :)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您不能依靠
关注suserLocation
它是iOS特定的,并且不能提供更大的灵活性。理想情况下,需要定制的位置制造商,这表明当前用户移动时的位置。
博览会定位软件包提供
location.watchpositionasync(选项,回调)
方法,该方法在移动时会连续派遣新的用户位置信息。有了这些新信息,您可以实时更新位置标记。
You can't rely on
followsUserLocation
it's iOS-specific and not offers more flexibility.Ideally, a Custom Location maker is required which indicates the current user's location as she moves.
The expo-location package provides
Location.watchPositionAsync(options, callback)
method which continuously dispatches new user location information when she moves.With this new information, you can update the location marker in realtime.