How do I display a UIPopoverView as a annotation to the map view? (iPad)

Question

On the maps app in the IPad when you tap a pin you get a normal annotation with an \"i\" instead of a disclosure indicator. A further tap on the \"i\" reveals a popover view

Answer 1

First add an annotation to the map and in the viewForAnnotation method, set the rightCalloutAccessoryView to a button of type, say, UIButtonTypeDetailDisclosure (I don't think the blue info button is available by default).

Pressing the button will call the calloutAccessoryControlTapped delegate method. In this method, deselect the annotation and show your popover. For example:

- (void)mapView:(MKMapView *)mapView annotationView:(MKAnnotationView *)view calloutAccessoryControlTapped:(UIControl *)control
{
    [mapView deselectAnnotation:view.annotation animated:YES];

    YourContentViewController *ycvc = [[YourContentViewController alloc] init...
    UIPopoverController *poc = [[UIPopoverController alloc] initWithContentViewController:ycvc];
    [ycvc release];

    //hold ref to popover in an ivar
    self.annotationPopoverController = poc;

    //size as needed
    poc.popoverContentSize = CGSizeMake(320, 400);

    //show the popover next to the annotation view (pin)
    [poc presentPopoverFromRect:view.bounds inView:view 
        permittedArrowDirections:UIPopoverArrowDirectionAny animated:YES];

    [poc release];
}

YourContentViewController is a subclass of UIViewController which you can code like any other view controller. The Maps app looks like it has UITableView in the content.

Answer 2

You can use a library like Gordon Hughes' Animated Callout. Unfortunately it's still not working perfectly on iOS 6 (callouts show up strangely).

Here's iOS 5:

Answer 3

My requirement was similar to this issue, but also needed to allow users to interact with the map (panning and zooming) while the callout is displayed. For this I've created this github project: https://github.com/crarau/mapkit-custom-callout

Answer 4

It appears that to have a better position for the popover you must present it from this rect:

CGPoint lc_point = [mapView convertCoordinate:view.annotation.coordinate toPointToView:mapView];
CGRect lc_frame = CGRectMake(lc_point.x,lc_point.y-view.frame.size.height,0,0);