[iOS] Map Kit View 사용하기 - 1

 

1. Mapkit뷰 넣어주고 import하기

import MapKit

2. 위치 나타내기

CoreLocation은 지리상 기기의 위치, 위도 경도 또는 근처의 iBeacon기기와 관련된 기능을 제공합니다. 와이파이, GPS, magnetometer, barometer, cellular hardware를 이용해 데이터를 수집한다고합니다.

CLLocationManager 클래스의 인스턴스를 사용해 Core Location의 기능을 설정, 시작, 중단 할 수 있습니다. location manager객체는 위치 관련 활동에서 다음 4가지 기능?을 지원합니다.

1. Standard and significant location updates
2. Region monitoring
3. Beacon ranging
4. Compass headings

location service를 이용할 경우 위의 사진과 같이 권한요청(Authorization)을 자동으로 나타냅니다.(애플이 자체적으로 만들어 놓음) 그냥 지도만 나타냈을 때완 다른 것을 볼 수 있습니다.

 

마지막으로 CLLocationManagerDelegate 프로토콜을 활용해 이벤트, 권한수정 등을 할 수 있습니다.

import CoreLocation

var locationManager = CLLocationManager()

먼저 인스턴스화를 시켜주었습니다. 그렇다면 이제 본격적으로 위치를 나타내볼 시간입니다. 위치를 나타내기 위해선 다음과 같은 과정이 필요합니다.

CLLocationCoordinate2D구조체를 활용하면 현재 위치를 위도(latitude), 경도(longtitude)로 다음과 같이 지정할 수 있습니다. 저는 용산역의 위도와 경도를 이용해보겠습니다.

let center = CLLocationCoordinate2D(latitude: 37.529189, longitude: 126.964485)

이렇게 우리는 지도에 나타낼 좌표를 특정했습니다. 그렇다면 다음은 어떻게해야 할까요? 네 맞습니다. 지도의 축적과 화면상 위도 경도를 가운데 올 수 있도록 정해줘야겠죠 ? 그럴 때 사용하는 것이 바로 MKCoordinateRegion 구조체입니다.

MKCoordinateRegion 구조체를 활용하면 어떤 좌표를 중앙에 둘지 그리고 어떤 축적으로(위도와 경도의 비례)로 나타낼 것인가를 정하게됩니다.

let region = MKCoordinateRegion(center: center, latitudinalMeters: 500, longtitudinalMeters: 500)

이제 마지막으로 지도에 위에서 정한 설정대로 등록을 해주시면 됩니다. 이 땐 setRegion(_:animated:)메소드를 사용하면 됩니다.

앞에 뷰컨트롤러에서 @IBOutlet으로 연결한 mapView에 붙여주면 됩니다.

@IBOutlet weak var mapView: MKMapView!

// animated가 true이면 지도에서 지도로 이동하는 모션나타남, false이면 모션없이 바로이동
mapview.setRegion(region, animated:true)

그러면 다음과 같이 화면에 지도가 잘 나오는 것을 볼 수 있습니다.

위치는 나타냈습니다 하지만 무언가 빠져있는듯한 기분 안드시나요??😅😅 네 맞습니다. 위치를 정확하게 찝어서 보여주는 “핀”이 빠졌습니다. 그렇다면이제 그 핀을 한 번 만들어 보겠습니다.

3. 핀

간단합니다. 핀을 나타낼 때는 MKPointAnnotation 클래스를 사용하면 됩니다. 그리고 핀을 어디에 지정해 줄것인지 핀의 좌표와 타이틀을 정해주면 됩니다. 좌표는 위에서 작성한 center을 사용하면됩니다.

let annotation = MKPointAnnotation()
annotation.coordinate = center
annotation.title = "용산역 입니다!"

그리고 위에서 설정한 것들을 addAnnotation(_:)메소드를 활용해 등록해주면 됩니다.

mapView.addAnnotation(annotation)

다음과 같이 중앙에 핀과 함께 위치되는 것을 볼 수 있습니다.