Vicente Garcia
Vicente Garcia

Reputation: 6360

Custom user picture for default User Location's callout on MKMapView

On iOS 15 (actually since iOS 14), on a MKMapView when tapping on the default User Location a callout is shown displaying kind of an 'empty' profile picture.

You can see on the screenshot below the callout that appears when tapping the user location, I want to change the image that appears there.

A map view showing the user location's callout

Is it possible to configure it?

For example setting my own profile picture but the behaviour staying the same.

To clarify, I don't want to change the User Location annotation and I don't want to add a custom annotation either, also I don't want to add my own callout to the User Location's annotation. I just want to find out if it is possible to set an image for the existing callout.

The User Location shown on the picture is the default one using: MKMapView.showsUserLocation = true


Edit

Some folks have pointed out that this might be a duplicated of this other question, it is not.

That other question deals with how to configure a Pin or Annotation View (MKPinAnnotationView or MKAnnotationView).

My situation is quite different. I want to be able to edit the profile picture shown on the default user location. This one seems to be a private class but I would like to know if there is a public access to configure it.

Upvotes: 7

Views: 524

Answers (1)

Gerd Castan
Gerd Castan

Reputation: 6849

You define your AnnotationView.

You have the usual freedom to design your own MKMarkerAnnotationView

 import MapKit 
 import SwiftUI
 class UserMarkerAnnotationView: MKMarkerAnnotationView {
     static let REUSEIDENTIFIER = "UserMarkerAnnotationView"
 
     override var annotation: MKAnnotation? {
         didSet {
             update(newValue: annotation)
         }
     }

     private func update(newValue: MKAnnotation?) {
         self.markerTintColor = .systemBlue
         self.glyphImage = .waterMill
     }
 }

you map your annotation as always:

public func mapView(_ mapView: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView? {
    if let userAnnotationView = mapView.dequeueReusableAnnotationView(withIdentifier: UserMarkerAnnotationView.REUSEIDENTIFIER) as? UserMarkerAnnotationView {
        userAnnotationView.annotation = userAnnotation
        return userAnnotationView
    } else {
        let userAnnotationView = UserMarkerAnnotationView(annotation: userAnnotation, reuseIdentifier: UserMarkerAnnotationView.REUSEIDENTIFIER)
        return userAnnotationView
    }
}

Replace the watermill with an image you want or let the user upload an image.

By default, Apple removes color from glyphimage.

To get a colored image, see my answer here: colored image for MKMarkerAnnotationView in MapKit

Custom User image

Upvotes: 0

Related Questions