[Android] Naver Map API 띄우기 (kotlin)

🌎 Map Service ( Naver Map API )

naver map api를 이용하여 현재위치 띄우기, 장소 검색 등을 연습해보았다.

만들었던 기능들을 하나씩 차근차근 올려보고자 한다.

먼저 네이버 맵 API를 이용하기 위해서는 Naver Cloud Platfrom에 가입하여 애플리케이션을 등록해야한다.

애플리케이션을 등록하기 전에 Naver Cloud Platform에 결제 수단을 등록해 놓아야 map서비스를 이용할 수 있으니 참고하자! (결제는 안되니 안심해도 된다.)

결제 수단을 등록하고 애플리케이션 추가를 누르면 하단의 사진처럼 이용할 수 있는 service 목록들이 나온다. 그 중에서 우리는 Mobile Dynamic Map을 선택하면 된다.

밑으로 내려서 <서비스 환경 등록>탭에 본인의 안드로이드 스튜디오 프로젝트 패키지명을 입력하고 등록을 완료하면 된다.

이후 아래의 사진처럼 성공적으로 등록이 되면 하단의 사진처럼 인증정보를 눌러서 본인의 Client ID를 확인할 수 있다.
API를 사용하기 위해서는 안드로이드 스튜디오 프로젝트에서 Client ID가 필요하니 복사해두자!

1. dependency추가

build.gradle(Module: app)에 다음과 같이 dependency를 추가한다.

   implementation 'com.naver.maps:map-sdk:3.11.0'

build.gradle(Project)에도 하단과 같이 추가해준다.

allprojects {  
  repositories {  
      google()  
      jcenter()  
      maven {  
          url 'https://naver.jfrog.io/artifactory/maven/'  
     }  
  }
}

2. AndroidManifest.xml

manifest파일에 들어가서 application태그 내에 meta-data선언해주고 앞서 복사해두었던 client id를 입력해준다.

<application  
  android:name=".base.BaseApplication"  
  android:usesCleartextTraffic="true"  
  android:allowBackup="true"  
  android:icon="@mipmap/ic_launcher"  
  android:label="@string/app_name"  
  android:roundIcon="@mipmap/ic_launcher_round"  
  android:supportsRtl="true"  
  android:theme="@style/Theme.AppCompat.NoActionBar">  

 <meta-data  android:name="com.naver.maps.map.CLIENT_ID"  
             android:value="@string/naver_client_id"/>  

</application>

3. MapView 만들기

map view를 띄울 프래그먼트 내에 하단과 같이 mapview를 추가해주었다.

<com.naver.maps.map.MapView  
  android:id="@+id/mapview"  
  android:layout_width="match_parent"  
  android:layout_height="match_parent"  
  app:layout_constraintTop_toTopOf="parent"  
  app:layout_constraintBottom_toBottomOf="parent"  
  app:layout_constraintStart_toStartOf="parent"  
  app:layout_constraintEnd_toEndOf="parent" />

4. Map View 띄우기
지도만 띄우는건 정말 간단하다.
MapView와 NaverMap의 객체를 생성하고 레이아웃의 map view와 연결해준다.
NaverMap의 객체는 OnMapReadyCallback을 등록하여 비동기로 객체를 얻을 수 있다.

class MapFragment : BaseFragment(), OnMapReadyCallback {  
    private lateinit var binding: FragmentMapBinding  
    private lateinit var mapView: MapView  
    private lateinit var naverMap: NaverMap  

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

        mapView = binding.mapview  
        mapView.onCreate(savedInstanceState)  
        mapView.getMapAsync(this)  

        return binding.root  
    }

    override fun onMapReady(naverMap: NaverMap) {  
       this.naverMap = naverMap  
   }
}