본문 바로가기
프로그래밍/Flutter-Dart

[Flutter] 카카오내비 앱 연동하기 (1) - Android

by 채연2 2022. 3. 11.

 

 

 

 

개삽펐다..... 대부분의 에러 원인은 키 해시 값이라는걸 명심하자 ㅜㅜ

 

 

pubspec.yaml

dependencies:
  flutter:
    sdk: flutter

  # kakao api
  kakao_flutter_sdk: ^1.0.0 # 전체 추가
  kakao_flutter_sdk_user: ^1.0.0 # 카카오 로그인
  kakao_flutter_sdk_talk: ^1.0.0 # 카카오톡(소셜, 메시지)
  kakao_flutter_sdk_story: ^1.0.0 # 카카오스토리
  kakao_flutter_sdk_link: ^1.0.0 # 카카오링크
  kakao_flutter_sdk_navi: ^1.0.0 # 카카오내비

  # kakao 의존성 library
  dio: ^4.0.4
  json_serializable: ^4.1.4
  platform: ^3.1.0
  package_info_plus: ^1.4.0
  shared_preferences: ^2.0.5
  crypto: ^3.0.1
  encrypt: ^5.0.1

카카오 로그인, 카카오 톡, 카카오 스토리, 카카오 링크는 안쓰지만 그냥 넣어줬다. 혹시나 추후에 사용할 수도 있으니!

kakao 의존성 외부 라이브러리들도 추가해주자

 

혹시 여기서 에러나는 분들은 android build.gradle(app)에서 minSdkVersion을 21로 업그레이드 해주자.

 

 

320x100

 

 

main.dart

void main() {
  KakaoSdk.init(nativeAppKey: '네이티브 앱 키', javaScriptAppKey: 'JavaScript 키');
  runApp(MyApp());
}

void main()에서 KakaoSdk.init으로 초기화해주자. 각각의 키 값을 어떻게 얻어오는지는 아래 포스팅을 참고해주자.

https://cording-cossk3.tistory.com/208

 

[Flutter] Kakao Map api 사용하기

카카오 developer 사이트 바로가기 [ + 애플리케이션 추가하기] 클릭 앱 이름, 사업자명 입력 후 저장 그럼 다음과 같이 리스트에 애플리케이션이 추가된 것을 확인 가능. 생성된 애플리케이션 클릭

cording-cossk3.tistory.com

 

 

 

 

사용법

bool result = await NaviApi.instance.isKakaoNaviInstalled();
if (result) {
	double latitude = marker.position.latitude;
	double longitude = marker.position.longitude;
	print('카카오내비 앱으로 길안내 가능 : $latitude, $longitude');

	await NaviApi.instance.navigate(
		destination: Location(name: '회사', x: '$longitude', y: '$latitude'),
		option: NaviOption(coordType: CoordType.wgs84),
	);
} else {
	print('카카오내비 미설치');
	// 카카오내비 설치 페이지로 이동
	launchBrowserTab(Uri.parse(NaviApi.webNaviInstall));
}

위도와 경도 값을 Location x, y에 각각 넣어주자.

나는 자꾸 [ 유효하지 않은 값입니다] 라는 에러가 떠서 위도 경도 위치를 바꿔 넣어주고, coordType을 지정해줬더니 위치를 잘 찾는다.

 

 

 

 

 

320x100

댓글