IOS 7 - Custom Map Callout

I am trying to create a custom map tooltip that looks like this:

enter image description here

As you can see, I need custom contacts and custom callouts. The color of the pins is based on the rating, like the color of the circle in the leader.

Here is the code I have so far:

    - (MKAnnotationView *)mapView:(MKMapView *)mapView viewForAnnotation:(id<MKAnnotation>)annotation
{
    if ([annotation isKindOfClass:[CustomAnnotation class]])
    {
        static NSString *identifier = @"CustomAnnotation";

        MKPinAnnotationView *annotationView = (MKPinAnnotationView *)[self.map dequeueReusableAnnotationViewWithIdentifier:identifier];

        if (annotationView == nil)
        {
            annotationView = [[MKPinAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:identifier];

            annotationView.enabled = YES;
            annotationView.canShowCallout = NO;
            annotationView.animatesDrop = NO;
        }
        else
        {
            annotationView.annotation = annotation;
        }

        CustomAnnotation *myAnnotation= (CustomAnnotation *)annotation;

        // Based on the score, set the pin image
        if ([myAnnotation.score intValue] == 1)
        {
            annotationView.image = [UIImage imageNamed:@"dot_purple_xsmall.png"];
        }
        else if (...)
        {
            // and so on...
        }

        return annotationView;
    }

    return nil;
}

    - (void)mapView:(MKMapView *)mapView didSelectAnnotationView:(MKAnnotationView *)view
{
    if (![view.annotation isKindOfClass:[MKUserLocation class]])
    {
        CustomCalloutView *callout = CustomCalloutView *)[[[NSBundle mainBundle]loadNibNamed:@"MyCallout" owner:self options:nil] objectAtIndex:0];

        CGRect calloutViewFrame = callout.frame;
        calloutViewFrame.origin = CGPointMake(-calloutViewFrame.size.width / 2 + 15, -calloutViewFrame.size.height);
        callout.frame = calloutViewFrame;

        // TODO: Set the outlets of the xib
        callout.nameLabel.text = @"Testing";

        [view addSubview:callout];
    }
}

    - (void)mapView:(MKMapView *)mapView didDeselectAnnotationView:(MKAnnotationView *)view
{
    for (UIView *subView in view.subviews)
    {
        [subView removeFromSuperview];
    }
}

      

The custom pins work fine, but when I click on the pin, all I get is a black look. The app also uses a navigation and tab controller.

+3


source to share





All Articles