360iDev MapKit Presentation - Denver 2009

Maps on the
iPhone
Using MapKit for Fun and Profit

Wednesday, September 30, 2009 1

Add A MKMapView


Tweak Parameters

Show the blue breathing dot

Then Build and Go...


And Bada-Boom
A Map App


But we want more,
like the breathing
Blue Dot


Where we are
Headed
‘Right’ Action - Details

‘Left’ Action - Shake Map

Animated ‘Breathing’


Stuff To Do
• View Based Project
• Parse XML from USGS
• Create Earthquakes
• Store Earthquakes
• Add Annotations
• Provide Annotation Views
• Respond to Events


View Based Project
Connect the
MapView to our VC

Parse XML
NSOperationQueue

operation
NSOperation
thread

parseForData:

addOperation:

Parse XML
EarthquakeParser

initWithContentsOfURL:

parse
invokeOnMainThread:
didStartElement:
foundCharcters:
didEndElement:
NSXMLParser
event
loop

addEarthquake:
parserFinished

EarthquakeParserDelegate
(MapQuakesViewController)

Don’t block the main event thread!


NSOperationQueue

operation
NSOperation
thread

Parse XML
parseForData:

addOperation: EarthquakeParser

Kick Off The Parse parseForData: is on an alternate thread,
won’t block event thread while
downloading the XML


EarthquakeParser

initWithContentsOfURL:

Parse XML
parse

NSXMLParser

Parse XML on the Each XML Event comes to the parser’s
delegate on the alternate thread
alternate thread

NSXMLParser Kick-off
- (BOOL)parseForData {
NSAutoreleasePool *pool = [[NSAutoreleasePool alloc] init];
[UIApplication sharedApplication].networkActivityIndicatorVisible = YES;
NSURL *url = [NSURL URLWithString:feedURLString];

Parse XML
BOOL success = NO;
NSXMLParser *parser = [[NSXMLParser alloc] initWithContentsOfURL:url];
[parser setDelegate:self];
[parser setShouldProcessNamespaces:NO];
[parser setShouldReportNamespacePrefixes:NO];
[parser setShouldResolveExternalEntities:NO];
success = [parser parse];
NSError *parseError = [parser parserError];
if (parseError) {
! NSLog(@"parse error = %@", parseError);
}
[parser release];
[pool drain];
return success;
}


Create Earthquakes
EarthquakeParser

didStartElement:
foundCharcters:
didEndElement:
NSXMLParser

Parse XML on the Each XML Event comes to the parser’s
delegate on the alternate thread
alternate thread

Entry Element starts
and Earthquake
- (void)parser:(NSXMLParser *)parser didStartElement:(NSString *)elementName
namespaceURI:(NSString *)namespaceURI qualifiedName:(NSString *)qName

Create Earthquakes
attributes:(NSDictionary *)attributeDict {
if(nil != qName) {
elementName = qName; // swap for the qName if we have a name space
}

if ([elementName isEqualToString:@"entry"]) {
self.currentEarthquake = [[[Earthquake alloc] init] autorelease];
} else if([elementName isEqualToString:@"link"]) {
// ignore the related content and just grab the alternate
if ([[attributeDict valueForKey:@"rel"] isEqualToString:@"alternate"]) {
NSString *link = [attributeDict valueForKey:@"href"];
self.currentEarthquake.detailsURL =
[NSString stringWithFormat:@"http://earthquake.usgs.gov/%@", link];
}
} else if([elementName isEqualToString:@"title"] ||
[elementName isEqualToString:@"updated"] ||
[elementName isEqualToString:@"id"] ||
[elementName isEqualToString:@"georss:point"] ||
[elementName isEqualToString:@"georss:elev"]) {
self.propertyValue = [NSMutableString string];
} else {
self.propertyValue = nil;
}
}


EarthquakeParser Back to the Main
Thread

Store Earthquakes
invokeOnMainThread:

event
loop

addEarthquake:

Let the main thread know an earthquake was
found by pushing the addEarthquake: and
parserFinished methods onto the main thread


Ending Element Pushes
Earthquake

Store Earthquakes
- (void)parser:(NSXMLParser *)parser didEndElement:(NSString *)elementName
namespaceURI:(NSString *)namespaceURI qualifiedName:(NSString *)qName {
...
} else if([elementName isEqualToString:@"entry"]) {
Earthquake *quake = self.currentEarthquake;
self.currentEarthquake = nil;
[(id)[self delegate] performSelectorOnMainThread:@selector(addEarthquake:)
withObject:quake
waitUntilDone:NO];
}
}


MapQuakesVC holds the
Earthquakes

Store Earthquakes
- (void)addEarthquake:(Earthquake *)earthquake {
[self.earthquakes addObject:earthquake];
}


EarthquakeParser Back to the Main
Thread

Add Annotations
invokeOnMainThread:

event
loop

parserFinished

EarthquakeParserDelegate Once all the XML is parsed we tell the delegate
(MapQuakesViewController) which displays the earthquakes in the form of an
annotation.


Back to the Main Thread
Again

Add Annotations
- (void)parserDidEndDocument:(NSXMLParser *)parser {
[(id)[self delegate] performSelectorOnMainThread:@selector(parserFinished)
withObject:nil
waitUntilDone:NO];
[UIApplication sharedApplication].networkActivityIndicatorVisible = NO;
[self autorelease];
}


Display Earthquakes as
Annotations

Add Annotations
- (void)parserFinished {
[self displayEarthquakes];
}


Remove Old Annotations
- (void)displayEarthquakes {

Add Annotations
[self removeAnnotations];
NSArray *visibleQuakes = [self sortAndFilterEarthquakes];
// limit the numer to 100
if(visibleQuakes.count > 100) {
// remove the earthquakes from the top of the
// list until we are down to 100
NSUInteger removeCount = visibleQuakes.count - 100;
NSRange keepers = {removeCount, 100}; // location and length
visibleQuakes = [visibleQuakes subarrayWithRange:keepers];
}

for(Earthquake *earthquake in visibleQuakes) {
EarthquakeAnnotation *eqAnn = [EarthquakeAnnotation
annotationWithEarthquake:earthquake];
[self.mapView addAnnotation:eqAnn];
}
}


Find Visible Quakes
Sorted by Magnitude

Add Annotations
}

}
}


Limit Earthquakes to
100

Add Annotations
}

}
}


Find and Display
Earthquakes

Add Annotations
}

}
}


Remove old Earthquake
Annotations

Add Annotations
- (void) removeAnnotations {
// remove the old annotations but
// don't modify the array while iterating
NSArray *annotationsCopy = [self.mapView.annotations copy];
for(id annotation in annotationsCopy) {
if([[annotation class] isSubclassOfClass:[EarthquakeAnnotation class]]) {
[self.mapView removeAnnotation:annotation];
}
}
[annotationsCopy release];
}


Filter Visible
Earthquakes
- (NSArray *)sortAndFilterEarthquakes {

Add Annotations
// find the visible earthquakes
MKCoordinateRegion region = [self.mapView region];
LocationBoundingBox bbox = LocationBoundingBoxMake(region.center, region.span);
NSPredicate *latPred = [NSPredicate predicateWithFormat:
@"latitude BETWEEN {%@, %@}",
[NSNumber numberWithFloat:bbox.min.latitude],
[NSNumber numberWithFloat:bbox.max.latitude]];
NSPredicate *lonPred = [NSPredicate predicateWithFormat:
@"longitude BETWEEN {%@, %@}",
[NSNumber numberWithFloat:bbox.min.longitude],
[NSNumber numberWithFloat:bbox.max.longitude]];
NSArray *predicates = [NSArray arrayWithObjects:latPred, lonPred, nil];
NSPredicate *locationPred = [NSCompoundPredicate
andPredicateWithSubpredicates:predicates];
NSArray *quakes = [self.earthquakes
filteredArrayUsingPredicate:locationPred];
NSSortDescriptor *descriptor = [[NSSortDescriptor alloc]
initWithKey:@"magnitude"
ascending:YES];
NSArray *descriptors = [NSArray arrayWithObject:descriptor];
NSArray *sortedEarthquakes = [quakes sortedArrayUsingDescriptors:descriptors];
[descriptor release];
return sortedEarthquakes;
}


Sort Earthquakes
- (NSArray *)sortAndFilterEarthquakes {

Add Annotations
// find the visible earthquakes
MKCoordinateRegion region = [self.mapView region];
LocationBoundingBox bbox = LocationBoundingBoxMake(region.center, region.span);
NSPredicate *latPred = [NSPredicate predicateWithFormat:
@"latitude BETWEEN {%@, %@}",
[NSNumber numberWithFloat:bbox.min.latitude],
[NSNumber numberWithFloat:bbox.max.latitude]];
NSPredicate *lonPred = [NSPredicate predicateWithFormat:
@"longitude BETWEEN {%@, %@}",
[NSNumber numberWithFloat:bbox.min.longitude],
[NSNumber numberWithFloat:bbox.max.longitude]];
NSArray *predicates = [NSArray arrayWithObjects:latPred, lonPred, nil];
NSPredicate *locationPred = [NSCompoundPredicate
andPredicateWithSubpredicates:predicates];
NSArray *quakes = [self.earthquakes
filteredArrayUsingPredicate:locationPred];
NSSortDescriptor *descriptor = [[NSSortDescriptor alloc]
initWithKey:@"magnitude"
ascending:YES];
NSArray *descriptors = [NSArray arrayWithObject:descriptor];
NSArray *sortedEarthquakes = [quakes sortedArrayUsingDescriptors:descriptors];
[descriptor release];
return sortedEarthquakes;
}


Provide Annotation Views

addAnnotation:

viewForAnnotation:

MKMapViewDelegate

delegate Provides
Annotation View

Return nil for user

location
- (MKAnnotationView *)mapView:(MKMapView *)mapView
viewForAnnotation:(id <MKAnnotation>)annotation {
MKAnnotationView *view = nil;
if(annotation != mapView.userLocation) {
!! EarthquakeAnnotation *eqAnn = (EarthquakeAnnotation*)annotation;
!! view = [self.mapView
dequeueReusableAnnotationViewWithIdentifier:@"earthquakeLoc"];
!! if(nil == view) {
view = [[[EarthquakeAnnotationView alloc]
initWithAnnotation:eqAnn
reuseIdentifier:@"earthquakeLoc"] autorelease];
!! }
view.annotation = annotation;
[view setCanShowCallout:YES];
UIButton *button = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];
[view setRightCalloutAccessoryView:button];
}
return view;
}


Reuse Annotation Views
!! }
}
return view;
}


Create if no re-useable

views exist
!! }
}
return view;
}


Conﬁgure View
!! }
}
return view;
}


Custom

MKAnnotationView
Subclass

EarthquakeAnnotationView


Conﬁgure the

Annotation View

- (void)setAnnotation:annotation {
[super setAnnotation:annotation];

[self.layer.sublayers makeObjectsPerformSelector:
@selector(removeFromSuperlayer)];

self.frame = CGRectMake(0.0f, 0.0f, 48.0f, 48.0f);

self.earthquake = [(EarthquakeAnnotation *)annotation earthquake];
[self addBreathingLayer];
[self addDarkCircleLayer];

}


Shape Layer
- (void) addBreathingLayer {
self.circleLayer = [CAShapeLayer layer];
CGColorRef color = [self newFillColor];
self.circleLayer.fillColor = color;
CGColorRelease(color);
color = [self newStrokeColor];
self.circleLayer.strokeColor = color;
self.circleLayer.lineWidth = 1.0f;
CGMutablePathRef path = CGPathCreateMutable();
CGRect square = CGRectMake(0.0f, 0.0f, 48.0f, 48.0f);
CGPathAddEllipseInRect(path, NULL, square);
self.circleLayer.path = path;
CGPathRelease(path);
self.circleLayer.frame = square;
CABasicAnimation *pathAnimation =
[CABasicAnimation animationWithKeyPath:@"path"];
pathAnimation.duration = 1.5f;
pathAnimation.timingFunction =
[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
pathAnimation.repeatCount = 1E100f;
pathAnimation.autoreverses = YES;
self.circleLayer.actions = [NSDictionary dictionaryWithObject:pathAnimation
forKey:@"path"];
[self.layer addSublayer:self.circleLayer];
}


Breathing Animation
- (void) addBreathingLayer {
self.circleLayer = [CAShapeLayer layer];
CGColorRef color = [self newFillColor];
self.circleLayer.fillColor = color;
color = [self newStrokeColor];
self.circleLayer.strokeColor = color;
self.circleLayer.lineWidth = 1.0f;
self.circleLayer.frame = square;
CABasicAnimation *pathAnimation =
[CABasicAnimation animationWithKeyPath:@"path"];
pathAnimation.duration = 1.5f;
pathAnimation.timingFunction =
[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
pathAnimation.repeatCount = 1E100f;
pathAnimation.autoreverses = YES;
self.circleLayer.actions = [NSDictionary dictionaryWithObject:pathAnimation
forKey:@"path"];
[self.layer addSublayer:self.circleLayer];
}


Selection Starts

Animation
- (void)setSelected:(BOOL)selected animated:(BOOL)animated {
[super setSelected:selected animated:animated];
if(YES == selected) {
// animate the bottom shape's path
EarthquakeParser *parser = [EarthquakeParser earthquakeParser];
parser.delegate = self;
[parser getShakeMapForEarthquake:self.earthquake];
} else {
[CATransaction begin];
[CATransaction setDisableActions:YES];
[CATransaction commit];
}
}


De-Selection Stops

Animation
- (void)setSelected:(BOOL)selected animated:(BOOL)animated {
[super setSelected:selected animated:animated];
if(YES == selected) {
// animate the bottom shape's path
EarthquakeParser *parser = [EarthquakeParser earthquakeParser];
parser.delegate = self;
[parser getShakeMapForEarthquake:self.earthquake];
} else {
[CATransaction begin];
[CATransaction setDisableActions:YES];
[CATransaction commit];
}
}


Selected Animation


‘Right’ Detail

Respond To Events
‘Left’ Shake Map


Open The Web Page

Respond To Events
- (void)mapView:(MKMapView *)mapView
annotationView:(MKAnnotationView *)view
calloutAccessoryControlTapped:(UIControl *)control {
NSURL *url = nil;
EarthquakeAnnotation *eqAnn = (EarthquakeAnnotation *)[view annotation];
if(view.rightCalloutAccessoryView == control) {
NSString *urlString = [eqAnn.earthquake.detailsURL
stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
url = [NSURL URLWithString:urlString];
} else {
NSString *urlString = [eqAnn.earthquake.shakeMapURL
stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
url = [NSURL URLWithString:urlString];
}
[[UIApplication sharedApplication] openURL:url];
}


Where To Now?
• Your data will likely have more
interesting selection criteria, exploit it
• The ‘detail’ from right and left buttons
can do lots more interesting stuff
• USGS Provides KML ﬁles for shake
maps
• Use Core Animation in the right or left
buttons


Summary

• Filtering your Annotations is important
if you have lots of data
• It’s easy to build your own custom
annotation views and add Core
Animation to them


Thanks!
Pragmatic iPhone Studio


360iDev MapKit Presentation - Denver 2009

More Related Content

Similar to 360iDev MapKit Presentation - Denver 2009 (13)

Recently uploaded (20)

360iDev MapKit Presentation - Denver 2009