안드로이드 구글 맵 API 사용

Google Maps Android API를 사용하는 기본적인  방법과 사용시 발생할 수 있는 문제점에 대해 다룹니다.

먼저 간단히 안드로이드에서 구글맵 예제를 실행시켜 보고,  후반부에 예제 코드를 설명합니다.

마지막 업데이트 - 2017. 11. 21

1. 간단한 안드로이드 구글맵 예제 동작시키기

2. Google Maps Android API 예제 코드 설명

3. Google Maps Android API를 사용할 때 발생할 수 있는 문제와 해결방법

4. 관련 포스팅

   4.1. GoogleApiClient와 FusedLocationApi를 사용하여 Android Google Map에 현재 위치 표시하기

   4.2. Places API Web Service를 사용하여 Google Map에 현재 위치 주변의 음식점 표시하기

   4.3. GenyMotion 가상머신에 Google Apps설치하여 Google Maps Android API 태스트 하기

1. 간단한 안드로이드 구글맵 예제 동작시키기

1. Google Developers Console 사이트 (https://console.developers.google.com )를 접속합니다.

프로젝트 만들기를 클릭합니다.

시간이 지남에 따라 구성이 바뀌어서 소개하는 것과 약간 다를 수도 있습니다.

2.  만들기를 클릭합니다.

3. 적당한 프로젝트 이름을 적고 만들기를 클릭합니다.

4.  Google Maps Android API를 위한 새로운 프로젝트가 생성되었습니다.  

API를 사용하기 위해선  추가 설정이 필요합니다.  사용 설정을 클릭합니다.

5. API 및 사용 서비스 사용 설정을 클릭합니다.

6. google maps android를 검색하여 Google Maps Android API를 클릭합니다.

7. 사용 설정을 클릭합니다.

8.사용자 인증 정보 만들기를 클릭합니다.

9. 1번 설명 중에 있는 파란색 글씨의  API 키를 클릭합니다.

10. Android 앱을 클릭합니다.

11. 패키지 이름 및 지문 추가를 클릭합니다.

12. Google Maps Android API를 사용할 안드로이드 프로젝트의 패키지 이름과 Android Studio가 설치된 컴퓨터에서 생성된 SHA-1 인증서 지문이 필요합니다.

13.  SHA-1 인증서 지문을 얻기 위한 과정부터 진행합니다.

윈도우키 + R을 누른 후 cmd를 입력하고 엔터를 눌러서 명령 프롬프트 창을 엽니다.

윈도우에서는  다음 명령으로 SHA-1 인증서 지문을 획득할 수 있습니다.

Oracle JRE에 포함되어 있는 keytool.exe를 사용해도 됩니다.

"C:\Program Files\Android\Android Studio\jre\bin\keytool" -list -v -keystore "%USERPROFILE%\.android\debug.keystore" -alias androiddebugkey -storepass android -keypass android

참고로 우분투 리눅스에서는 다음 명령을 사용합니다.

keytool -list -v -keystore ~/.android/debug.keystore -alias androiddebugkey -storepass android -keypass android

SHA1 옆에 있는 문자열을 복사해 놓으면 됩니다.

문제 없으면 15번을 진행하고, 그렇지 않으면 14번을 확인해보세요..

14.  안드로이드 스튜디오에서 앱을 빌드하여 안드로이드 디바이스에 설치한 적이 없어서 다음과 같은 에러가 발생합니다.

keytool 오류: java.lang.Exception: 키 저장소 파일이 존재하지 않음: C:\Users\note\.android\debug.keystore

간단한 안드로이드 프로젝트를 생성하여 빌드 후, 안드로이드 디바이스에 설치하면 debug.keystore 파일이 사용자 디렉토리의 하위 디렉토리인 .android 디렉토리 안에 생성됩니다.

다시 11번을 진행해보면  SHA1 fingerprint 획득할 수 있습니다.

15.  Google Maps Android API를 사용할 안드로이드 프로젝트를 준비해놓았다면 패키지 이름을 따로 복사해놓고 16번을 진행합니다.  

그렇지 않다면 안드로이드 스튜디오를 실행하여 새로운 프로젝트를 생성합니다.  

메뉴에서 File > New > New Project를 선택합니다.

Create New Project 창에서 Application name(앱 이름)과 Company domain을 입력하고 Next를 클릭합니다.

앱을 실행시킬 Minimum SDK를 선택합니다.

아래 화면처럼 API 15로 지정하면 API 15 미만의 안드로이드 운영체제를 사용하는 안드로이드 디바이스에서 설치 및 실행이 안됩니다.   

프로젝트에 추가할 액티비티로 Empty Activity를 선택해줍니다.

하위버전 호환성을 해주려면 Backwards Compatibility(AppCompat)를 체크합니다.

차이는 Activity 대신에 AppCompatActivity를 사용하는 것입니다.

안드로이드 프로젝트 생성이 완료되면 MainActivity.java 파일에서 패키지 이름을 복사해둡니다.

16. Google Developers Console 사이트에  복사해두었던 패키지 이름과 SHA-1 인증서 지문을 붙여넣기하고 생성을 클릭합니다.

17. API 키 생성 완료 메시지 박스가 표시되면  API 키를 복사해두고 닫기를 클릭합니다.

18.  Google Maps Android API를 사용하기 위해서는 Google Play services 라이브러리 패키지를 설치해줘야 합니다.

안드로이드 스튜디오로 돌아와서 메뉴에서 Tools > Android > SDK Manager를 선택합니다.

SDK Tools 탭을 클릭하고 Google Play services 항목을 체크하고 Apply를 클릭하여 설치를 진행합니다.

19. 매네페스트 파일 AndroidManifest.xml의 <application> 태그 하위요소로 <meta-data> 태그를 사용하여 등록받은 API키를 입력해줍니다.

<application        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/AppTheme">        <meta-data            android:name="com.google.android.geo.API_KEY"            android:value="등록받은 API키" />                <activity android:name=".MainActivity">

     

20. 등록 받은 키 확인이 필요하다면 Google Developers Console 사이트 (https://console.developers.google.com/apis/dashboard )에서 왼쪽 상단에 있는 프로젝트명을 Google Maps Android API를 위한 것으로 바꾸어 선택합니다.

생성한 프로젝트가 하나라면 자동으로 선택됩니다.

왼쪽에 보이는 메뉴에서 사용자 인증 정보를 클릭합니다.

생성했던 API 키를 확인할 수 있습니다.

21.  모듈 app의 build.gradle에 Google Play Services 라이브러리를 프로젝트에서 사용한다고 추가해줘야 합니다.

Google Play Services 전체 라이브러리(com.google.android.gms:play-services)를 추가하는 대신에 Google Maps Android API를 사용하기 위해 필요한 라이브러리만 추가해주는 것이 좋습니다.

dependencies {    implementation fileTree(dir: 'libs', include: ['*.jar'])    implementation 'com.android.support:appcompat-v7:26.1.0'    implementation 'com.android.support.constraint:constraint-layout:1.0.2'    implementation 'com.google.android.gms:play-services-maps:10.0.1'    implementation 'com.google.android.gms:play-services-location:10.0.1'    testImplementation 'junit:junit:4.12'    androidTestImplementation 'com.android.support.test:runner:1.0.1'    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.1' }

주의할 점은 Android 6.0(API 23) 이상을 대상으로 하는 경우 런타임 퍼미션 처리가 필요해서  버전 8.3 이상을 추가해줘야 합니다.

필요한 라이브러리를 추가해준후,  최신 버전이 있는 경우 노란색 블럭으로 표시됩니다.

마우스 커서를 가져가면  최신 버전을 알려줍니다. 글 작성 시점에서 최신 버전은 11.6.0입니다.

확인된 버전으로 수정해줍니다.  두개의 라이브러리  모두 확인된 버전으로 동일하게 적어주면 됩니다.

프로젝트 변경사항을 반영해주기 위해 코드 창 위에 보이는 Sync Now를 클릭합니다.

안드로이드 스튜디오의 왼쪽 아래에 Gradle build finished  메시지가 보일때 까지 대기합니다.

22. 레이아웃 파일을 다음 내용으로 바꾸어 줍니다.

액티비티의 레이아웃에 <fragment> 태그를 추가하여 지도가 표시될 위치를 지정해줍니다.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context=".MainActivity" >        <fragment        android:id="@+id/map"        android:layout_width="match_parent"        android:layout_height="match_parent"        class="com.google.android.gms.maps.MapFragment" />     </LinearLayout>

23. 이제 자바 코드를 작성합니다.

package com.tistory.webnautes.googlemapsandroidapiexample; import android.app.FragmentManager; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import com.google.android.gms.maps.CameraUpdateFactory; import com.google.android.gms.maps.GoogleMap; import com.google.android.gms.maps.MapFragment; import com.google.android.gms.maps.OnMapReadyCallback; import com.google.android.gms.maps.model.LatLng; import com.google.android.gms.maps.model.MarkerOptions; public class MainActivity extends AppCompatActivity        implements OnMapReadyCallback {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        FragmentManager fragmentManager = getFragmentManager();        MapFragment mapFragment = (MapFragment)fragmentManager                .findFragmentById(R.id.map);        mapFragment.getMapAsync(this);    }    @Override    public void onMapReady(final GoogleMap map) {        LatLng SEOUL = new LatLng(37.56, 126.97);        MarkerOptions markerOptions = new MarkerOptions();        markerOptions.position(SEOUL);        markerOptions.title("서울");        markerOptions.snippet("한국의 수도");        map.addMarker(markerOptions);        map.moveCamera(CameraUpdateFactory.newLatLng(SEOUL));        map.animateCamera(CameraUpdateFactory.zoomTo(10));    } }

23. 실행 결과 화면입니다. 서울 중앙에 빨간색 마커가 보이고 클릭하면 마커에 추가해두었던 설명이 보입니다.

  

 

2. Google Maps Android API 예제 코드 설명

1. MapFragment는 앱에 지도를 표시하기 위해 사용되는 컴포넌트로 관련 처리를 자동으로 해줍니다. 앱에서 사용하기 위해서는 레이아웃의 액티비티에 <fragment> 태그를 사용하여 추가시켜 주어야 합니다.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context=".MainActivity" >        <fragment        android:id="@+id/map"        android:layout_width="match_parent"        android:layout_height="match_parent"        class="com.google.android.gms.maps.MapFragment" />     </LinearLayout>

2. MainActivity 클래스에서  OnMapReadyCallback 인터페이스를 구현한다고 선언해놓고

public class MainActivity extends AppCompatActivity        implements OnMapReadyCallback {

OnMapReadyCallback 인터페이스의 onMapReady 메소드를 구현해줘야 합니다.  

맵이 사용할 준비가 되었을 때(NULL이 아닌 GoogleMap 객체를 파라미터로 제공해 줄 수 있을 때)  호출되어지는 메소드입니다.  

MarkerOptions으로 마커가 표시될 위치(position), 마커에 표시될 타이틀(title), 마커 클릭시 보여주는 간단한 설명(snippet)를 설정하고 addMarker 메소드로 GoogleMap 객체에 추가해주면 지도에 표시됩니다.

@Override    public void onMapReady(final GoogleMap map) {        LatLng SEOUL = new LatLng(37.56, 126.97);        MarkerOptions markerOptions = new MarkerOptions();        markerOptions.position(SEOUL);        markerOptions.title("서울");        markerOptions.snippet("한국의 수도");        map.addMarker(markerOptions);        map.moveCamera(CameraUpdateFactory.newLatLng(SEOUL));        map.animateCamera(CameraUpdateFactory.zoomTo(10));    }

3. 이제 onCreate 메소드에서 getMapAsync() 메소드를 호출하여 GoogleMap 객체가 준비될 때 실행될 콜백을 등록합니다.

그러기 위해서는 레이아웃에 추가했던 프래그먼트(com.google.android.gms.maps.MapFragment)의 핸들을 가져와야 합니다.

getMapAsync() 메소드가 메인 쓰레드에서 호출되어야 메인스레드에서 콜백이 실행됩니다.

@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); FragmentManager fragmentManager = getFragmentManager(); MapFragment mapFragment = (MapFragment)fragmentManager .findFragmentById(R.id.map); mapFragment.getMapAsync(this); }

3. Google Maps Android API를 사용할 때 발생할 수 있는 문제와 해결방법

1. 처음 안드로이드 폰에 설치되면서 실행되면 흰화면이 나온 상태에서 좀 시간이 걸리고 나서 구글맵이 보이고 그 다음 실행부턴 정상적으로 되는 증상이 있으면 다음 포스팅을 참고하세요.

Android Studio 2.3.1에서는 해결되었습니다.

Android Studio 2.x 버전에서 Google Map 로딩이 늦는 문제 해결 -> Instant Run 해제

http://webnautes.tistory.com/1056

2. 킷캣(안드로이드 4.4) 이하 버전 사용시 발생하는 문제는 다음 포스팅을 참고하세요.. 안드로이드 4.4 이상에서 발생할 수도 있습니다.

Android KitKat(4.4) 이하 버전에서 Google Map 사용시 Unable to get provider com.google.firebase.provider.FirebaseInitProvider

http://webnautes.tistory.com/1123

3. 아래 화면처럼 지도가 안보이고 Google 이라는 문자만 보이면 인증오류일 가능성이 높습니다.  

간단한 안드로이드 구글맵 예제 동작시키기의 12번에서 안드로이드 프로젝트의 패키지 이름과  Android Studio가 설치된 컴퓨터에서 생성된 SHA-1 인증서 지문이 제대로 입력되었는지 확인하세요.

로그캣에서 다음과 같은 관련 메시지를 확인 할 수 있습니다.

Authorization failure.   Please see https://developers.google.com/maps/documentation/android-api/start for how to correctly set up the map. In the Google Developer Console (https://console.developers.google.com) Ensure that the "Google Maps Android API v2" is enabled. Ensure that the following Android Key exists:

4. 관련 포스팅

4.1. GoogleApiClient와 FusedLocationApi를 사용하여 Android Google Map에 현재 위치 표시하기

GoogleApiClient와 FusedLocationApi를 사용하여 구글맵에 현재 위치를 표시하는 예제입니다.

http://webnautes.tistory.com/1011

4.2. Places API Web Service를 사용하여 Google Map에 현재 위치 주변의 음식점 표시하기

Places API Web Service를 이용하여 현재 위치 주변의 음식점 정보를 안드로이드의 구글맵에 표시하는 내용을 다룹니다.

http://webnautes.tistory.com/1080

4.3. GenyMotion 가상머신에 Google Apps설치하여 Google Maps Android API 태스트 하기

Genymotion에서 Google Map API을 가지고 작성한 Android 앱을 테스트하는 방법을 소개합니다.

http://webnautes.tistory.com/1064

 

 

 

출처 : http://webnautes.tistory.com/647