flutter kakaomap_webview 사용중에 현재 위도,경도를 받아서 맵을 빌드시키려고 했는데 계속 위도 경도 값을 받기전에 빌드함수가 실행되었다.
그이유는 동기 / 비동기 함수에 대한 지식 부족이었다..
따라서 오늘은 동기 비동기 함수와 나의 해결방법에 대해 적어보려고 한다.
동기 (sync)
- 서버에 요청을 보내고 응답이 와야 다음 동작 수행
= 여러작업을 동시에 실행할 수 없다는 의미
비동기 (async)
- 서버에 요청을 보내고 응답이 오지 않아도 , 즉 응답상태와 무관하게 다음 동작 수행이 가능
= 여러 작업을 동시에 실행 할 수 있다는 의미
< 나의 해결방법 >
현재 위치의 위도 , 경도를 구하는 라이브러리 geolocator를 사용하였다. https://pub.dev/packages/geolocator
double lat = 0;
double lng = 0;
Future<String> getPosition() async {
var currentPosition = await Geolocator.getCurrentPosition(
desiredAccuracy: LocationAccuracy.high);
lat = currentPosition.latitude;
lng = -(currentPosition.longitude);
print("lat : $lat ###### lng: $lng");
return "$lat $lng";
}위도 경도를 0으로 초기화 시켜 준 후, 비동기함수로 getPosition() 생성 후, 현재위치의 위도 경도를 저장 후 리턴해주는 형식으로 구성.
FutureBuilder(
future: getPosition(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (snapshot.hasData == false) {
return CircularProgressIndicator();
} else if (snapshot.hasError) {
return SizedBox(
child: Text('Error: ${snapshot.hasError}'),
);
} else {
return KakaoMapView(
width: size.width,
height: size.height,
kakaoMapKey: kakaoMapKey,
lat: lat,
lng: lng,
showMapTypeControl: true,
showZoomControl: true,
markerImageURL:
'https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/marker_red.png',
onTapMarker: (message) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('lat:$lat , lng:$lng ')));
//await _openKakaoMapScreen(context);
},
);FutureBuilder로, future를 getPosition() 함수로 설정하고 가져온 데이터가 없으면 프로그래스바를 리턴해주고 데이터가 있다면 (여기서 데이터는 lat,lng ) 카카오맵뷰를 빌드하는 형식으로 구성했다.
처음에는 initState()안에 getPosition() 함수를 실행시켜 위도 경도 값을 저장 후 빌드함수 실행시키고자 했었는데 initState()가 실행되는동안 빌드함수가 실행이 되서 위도 경도값이 초기 값인 0으로 자꾸 인식되어서 맵에 표시가 되지 않았다.
바로 동기, 비동기함수에 대한 지식이 없어서 이런 삽질을 했던 것 같다... 하지만 이번을 통해서 동기와 비동기에 대해 확실히 개념을 잡았기 때문에 훗날 이런 일은 다시는 일어나지 않을것이다 :)
제 방법말고 다른 방법이 있거나 제 방법에 문제가 있다면 언제든지 피드백 해주시면 감사하겠습니다 !! 