[안드로이드] 지하철 역 클릭 시 이벤트 구현하기 1편

대중교통을 이용하는 사람이라면 누구나 사용하는 지하철 앱. 지하철 앱을 사용하다보면, 지하철 노선도에서 각 역을 클릭하여 출발지 지정을 하는 것을 볼 수 있는데, 이번 포스팅에서는 바로 그 기능을 다루는 법에 대해 쓰고자 한다.

즉, 거대한 지하철 노선도 이미지 파일이 있으면, 그 이미지를 안드로이드 앱에 띄우고, 지하철 역을 하나하나 등록하여 이벤트처리하는 것을 알아보고자 한다.

설명에 앞서, 해당 기능을 간단하게 설명하자면 다음과 같다.

1. 이미지 파일의 픽셀맵으로 각 지하철 역의 영역을 지정 (SQLite)

2. SQLite 맵을 안드로이드 스튜디오에서 불러옴

3. 특정 좌표값에 터치 이벤트 발생 시, 이벤트 처리 (다음포스팅)

그럼 먼저, 이미지 파일에서 지하철 역의 범위를 지정해보자.

http://imagemap-generator.dariodomi.de/?

위 사이트에 접속하여, 이미지를 먼저 업로드해야하는데 필자는 네이버지도에서 제공하는 Subway 맵을 사용하였다. 등록이 완료되면 지하철 노선도가 화면에 꽉 차게 되는데, 이 때 원하는 지하철 역에서, 지정하고 싶은 만큼 좌측상단/우측하단 마우스로 한번씩 클릭하면 다음그림처럼 좌표값이 뜨게 된다.

여기서 주목할 점은, 아래 텍스트로 나온 4개의 좌표이다. 좌측상단 (1378, 1230) / 우측하단 (1416, 1295) 의 좌표값이 각각 나옴을 알 수 있다. 이제 SQLite에 저장하기 위해 다음 프로그램을 설치해보자.

http://sqlitebrowser.org/

위 사이트에 접속 후 프로그램을 다운 받고, 다음과 같이 만든다.

각 항목별로 간단히 설명하면,

id: 지하철 역 id값. (관리하기 위함)

NAME: 지하철역 이름

X1, Y1: 좌측상단에 찍은 좌표

X2, Y2: 우측하단에 찍은 좌표.

자 이제, 이미지 위에서 픽셀 좌표를 이용하여 특정 지하철역을 정의하는 단계는 끝이 났다. 

다음포스팅에서는 sqlite파일을 안드로이드에서 불러온 뒤, 적힌 좌표값을 토대로 특정 역 선택 시 이벤트처리를 하는 방법에 대해 알아보자.