MKPinAnnotationView custom Image is replaced by pin with animating drop

ios, mkmapview, mkpinannotationview, objective-c

Solution

When you want to use your own image for an annotation view, it's best to create a regular `MKAnnotationView` instead of an `MKPinAnnotationView`.

Since `MKPinAnnotationView` is a subclass of `MKAnnotationView`, it has an `image` property but it generally (usually when you don't expect it) ignores it and displays its built-in pin image instead.

So rather than fighting with it, it's best to just use a plain `MKAnnotationView`.

The big thing you lose by not using `MKPinAnnotationView` is the built-in drop animation which you'll have to implement manually.

See this previous answer for more details: MKMapView: Instead of Annotation Pin, a custom view

Problem

I'm displaying user avatar images on a MapView. The avatars appear to be working if they are rendered without animation, however I'd like to animate their drop. If I set pinView.animatesDrop to true, then I lose the avatar and it is replaced by the pin. How can I animate the drop of my avatar without using the pin? Here is my viewForAnnotation method I'm using: ``` - (MKAnnotationView *)mapView:(MKMapView *)mapView viewForAnnotation:(id <MKAnnotation>)annotation { if ([annotation isKindOfClass:[MKUserLocation class]]) return nil; MKPinAnnotationView* pinView = (MKPinAnnotationView*)[self.mapView dequeueReusableAnnotationViewWithIdentifier:@"MyAnnotation"]; if (!pinView) { pinView = [[MKPinAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:@"CustomPinAnnotation"]; } else pinView.annotation = annotation; //If I set this to true, my image is replaced by the pin //pinView.animatesDrop = true; //I'm using SDWebImage [pinView setImageWithURL:[NSURL URLWithString:@"/pathtosomeavatar.png"] placeholderImage:[UIImage imageNamed:@"placeholder.png"]]; //Adding a nice drop shadow here pinView.layer.shadowColor = [UIColor blackColor].CGColor; pinView.layer.shadowOffset = CGSizeMake(0, 1); pinView.layer.shadowOpacity = 0.5; pinView.layer.shadowRadius = 3.0; return pinView; } ```

Original source

Related problems