Is it possible to call animatesDrop in a MKAnnotationView rather than MKPinAnnotationView?

Question

do you know that MKPinAnnotationView has a method "animatesDrop" to animate a pin annotation from the top to point on the map with a shadow? OK, is it possible do this with a custom image??

Flaggy

Answer 1

You can always do your custom animation in MKMapViewDelegate method.

- (void)mapView:(MKMapView *)mapView didAddAnnotationViews:(NSArray *)views

Probably something like that (you won't get the fancy shadow animation, if you want it you need to do it yourself) :

- (void) mapView:(MKMapView *)mapView didAddAnnotationViews:(NSArray *)views {
    CGRect visibleRect = [mapView annotationVisibleRect]; 
    for (MKAnnotationView *view in views) {
       CGRect endFrame = view.frame;

       CGRect startFrame = endFrame; startFrame.origin.y = visibleRect.origin.y - startFrame.size.height;
       view.frame = startFrame;

       [UIView beginAnimations:@"drop" context:NULL]; 
       [UIView setAnimationDuration:1];

       view.frame = endFrame;

       [UIView commitAnimations];
    }
}

Swift Version

func mapView(mapView: MKMapView, didAddAnnotationViews views: [MKAnnotationView]) {
    let visibleRect = mapView.annotationVisibleRect

    for view:MKAnnotationView in views{
        let endFrame:CGRect = view.frame
        var startFrame:CGRect = endFrame
        startFrame.origin.y = visibleRect.origin.y - startFrame.size.height
        view.frame = startFrame;

        UIView.beginAnimations("drop", context: nil)
        UIView.setAnimationDuration(1)

        view.frame = endFrame;

        UIView.commitAnimations()
    }
}

Epiphenomenalism

@gcamp: i've try also in this way but not work (the image not change): MKPinAnnotationView *annView=[mapView dequeueReusableAnnotationViewWithIdentifier:ident]; annView=[[[MKPinAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:ident]autorelease]; annView.image =[UIImage imageNamed:@"annotImg.png"]; annView.animatesDrop=TRUE; – Flaggy

Nice work! Found this link as well, which is very similar … so now all we need is the squish effect at the end. Probably another animation that momentarily squishes the image height at the tail end. #1857660 – Ludivinaludlew

Answer 2

Same answer as @gcamp only in Swift for those interested

func mapView(mapView: MKMapView, didAddAnnotationViews views: [MKAnnotationView]) {
    let visibleRect = mapView.annotationVisibleRect

    for view:MKAnnotationView in views{
        let endFrame:CGRect = view.frame
        var startFrame:CGRect = endFrame
        startFrame.origin.y = visibleRect.origin.y - startFrame.size.height
        view.frame = startFrame;

        UIView.beginAnimations("drop", context: nil)
        UIView.setAnimationDuration(1)

        view.frame = endFrame;

        UIView.commitAnimations()
    }
}

Parry

Answer 3

Thanks @gcamp for your answer, it works fine but I modify it a bit to be accurate for where the view will be dropped on mapView, check the below code:

- (void)mapView:(MKMapView *)mapView didAddAnnotationViews:(NSArray *)views
{
CGRect visibleRect = [mapView annotationVisibleRect];
for (MKAnnotationView *view in views)
 {
    CGRect endFrame = view.frame;
    endFrame.origin.y -= 15.0f;
    endFrame.origin.x += 8.0f;
    CGRect startFrame = endFrame;
    startFrame.origin.y = visibleRect.origin.y - startFrame.size.height;
    view.frame = startFrame;

    [UIView beginAnimations:@"drop" context:NULL];
    [UIView setAnimationDuration:0.2];

    view.frame = endFrame;

    [UIView commitAnimations];
 }
}

Inflect

Answer 4

updated for ios 14

func mapView(_ mapView: MKMapView, didAdd views: [MKAnnotationView]) {
    let visibleRect = mapView.annotationVisibleRect
    for view: MKAnnotationView in views {
        let endFrame:CGRect = view.frame
        var startFrame:CGRect = endFrame
        startFrame.origin.y = visibleRect.origin.y - startFrame.size.height
        view.frame = startFrame
        UIView.animate(withDuration: 1.5, animations: {
            view.frame = endFrame
        }, completion: nil)
    }
}

Malaise