[iOS] 애플지도에 원하는 위치에 글씨와 이미지 넣기

안녕하세요 Foma 입니다!

 

저번 시간에는 애플지도에 원하는 위치 표시하는 법에 대해서 알아보았는데요.

 

(혹시 안보신 분들은 여기 를 통해서 보고 와주세요!)

 

여기서 더 업그레이드 해서 원하는 위치에 저렇게 정해진 마크 표시말고 내가 원하는 이미지나 레이블을

 

넣을 수 없을까? 하다가 찾아내서 정리하게 되었습니다.

 

바로 시작할게요~

 

 

---

MKMapViewDelegate

 

먼저 지난 시간에 마크를 표시했던 ViewController에 MKMapViewDelegate를 채택해주세요!

class ViewController: UIViewController ,MKMapViewDelegate{
  override func viewDidLoad() {
        super.viewDidLoad()
        
        mapView.delegate = self
        
        }
        
        

 

그리곤 아래와 같이 annotation을 MKAnnotationView로 반환해주는 메소드를 만들어주세요!

 

  func mapView(_ mapView: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView? {

 

그리고 위 함수에 annotationView를  만들어주시고

 

원하는 이미지를  넣을 이미지뷰와 레이블을 각각 만들어줍니다.

 

여기서 레이블의 y값을 보면 -35라고 되어있는데요.

 

원하는 위치에서 조금 위에 레이블을 띄우기 때문입니다.

 

        var annotationView: MKAnnotationView?
        
        //원하는 위치에 넣을 이미지뷰
	let annotationimageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 25, height: 25))
        let image = 원하는 이미지
        annotationimageView.image = image
        
        //원하는 위치에 넣을 레이블
        let annotationLabel = UILabel(frame: CGRect(x: 0, y: -35, width: 45, height: 15))
        annotationLabel.backgroundColor = .systemOrange
        annotationLabel.textColor = .white
        annotationLabel.numberOfLines = 3
        annotationLabel.textAlignment = .center
        annotationLabel.font = UIFont.boldSystemFont(ofSize: 10)
        annotationLabel.text = annotation.title!

 

위에서 만든 이미지뷰와 레이블을 annotationView에 서브뷰로 추가해줍니다.

 

그리고 마지막으로 annotationView를 반환해주세요.

    	annotationView?.addSubview(annotationimageView)
        annotationView?.addSubview(annotationLabel)
        
        return annotationView
    }

 

이렇게 하면 아래와 같이 원하는 이미지와 그 위에 원하는 레이블이 떠있는 모습을 볼 수 있습니다!

 

 

오늘은 이렇게 이미지와 레이블을 원하는 위치에 띄워보는 것을 알아보았는데요.

 

혹시라도 궁금한 점이 있거나 틀린 부분이 있다면 댓글로 알려주세요~!