Detect Tap on CalloutBubble in MKAnnotationView

Question

Im working with MKMapView and MKAnnotationView.

I have an annotation in the map. When the users tap on it, the callOut Bubble is displayed. When the annotation is tapped again ( and the callOut Bubble is visible ) i need to change to another view.

How can i detect the second tap, or the tap in the bubble?

Answer 1

Could you add a gesture recognizer when you're initializing the MKAnnotationView?

Here's the code for inside dequeueReusableAnnotationViewWithIdentifier:

UITapGestureRecognizer *tapGesture = 
        [[UITapGestureRecognizer alloc] initWithTarget:self 
                                        action:@selector(calloutTapped:)];
[theAnnotationView addGestureRecognizer:tapGesture];
[tapGesture release];

The method for the gesture recognizer:

-(void) calloutTapped:(id) sender { 
    // code to  display whatever is required next.

    // To get the annotation associated with the callout that caused this event:
    // id<MKAnnotation> annotation = ((MKAnnotationView*)sender.view).annotation;
}

Answer 2

Here's the swift version of Dhanu's answer, including getting data from the item selected to pass to the next view controller:

func mapView(mapView: MKMapView, didSelectAnnotationView view: MKAnnotationView) {
    let gesture = UITapGestureRecognizer(target: self, action: #selector(MyMapViewController.calloutTapped(_:)))
    view.addGestureRecognizer(gesture)
}

func calloutTapped(sender:UITapGestureRecognizer) {
    guard let annotation = (sender.view as? MKAnnotationView)?.annotation as? MyAnnotation else { return }

    selectedLocation = annotation.myData
    performSegueWithIdentifier("mySegueIdentifier", sender: self)
}

Answer 3

To tap the callout button after the user has clicked on the Annotation view, add a UITapGestureRecognizer in didSelectAnnotationView. This way you can implement tap on the callout without needing the accessory views.

You can then get the annotation object back from the sender for further action.

- (void)mapView:(MKMapView *)mapView didSelectAnnotationView:(MKAnnotationView *)view
{
    UITapGestureRecognizer *tapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self  action:@selector(calloutTapped:)];
    [view addGestureRecognizer:tapGesture];
}

-(void)calloutTapped:(UITapGestureRecognizer *) sender
{
    NSLog(@"Callout was tapped");

    MKAnnotationView *view = (MKAnnotationView*)sender.view;
    id <MKAnnotation> annotation = [view annotation];
    if ([annotation isKindOfClass:[MKPointAnnotation class]])
    {
        [self performSegueWithIdentifier:@"annotationDetailSegue" sender:annotation];
    }
}

Answer 4

Try to set custom image for button without changing UIButtonTypeDetailDisclosure type.

UIButton *detailButton = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];        
[detailButton setImage:[UIImage imageNamed:@"icon"] forState:UIControlStateNormal];

Answer 5

Swift 3, using On. You need to handle rightCalloutAccessoryView

func mapView(_ mapView: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView? {
  switch annotation {
  case let annotation as Annotation:
    let view: AnnotationView = mapView.dequeue(annotation: annotation)
    view.canShowCallout = true
    let button = UIButton(type: .detailDisclosure)
    button.on.tap { [weak self] in
      self?.handleTap(annotation: annotation)
    }
    view.rightCalloutAccessoryView = button
    return view
  default:
    return nil
  }
}