카카오맵 구현하기

1. 사전 작업

1-1. SDK 파일 다운로드

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

파일 다운로드 후 libs 폴더 안에 있는 jar파일과 폴더들을 아래처럼 배치시킨다.

(jniLib 디렉토리 추가 후 아래 세 폴더 넣기, libs 디렉토리 추가 후 jar 파일 넣기)

 

1.2 앱 등록 및 해시 키 추가

Kakao Developers에서 앱을 등록한 후 안드로이드 플랫폼을 추가한다.

프로젝트 패키지명과 해시 키를 등록하면 된다.

 

해시키는 안드로이드 프로젝트 내에서 아래 코드를 실행시키면 알 수 있다.

private fun getHashKey() {
    try {
        val info =
            packageManager.getPackageInfo(packageName, PackageManager.GET_SIGNATURES)
        for (signature in info.signatures) {
            var md: MessageDigest
            md = MessageDigest.getInstance("SHA")
            md.update(signature.toByteArray())
            val something = String(Base64.encode(md.digest(), 0))
            Log.e("Hash key", something)
        }
    } catch (e: Exception) {

        Log.e("name not found", e.toString())
    }
}

 

1-3. AndroidManifest.xml 수정

권한 추가

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

<application
	android:usesCleartextTraffic = "true">...

 

App Key 추가

앱 플랫폼에 명시된 네이티브 앱 키를 적는다.

<meta-data android:name="com.kakao.sdk.AppKey" android:value="${네이티브 앱 키}"/>

 

 

2. 기본 맵 띄우기

2-1. 레이아웃 추가

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/detailMapView"
        android:layout_width="match_parent"
        android:layout_height="500dp"
        android:layout_marginTop="20dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>

 

2-2. 액티비티 추가

val mapView = MapView(this)
binding.detailMapView.addView(mapView)

 

2-3. 결과

실제 휴대폰 기기에서만 지도가 뜨고, 에뮬레이터에서는 지도가 뜨지 않으므로 주의하자.

 

3. 커스텀 맵 띄우기

위도, 경도, 줌 레벨을 매개변수로 받아와서 지도 위치를 설정한다.

지도에 마커를 표시할 때 itemName을 필수로 설정해야 한다.

// 카카오 지도 띄우기
private fun showMap(lat : Double, long: Double, level:Int) {
    val mapView = MapView(this)
    binding.detailMapView.addView(mapView)

    //위치 설정
    val mapPoint = MapPoint.mapPointWithGeoCoord(long, lat) //위치 설정
    mapView.setMapCenterPoint(mapPoint, true) //중심점 설정
    mapView.setZoomLevel(level,true) //확대 레벨 설정 (작을 수록 확대)

    //마커 생성
    val marker = MapPOIItem()
    marker.itemName = "위치"
    marker.mapPoint = MapPoint.mapPointWithGeoCoord(long, lat)
    marker.markerType = MapPOIItem.MarkerType.BluePin

    mapView.addPOIItem(marker)
}

 

3-1. 결과