[Android/Kotlin] KakaoMap API Android v2 사용하기

kakaomap api를 사용해서 지도를 띄워보는 것을 해볼것이다

 

kakaomap api v1은 2024년 6월달에 종료된다고해서 v2로 진행했다

바뀐지 얼마안돼서 블로그 자료가 진짜 없다,, 정말 공식문서만 보고해야되는 상황,, 이참에 공식문서 보는법 제대로 배워야겠다

 

 

https://developers.kakao.com/

Kakao Developers

먼저 위 링크에 들어가서 [내 애플리케이션]에 들어가서 "애플리케이션 추가하기"를 눌러서 

앱을 추가해줘야한다

 

작성하고 저장을 눌러준뒤

왼쪽바쪽에 있는 앱키를 누르면 네이티브 앱키가 보일것이다

좀있다 쓸거기때문에 잘 기억해두자!

 

 

 

 

그 다음 왼쪽바에 플랫폼을 누르고 -> Android 플랫폼 등록 클릭

 

그러면 이렇게 나올텐데 패키지명 입력, 마켓 URL은 패키지명 입력하면 자동입력된다

그다음 키해시는?

 

# 키해시 

 

https://developers.kakao.com/docs/latest/ko/android/getting-started#before-you-begin-add-key-hash

Kakao Developers

위 공식문서에 굉장히 자세히 나와있다

 

- 디버그 키해시 -> 프로젝트를 처음 생성하거나 디버그할 때, 안드로이드 스튜디오에서 개발 환경에 맞게 자동으로 생성되는디버그 인증서에서 해시(hash)한 값

- 릴리즈 키해시 -> 앱 스토어에 앱을 배포하기 위해 생성한 릴리즈 인증서로부터 해시한 값

 

일단 지금은 디버그 키해시만 필요하기때문에 그것만 구했다

나중에 배포하려면 릴리즈도 알아야한다!

 

디버크 키해시를 구하는법은 3가지 방법이 있다

1. 터미널에서 확인 

2. Kakao SDK로 확인

3.Google Play Console 앱 서명으로 확인

 

나는 터미널이 제일 편해서 터미널로 사용해서 구했다

안드로이드 터미널에가서 해당 공식문서에 있는 코드 붙여넣어주면 디버그 키해시값이 바로 나왔다

 

그 키해시값을 플랫폼 등록부분에 넣어준다

 

 

 

# 프로젝트 설정

이제 안드로이드 스튜디오에 가서 추가해줄것이다

 

인터넷 권한을 추가해준다

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.sample">
 
    <!-- 인터넷 사용 권한 설정-->
    <uses-permission android:name="android.permission.INTERNET" />

    <application
    android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
    ...

AndroidManifest.xml

 

 

이부분은 아마 대부분 이미 작성이 되어있는 코드일것이다

// Java 8 사용을 위한 build.gradle.kts 설정
android {

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }

    kotlinOptions {
        jvmTarget = "1.8"
    }
}

build.gradle.kts(Module)

 

 

Maven 레퍼지토리(Repository)를 설정해준다

dependencyResolutionManagement {
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    repositories {
        google()
        mavenCentral()
        // 추가
        maven(url = uri("https://devrepo.kakao.com/nexus/repository/kakaomap-releases/"))
    }
}

settings.gradle.kts

 

 

앱 프로젝트 모듈의 build.gradle 에 카카오지도 SDK 에 대한 의존성도 추가해준다

implementation 'com.kakao.maps.open:android:2.9.5'

build.gradle(module)

 

매니페스트에 아까 확인했던 네이티브 앱키를 추가해준다

KAKAO_MAP_KEY부분에 네이티브 앱키를 추가해주면된다!  근데 KEY값은 하드코딩하면 안되기때문에 아래 방법대로 해보자

<application

	...

        <meta-data
            android:name="com.kakao.vectormap.KAKAO_MAP_KEY"
            android:value="KAKAO_MAP_KEY"/>

    </application>

AndroidMenifest.kt

 

KEY는 공개되면 안되기때문에 local properties에 저장해서 깃에 업로드가 안되게 해줘야한다

local properties에 KAKAO_MAP_KEY라는 상수를 설정해서 키값을 넣어준다

KAKAO_MAP_KEY = "네이티브 앱키 넣어주기!!"

local properties

 

 

그리고 build.gradle에 가서 아래와같이 작성해준다

...

// 추가
val properties = Properties().apply {
    load(FileInputStream(rootProject.file("local.properties")))
}

android {
    namespace = "nbc.group.recipes"
    compileSdk = 34

    defaultConfig {
        applicationId = "nbc.group.recipes"
        minSdk = 28
        targetSdk = 34
        versionCode = 1
        versionName = "1.0"

        ...
        
        //추가
        buildConfigField("String", "KAKAO_MAP_KEY", properties.getProperty("KAKAO_MAP_KEY"))
    }


    // 추가
    buildFeatures {
        buildConfig = true
    }
}

build.gradle.kt

 

 

그리고 마지막으로 따로 상수나 키값만 적는 Constant파일을 만들어서 키값을 작성해준다

import nbc.group.recipes.BuildConfig

const val KAKAO_MAP_KEY = BuildConfig.KAKAO_MAP_KEY

Constant.kt

 

 

이렇게하면 아까 AndroidMenifest에서 하드코딩하지않고 그냥 KAKAO_MAP_KEY로 써주면된다

 

 

 

그리고 중요한건데 mapView를 표시해줄 Activtiy나 Fragment에서 KakaoMapSdk를 초기화해줘야한다!!

여기서 초기화하지 않으면 kakaoMapSdk를 초기화하지 않았다는 오류가 뜰것이다

class MapFragment : Fragment() {

    ...

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        showMapView()
    }



    private fun showMapView(){

        ...

        // KakaoMapSDK 초기화!!
        KakaoMapSdk.init(requireContext(), KAKAO_MAP_KEY)

      
       ...

}

MapView가 표시될 Fragment

 

 

 

이제 MapView를 띄워줄 레이아웃에 MapView를 추가해준다

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".presentation.fragment.MapFragment">


    <com.kakao.vectormap.MapView
        android:id="@+id/map_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />


</androidx.constraintlayout.widget.ConstraintLayout>

fragment_map.xml

 

 

package nbc.group.recipes.presentation.fragment

class MapFragment : Fragment() {
    private val binding get() = _binding!!
    private var _binding : FragmentMapBinding? = null

    private lateinit var mapView : MapView
    private var kakaoMap : KakaoMap? = null

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?,
    ): View? {
        _binding = FragmentMapBinding.inflate(inflater, container, false)
        return binding.root
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        showMapView()
    }



    private fun showMapView(){

        mapView = binding.mapView

        // KakaoMapSDK 초기화!!
        KakaoMapSdk.init(requireContext(), KAKAO_MAP_KEY)

        mapView.start(object : MapLifeCycleCallback() {

            override fun onMapDestroy() {
                // 지도 API가 정상적으로 종료될 때 호출
                Log.d("KakaoMap", "onMapDestroy")
            }

            override fun onMapError(p0: Exception?) {
                // 인증 실패 및 지도 사용 중 에러가 발생할 때 호출
                Log.e("KakaoMap", "onMapError")
            }
        }, object : KakaoMapReadyCallback(){
                override fun onMapReady(kakaomap: KakaoMap) {
                    // 정상적으로 인증이 완료되었을 때 호출
                    kakaoMap = kakaomap
                }
        })
    }


    override fun onDestroyView() {
        super.onDestroyView()
        _binding = null
    }
}

MapFramgment.kt

 

마지막으로 Framgment에서 override해서 지도가 잘 호출되게 해준다

공식문서에는 자바코드로 써져있어서 몇몇 안맞는 코드는 고쳐주었다

 

잘 표시가 되는것을 확인할 수 있다!!

 

 

 

 

 

 

# 참고자료

https://stickode.tistory.com/1108

[JAVA][Android] 카카오 지도 API Android v2 사용하기

https://stickode.tistory.com/1120

[JAVA][Android] 카카오 지도에 현재 위치 표시하기

 

 

 

[공식문서]

https://apis.map.kakao.com/android/guide/

https://apis.map.kakao.com/android_v2/docs/

https://apis.map.kakao.com/android_v2/docs/getting-started/quickstart/

https://developers.kakao.com/docs/latest/ko/getting-started/app#platform-market-url

https://developers.kakao.com/docs/latest/ko/android/getting-started#before-you-begin-add-key-hash

https://developers.kakao.com/docs/latest/ko/android/getting-started#before-you-begin-add-key-hash