모든 준비를 마쳤습니다!

개발을 시작하려면 개발자 문서로 이동하세요.

Google Maps Android API 활성화

개발을 시작하기 위해 Google Developers Console에서 우선적으로 해야 할 일을 몇 가지 소개하겠습니다.

  1. 프로젝트 생성 또는 선택
  2. Google Maps Android API 활성화
  3. 적합한 키 생성
계속

정보 창

정보 창은 지도 위에 팝업 창으로 텍스트나 이미지를 표시합니다. 정보 창은 언제나 마커에 고정됩니다. 기본 동작은 마커가 눌리면 표시하는 것입니다.

코드 샘플

Github의 ApiDemos 리포지토리에는 모든 정보 창 기능을 보여주는 샘플이 포함되어 있습니다.

소개

정보 창을 사용하면 사용자가 마커를 눌렀을 때 정보를 표시할 수 있습니다. 정보 창은 한 번에 하나만 표시됩니다. 사용자가 마커를 클릭하면 현재 정보 창이 닫히고 새 정보 창이 표시됩니다. 사용자가 현재 정보 창을 표시하고 있는 마커를 클릭하면 해당 정보 창이 닫혔다가 다시 열립니다.

정보 창은 연관된 마커 위를 중심으로 기기의 화면과 반대쪽 방향으로 나타납니다. 기본 정보 창은 굵은 글꼴의 제목이 있고, 제목 아래에 조각 텍스트(선택 항목)가 있습니다.

정보 창 추가

정보 창을 추가하는 가장 간단한 방법은 해당 마커의 title()snippet() 메서드를 설정하는 것입니다. 이 속성을 설정하면 마커를 클릭할 때마다 정보 창이 나타납니다.

static final LatLng MELBOURNE = new LatLng(-37.81319, 144.96298);
Marker melbourne = mMap.addMarker(new MarkerOptions()
                          .position(MELBOURNE)
                          .title("Melbourne")
                          .snippet("Population: 4,137,400"));

정보 창 표시/숨기기

정보 창은 사용자 터치 이벤트에 반응하도록 설계되었습니다. 원할 경우 대상 마커에서 showInfoWindow()를 호출하여 프로그래밍 방식으로 정보 창을 표시할 수 있습니다. 정보 창은 hideInfoWindow()를 호출하여 숨길 수 있습니다.

static final LatLng MELBOURNE = new LatLng(-37.81319, 144.96298);
Marker melbourne = mMap.addMarker(new MarkerOptions()
                          .position(MELBOURNE)
                          .title("Melbourne"));
melbourne.showInfoWindow();

사용자 지정 정보 창

또한, 정보 창의 콘텐츠와 디자인을 사용자 지정할 수도 있습니다. 이렇게 하려면 InfoWindowAdapter 인터페이스의 구체적인 구현을 생성한 다음 해당 구현으로 GoogleMap.setInfoWindowAdapter()를 호출해야 합니다. 인터페이스에서 구현해야 하는 두 가지 메서드가 있습니다: getInfoWindow(Marker)getInfoContents(Marker). API는 먼저 getInfoWindow(Marker)를 호출하고, null이 반환되면 getInfoContents(Marker)를 호출합니다. 이번에도 null이 반환되면 기본 정보 창을 사용합니다.

그 중 첫 번째 메서드(getInfoWindow())를 통해 전체 정보 창에 사용할 뷰를 제공할 수 있습니다. 그 중 두 번째 메서드 (getInfoContents())를 사용하여 창의 콘텐츠를 사용자 지정하면서도 기본 정보 창 프레임과 배경을 유지할 수 있습니다.

참고: 그려지는 정보 창은 라이브 뷰가 아닙니다. 뷰는 반환될 때 이미지(View.draw(Canvas) 사용)로 렌더링됩니다. 즉, 그 이후에 뷰를 변경하면 지도의 정보 창에는 반영되지 않습니다. 나중에 정보 창을 업데이트하려면(예: 이미지를 로드한 후), showInfoWindow()를 호출합니다. 게다가 정보 창은 터치나 제스처 이벤트와 같이 일반 뷰에서 흔히 사용하는 대화형 기능을 고려하지 않습니다. 그러나 아래 섹션에 설명된 것처럼 전체 정보 창에서 일반 클릭 이벤트를 수신할 수 있습니다.

아래 이미지는 기본 정보 창, 사용자 지정된 콘텐츠가 포함된 정보 창, 사용자 지정된 프레임과 배경이 포함된 정보 창을 보여줍니다.

정보 창 비교

정보 창 이벤트

MarkerDemoActivity 샘플은 정보 창 이벤트를 등록 및 처리하는 코드의 예를 포함합니다.

OnInfoWindowClickListener를 사용하여 정보 창에서 클릭 이벤트를 수신할 수 있습니다. 지도에서 이 리스너를 설정하려면, GoogleMap.setOnInfoWindowClickListener(OnInfoWindowClickListener)를 호출합니다. 사용자가 정보 창을 클릭하면 onInfoWindowClick(Marker)가 호출되고 정보 창이 기본 강조 색(회색)으로 강조 표시됩니다.

public class MarkerDemoActivity extends AppCompatActivity implements
        OnInfoWindowClickListener,
        OnMapReadyCallback {

    private GoogleMap mMap;

    @Override
    public void onMapReady(GoogleMap map) {
        mMap = map;
        // Add markers to the map and do other map setup.
        ...
        // Set a listener for info window events.
        mMap.setOnInfoWindowClickListener(this);
    }

    @Override
    public void onInfoWindowClick(Marker marker) {
        Toast.makeText(this, "Info window clicked",
                Toast.LENGTH_SHORT).show();
    }
}

마찬가지로 GoogleMap.setOnInfoWindowLongClickListener(OnInfoWindowLongClickListener)를 호출하여 설정할 수 있는 OnInfoWindowLongClickListener를 통해 긴 클릭(long click) 이벤트를 수신할 수 있습니다. 이 리스너는 클릭 리스너와 유사하게 작동하고, onInfoWindowLongClick(Marker) 콜백으로 긴 클릭 이벤트에 대한 알림을 받습니다.

정보 창이 닫힐 때 알림 메시지를 받으려면 GoogleMap.setOnInfoWindowCloseListener(OnInfoWindowCloseListener)을 호출하여 설정할 수 있는 OnInfoWindowCloseListener를 사용합니다. onInfoWindowClose(Marker) 콜백을 받습니다.

정보 창 새로고침에 대한 참고 사항: 열린 정보 창이 이미 있는 마커를 눌러 사용자가 정보 창을 새로 고치면 onInfoWindowClose() 이벤트가 발생합니다. 그러나 열린 정보 창에서 프로그래밍 방식으로 Marker.showInfoWindow()를 호출하면 onInfoWindowClose() 이벤트가 발생하지 않습니다. 후자의 동작은 정보 창이 닫혔다가 다시 열린다는 것을 알고 있다고 가정합니다.

상술했듯이 정보 창은 라이브 View가 아닙니다. 그 대신 뷰는 지도에 이미지로 렌더링됩니다. 따라서 뷰에서 설정한 리스너는 무시되고, 뷰의 다양한 부분에서 발생하는 클릭 이벤트를 구분할 수 없습니다. 사용자 지정 정보 창 내에 버튼이나 확인란, 텍스트 입력과 같은 대화형 구성 요소를 배치하지 마십시오.

다음에 대한 의견 보내기...

Google Maps Android API
Google Maps Android API
도움이 필요하시나요? 지원 페이지를 방문하세요.