Search code examples
swiftuiimagemkmapviewmkannotation

Custom image as annotation pin with two different colour images


I'm trying to add a custom image for my pin annotations as well as change the colour of the custom images for some of the annotations. The colour is changed. However, the image doesn't show up. The default pins show instead.

Here's my code:

class MyPointAnnotation : MKPointAnnotation {
    var pinTintColor: UIColor?
}

class ViewController: UIViewController, CLLocationManagerDelegate, MKMapViewDelegate{
    @IBOutlet weak var map: MKMapView!

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

        var annotationView = mapView.dequeueReusableAnnotationView(withIdentifier: "myAnnotation") as? MKPinAnnotationView

        if annotationView == nil {
            annotationView = MKPinAnnotationView(annotation: annotation, reuseIdentifier: "myAnnotation")
            annotationView?.canShowCallout = true
        } else {
            annotationView?.annotation = annotation
        }

        if annotation is MKUserLocation {
            return nil
        }

        if let annotation = annotation as? MyPointAnnotation {
            annotationView?.pinTintColor = annotation.pinTintColor
            annotationView?.image = UIImage(named: "BLog.png")
        }

        return annotationView
    }

    override func viewDidLoad() {
        super.viewDidLoad()
        self.map.delegate = self  

        let annotation1 = MyPointAnnotation()
        annotation1.coordinate = CLLocationCoordinate2DMake([LatArray], [LonArray])
        annotation1.title = NameArray
        annotation1.pinTintColor = .red

        let annotation2 = MyPointAnnotation()
        annotation2.coordinate = CLLocationCoordinate2DMake([LatArray2], [LonArray2])
        annotation2.title = NameArray2
        annotation2.pinTintColor = .green
    } 
}

The image "BLog.png" is located in the main bundle. I've assigned the MKMapView as a delegate.

But the image still won't change.


Solution

  • You need to use MKAnnotationView instead of MKPinAnnotationView to add a custom image for your pin annotations.

    func mapView(_ mapView: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView? {
        if annotation is MKUserLocation {
            return nil
        }
    
        if // Image pin // {
            var annotationView = mapView.dequeueReusableAnnotationView(withIdentifier: "image")
            if annotationView == nil {
                annotationView = MKAnnotationView(annotation: annotation, reuseIdentifier: "image")
                annotationView?.canShowCallout = true
                annotationView?.image = UIImage(named: "BLog.png")
    
                let rightButton: AnyObject! = UIButton(type: UIButtonType.detailDisclosure)
                annotationView?.rightCalloutAccessoryView = rightButton as? UIView
            }
            else {
                annotationView?.annotation = annotation
            }
            return annotationView
        } else {
            var annotationView = mapView.dequeueReusableAnnotationView(withIdentifier: "myAnnotation") as? MKPinAnnotationView
            if annotationView == nil {
                annotationView = MKPinAnnotationView(annotation: annotation, reuseIdentifier: "myAnnotation")
                annotationView?.canShowCallout = true
            } else {
                annotationView?.annotation = annotation
            }
            if let annotation = annotation as? MyPointAnnotation {
                annotationView?.pinTintColor = annotation.pinTintColor
            }
            return annotationView
        }
    }