Appearance
useGeolocation
디바이스의 위치 정보를 반환하는 훅이에요. 위치가 변경되면 값도 변경돼요. GPS 정보를 활용해 현재 위치를 감지하고, 사용자의 이동에 따라 자동으로 업데이트돼요. 예를 들어, 지도 기반 서비스에서 사용자의 현재 위치를 표시하거나, 배달 앱에서 실시간 이동 경로를 추적할 때 활용할 수 있어요. 위치 정보의 정확도와 업데이트 주기를 조정할 수 있어서 배터리 소모를 최소화하면서도 필요한 수준의 정확도를 유지할 수 있어요.
시그니처
typescript
function useGeolocation({ accuracy, distanceInterval, timeInterval }: UseGeolocationOptions): Location | null;
파라미터
- options필수 · UseGeolocationOptions
위치 정보 감지에 필요한 설정 객체에요.
- options.accuracyAccuracy
위치 정확도를 설정해요.
Accuracy.Lowest
: 오차범위 3KM 이내,Accuracy.Low
: 오차범위 1KM 이내,Accuracy.Balanced
: 오차범위 몇 백미터 이내,Accuracy.High
: 오차범위 10M 이내,Accuracy.Highest
: 가장 높은 정확도,Accuracy.BestForNavigation
: 네비게이션을 위한 최고 정확도 - options.timeIntervalnumber
위치 정보를 업데이트하는 최소 주기로, 단위는 밀리초(ms)예요. 이 값은 위치 업데이트가 발생하는 가장 짧은 간격을 설정하지만, 시스템이나 환경의 영향을 받아 지정한 주기보다 더 긴 간격으로 업데이트될 수 있어요.
- options.distanceIntervalnumber
위치 변경 거리를 미터(m) 단위로 설정해요.
- options.accuracyAccuracy
반환 값
- Location | null
디바이스의 위치 정보가 담긴 객체를 반환해요. 자세한 내용은 Location을 참고해주세요.
예제
위치 정보 변경 감지하기
ts
import React, { useState, useCallback } from 'react';
import { View, Text } from 'react-native';
import { useGeolocation, Accuracy } from '@apps-in-toss/framework';
// 위치 정보 변경 감지하기
function LocationWatcher() {
const location = useGeolocation({
accuracy: Accuracy.Balanced,
distanceInterval: 10,
timeInterval: 1000,
});
if (location == null) {
return <Text>위치 정보를 가져오는 중이에요...</Text>;
}
return (
<View>
<Text>위치 정보: {location.latitude}, {location.longitude}</Text>
</View>
);
}