Question

Without getting into OpenGL (Quartz 2D is OK):

1. Let’s say I have an image which I want to move across a map in some fluid way. For instance, an image of a plane “flying” across the map. I’ve been able to do this using an MKAnnotation, an NSTimer and fiddling with the rate of lat/lon change and timer rate. However, I assume this isn’t ideal, although the results look pretty decent. Can you think of a better way?

2. Now let’s say that I want this image to be animated (think: animated gif). I can’t do the usual UIImageView with a series of animationFrames because all I have access to in MKAnnotationView is a UIImage. How would you guys tackle this?

I realize that #2 could be handled with a UIImageView on top of the map containing the animationImages. However, then I would have to manually handle translating the movement of the plane or rocket or whatever as the region of the mapview changed, depending on user movements in the real-world, or user zooming (scrolling is not allowed in my app).

What do you think?

Answer 1

I think I’ve figured out a solution to #2. I subclassed MKAnnotationView and wrote some code to add a UIImageView (with animation images) as a subview.

//AnimatedAnnotation.h

#import <Foundation/Foundation.h>
#import <MapKit/MapKit.h>

@interface AnimatedAnnotation : MKAnnotationView
{
    UIImageView* _imageView;
    NSString *imageName;
    NSString *imageExtension;
    int imageCount;
    float animationDuration;
}

@property (nonatomic, retain) UIImageView* imageView;
@property (nonatomic, retain) NSString* imageName;
@property (nonatomic, retain) NSString* imageExtension;
@property (nonatomic) int imageCount;
@property (nonatomic) float animationDuration;


- (id)initWithAnnotation:(id <MKAnnotation>)annotation reuseIdentifier:(NSString *)reuseIdentifier imageName:(NSString *)name imageExtension:(NSString *)extension imageCount:(int)count animationDuration:(float)duration
;

@end

//AnimatedAnnotation.m

#import "AnimatedAnnotation.h"

@implementation AnimatedAnnotation
@synthesize imageView = _imageView;
@synthesize imageName, imageCount, imageExtension,animationDuration;

- (id)initWithAnnotation:(id <MKAnnotation>)annotation reuseIdentifier:(NSString *)reuseIdentifier imageName:(NSString *)name imageExtension:(NSString *)extension imageCount:(int)count animationDuration:(float)duration
{
    self = [super initWithAnnotation:annotation reuseIdentifier:reuseIdentifier];
    self.imageCount = count;
    self.imageName = name;
    self.imageExtension = extension;
    self.animationDuration = duration;
    UIImage *image = [UIImage imageNamed:[NSString stringWithFormat:@"%@0.%@",name,extension]];
    self.frame = CGRectMake(0, 0, image.size.width, image.size.height);
    self.backgroundColor = [UIColor clearColor];


    _imageView = [[UIImageView alloc] initWithFrame:self.frame];
    NSMutableArray *images = [[NSMutableArray alloc] init];
    for(int i = 0; i < count; i++ ){
        [images addObject:[UIImage imageNamed:[NSString stringWithFormat:@"%@%d.%@", name, i, extension]]];
    }


    _imageView.animationDuration = duration;
    _imageView.animationImages = images;
    _imageView.animationRepeatCount = 0;
    [_imageView startAnimating];

    [self addSubview:_imageView];

    return self;
}

-(void) dealloc
{
    [_imageView release];
    [super dealloc];
}


@end