[Java][Android] 구글맵 빠르게 적용하기

이번 포스팅에선 스틱코드를 사용해서 구글맵을 앱에 적용하는 방법에 대해 포스팅하겠습니다.

앱을 키면 서울 부분에 마커가 찍혀 있는 지도를 보여주는 예제를 만들어 보겠습니다.

포스팅에서 사용된 모든 코드는 아래의 스틱코드 포스팅에서 확인하실 수 있습니다.

stickode.com/detail.html?no=2187

스틱코드

 

먼저 구글맵 API를 사용하기 위해 아래의 웹 페이지에 접속해서 프로젝트를 생성해야 합니다.

console.cloud.google.com/home/dashboard?folder=&organizationId=&project=our-shield-259208

Google Cloud Platform

위의 주소로 접속해서 구글 클라우드 플랫폼 우측을 클릭하면, 아래와 같은 화면이 나오며 프로젝트 생성이 가능합니다.

만약 생성 가능한 프로젝트 할당량을 모두 채웠다면 새 프로젝트를 만들 수 없으니 만들어둔 게 많다면 삭제한 후 진행해야 합니다.

프로젝트 이름을 설정한 후 만들기 버튼을 누르면 아래와 같은 화면이 나옵니다.

여기서 왼쪽 상단의 햄버거 버튼을 눌러 API 및 서비스 > 대시보드 순서로 클릭한 다음, 화면 상단의 API 및 서비스 사용 설정을 클릭합니다.

그러면 API들을 검색할 수 있는 화면이 나오는데 검색창에 maps sdk for android를 검색한 다음, 이것을 사용 설정합니다.

 

다음으로 API 및 서비스 > 사용자 인증 정보를 클릭해서 화면 상단의 사용자 인증 정보 만들기를 클릭하고 API 키를 클릭해 API 키를 생성해줍니다.

이 때 생성되는 API 키는 어딘가에 잘 보관해 둡니다. 그리고 우측 하단의 키 제한을 누르면 API 키 사용에 제한을 둘 수도 있는데 지금은 패스하겠습니다.

 

이제 안드로이드 스튜디오를 켜서 구글맵 API를 적용할 프로젝트를 열고, 매니페스트에 아래 코드를 추가합니다.

<meta-data
            android:name="com.google.android.geo.API_KEY"
            android:value="저장해 둔 API 키" />

<application> 태그 안의 어느 곳이든 저 태그를 작성하고, value 우측에 위에서 확인한 API 키를 입력해줍니다.

그리고 아래의 의존성 문구를 앱 수준 gradle 파일에 추가해줍니다.

implementation 'com.google.android.gms:play-services-maps:17.0.0'
implementation 'com.google.android.gms:play-services-location:17.0.0'

 

다음으로 XML 파일을 먼저 코딩해줍니다.

구글맵만 보여줄 프래그먼트만 있는 간단한 형태입니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical">

    <fragment
        android:id="@+id/map"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:name="com.google.android.gms.maps.SupportMapFragment" />

</LinearLayout>

 

다음으로 자바 파일을 코딩해줍니다.

import android.os.Bundle;

import androidx.appcompat.app.AppCompatActivity;

import com.google.android.gms.maps.CameraUpdateFactory;
import com.google.android.gms.maps.GoogleMap;
import com.google.android.gms.maps.OnMapReadyCallback;
import com.google.android.gms.maps.SupportMapFragment;
import com.google.android.gms.maps.model.LatLng;
import com.google.android.gms.maps.model.Marker;
import com.google.android.gms.maps.model.MarkerOptions;

public class MainActivity extends AppCompatActivity implements OnMapReadyCallback
{
    private GoogleMap map;

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager().findFragmentById(R.id.map);
        mapFragment.getMapAsync(MainActivity.this);
    }

    @Override
    public void onMapReady(GoogleMap googleMap)
    {
        map = googleMap;

        LatLng seoul = new LatLng(37.56, 126.97);

        MarkerOptions options = new MarkerOptions();
        options.position(seoul)
                .title("서울")
                .snippet("한국의 수도");
        map.addMarker(options);

        map.moveCamera(CameraUpdateFactory.newLatLngZoom(seoul, 10));
    }
}

앱을 빌드하면 아래와 같이 서울에 마커가 찍혀있는 화면이 출력됩니다.

 

마커를 클릭하면 위에서 작성한 대로 서울, 한국의 수도가 나오는 걸 볼 수 있습니다.