Keep the pin (MKAnnotation) on the center when user scroll the map

Question

I would like keep the MKAnnotaion on the centre of the screen when the user scoll the map like Careem app:

So far I managed to show the pin, update the pin position but when I scroll the map, the annotation in my code initially moves and then gets back to the centre. I would like the pin to remain on the centre.

  @IBOutlet var mapView: MKMapView!
  var centerAnnotation = MKPointAnnotation()
  var manager:CLLocationManager!

 override func viewDidLoad() {
    super.viewDidLoad()
    manager = CLLocationManager() //instantiate
    manager.delegate = self // set the delegate
    manager.desiredAccuracy = kCLLocationAccuracyBest // required accurancy

    manager.requestWhenInUseAuthorization() // request authorization
    manager.startUpdatingLocation() //update location

    var lat = manager.location.coordinate.latitude // get lat
    var long = manager.location.coordinate.longitude // get long
    var coordinate = CLLocationCoordinate2DMake(lat, long)// set coordinate

    var latDelta:CLLocationDegrees = 0.01 // set delta
    var longDelta:CLLocationDegrees = 0.01 // set long
    var span:MKCoordinateSpan = MKCoordinateSpanMake(latDelta, longDelta)
    var region:MKCoordinateRegion = MKCoordinateRegionMake(coordinate, span)

    self.mapView.setRegion(region, animated: true)
    centerAnnotation.coordinate = mapView.centerCoordinate
    self.mapView.addAnnotation(centerAnnotation)
}

func mapView(mapView: MKMapView!, regionDidChangeAnimated animated: Bool) {
    centerAnnotation.coordinate = mapView.centerCoordinate;
}

****UPDATE****

As suggested by Anna I have added a view to the map. Here the code:

var newPoint = self.mapView.convertCoordinate(mapView.centerCoordinate, toPointToView: self.view)



    var pinImage = UIImage(named: "yoga_pins.png")
    var imageView = UIImageView(image: pinImage) // set as you want

    imageView.image = pinImage
    imageView.backgroundColor = UIColor.clearColor()
    imageView.contentMode = UIViewContentMode.Center
    imageView.center.y = newPoint.y
    imageView.center.x = newPoint.x


    self.view.addSubview(imageView)

the only problem is that when the map is loaded the first time, the annotation which is located on the mapView.centerCoordinate and I am gonna use to get the latitude and longitude:

when I then scroll the map, the pin moves in the correct position (under the image):

    func mapView(mapView: MKMapView!, regionDidChangeAnimated animated: Bool) {
    centerAnnotation.coordinate = mapView.centerCoordinate;

}

Bayou

Don't use an actual annotation. For a smooth, floating effect, see this approach: #20732089 – Argentum

@Anna thanks. Amazing way to do it. I was probably looking for the wrong question/answer. – Bayou

@Anna can you please look at my updated code and see what I am doing wrong? Thanks a lot – Bayou

Answer 1

I recommend you DSCenterPinMapView

It is a custom MapView with an animated and customizable center pin useful for selecting locations in map.

You should install the Pod and then, as a solution to your question you should implement the delegate so that you can get the location where pin drops.

pinMapView.delegate = self

extension MyViewController: DSCenterPinMapViewDelegate {

    func didStartDragging() {
        // My custom actions
    }

    func didEndDragging() {
        // My custom actions
        selectedLocation = pinMapView.mapview.centerCoordinate
    }

}

Ussery

Answer 2

You can use custom button. Add that button on centre of the map. Just show and hide that button according to your conditions. So when you move map that button stay on same position that is centre of the map.

Orth