Background
In iOS6, I used to add several MKPolygon
(overlays) on the MKMapView and to provide a specific MKOverlayView
to the mapView:viewForOverlay:
callback (see MKMapViewDelegate Class Reference). This specific view's job was to fill the polygon with a custom pattern using Quartz 2D. It did work fine.
Now, this does not seem to work anymore on iOS7 the way I used to do it.
Because mapView:viewForOverlay:
is deprecated in iOS SDK7 as well as MKOverlayView
and its subclasses, I have tried switching to mapView:rendererForOverlay:
and subclassing MKOverlayRenderer
without success: The problems encountered are the same.
The following sample codes will therefore use MKOverlayView but you can easily replace view/View with renderer/Renderer in the code bellow and get the same effect.
Problem encountered
I have reduced the problem to the smallest code sample able to reproduce it and the result is the following:
On iOS6 (as expected):
On iOS7 (not as expected):
I am expecting to have my polygons filled, always with the same pattern, and that the pattern's size remains the same on the screen independently of the map's zoom level.
Alas, on iOS7 and when adding more than one overlay on the map, the pattern's size on screen decreases while zooming out on some part of the polygon. The pattern gets its right size only when zooming in at max zoom level.
The problem does not appear:
mapView:insertOverlay:atIndex:
)The problem seems to happen even when only one patterned overlay was added as well as other not-patterned overlays.
Code samples
MTViewController.h
#import <UIKit/UIKit.h>
#import <MapKit/MapKit.h>
@interface MTViewController : UIViewController<MKMapViewDelegate>
@property (strong, nonatomic) IBOutlet MKMapView *mapView;
@end
MTViewController.m
#import "MTViewController.h"
#import <MapKit/MapKit.h>
#import "MTPolygonWithPatternOverlayView.h"
@implementation MTViewController
- (void)dealloc {
self.mapView.delegate = nil;
}
- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil {
self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
if (self) {
self.title = @"MapTest - CGPattern";
}
return self;
}
- (void)viewDidLoad {
[super viewDidLoad];
self.mapView.delegate = self;
// Add a 4 polygon overlays on the map
int count = 0;
float delta = 0.012;
for (int i = 0; i < 4; i++) {
CLLocationCoordinate2D coords[4];
coords[0] = CLLocationCoordinate2DMake(58.395,15.555 + (i*delta));
coords[1] = CLLocationCoordinate2DMake(58.390,15.560 + (i*delta));
coords[2] = CLLocationCoordinate2DMake(58.385,15.555 + (i*delta));
coords[3] = CLLocationCoordinate2DMake(58.390,15.550 + (i*delta));
MKPolygon *overlay = [MKPolygon polygonWithCoordinates:coords count:4];
[self.mapView insertOverlay:overlay atIndex:count++];
}
// Zoom to region containing polygons
MKCoordinateRegion region = MKCoordinateRegionMake(CLLocationCoordinate2DMake(58.390,15.561), MKCoordinateSpanMake(0.015, 0.015));
[self.mapView setRegion:[self.mapView regionThatFits:region] animated:NO];
}
- (MKOverlayView *)mapView:(MKMapView *)mapView viewForOverlay:(id<MKOverlay>)overlay {
MKOverlayView *overlayView = nil;
if ([overlay isKindOfClass:[MKPolygon class]]) {
MTPolygonWithPatternOverlayView *polygonOverlayView = [[MTPolygonWithPatternOverlayView alloc] initWithPolygon:overlay];
polygonOverlayView.alpha = 1.0f;
polygonOverlayView.strokeColor = [UIColor blueColor];
polygonOverlayView.lineWidth = 3.0f * [[UIScreen mainScreen] scale];
overlayView = polygonOverlayView;
}
return overlayView;
}
@end
MTPolygonWithPatternOverlayView.h
#import <MapKit/MapKit.h>
@interface MTPolygonWithPatternOverlayView : MKPolygonView
@end
MTPolygonWithPatternOverlayView.m
#import "MTPolygonWithPatternOverlayView.h"
@implementation MTPolygonWithPatternOverlayView
void patternReleaseInfoCallback(void *info) {
}
void drawPatternCell(void *info, CGContextRef context) {
float cellWidth = CGContextGetClipBoundingBox(context).size.width;
float cellHeight = CGContextGetClipBoundingBox(context).size.height;
// Make line width look constant on screen independently of map zoom level
CGFloat lineWidth = [[UIScreen mainScreen] scale] * cellWidth / 64.0f;
CGContextSetLineWidth(context, lineWidth);
// Draw following pattern in cell:
// \ /
// \ /
// \ _ /
// |_|
// / \
// / \
// / \
// Draw diagonal
CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
CGPoint points [] = {{0.0,0.0}, {cellWidth,cellHeight }, {cellWidth,0.0}, {0.0,cellHeight}};
CGContextStrokeLineSegments(context, points, 4);
// Draw middle square
CGContextSetFillColorWithColor(context, [UIColor blackColor].CGColor);
float partWidth = cellWidth / 8;
CGRect middleSpot = CGRectMake(partWidth * 3, partWidth*3, 2* partWidth, 2*partWidth);
CGContextFillRect(context, middleSpot);
}
- (void)fillPath:(CGPathRef)path inContext:(CGContextRef)context {
CGPatternCallbacks callBack;
callBack.drawPattern = &drawPatternCell;
callBack.releaseInfo = &patternReleaseInfoCallback;
callBack.version = 0;
float cellWidth = CGContextGetClipBoundingBox(context).size.width / 4;
CGPatternRef pattern = CGPatternCreate(NULL, CGRectMake(0.0f, 0.0f, cellWidth, cellWidth), CGAffineTransformIdentity, cellWidth, cellWidth, kCGPatternTilingConstantSpacing, true, &callBack);
CGContextSaveGState(context);
CGColorSpaceRef patternSpace = CGColorSpaceCreatePattern (NULL);
CGContextSetFillColorSpace (context, patternSpace);
CGContextAddPath(context, path);
float alpha = 1;
CGContextSetFillPattern(context, pattern, &alpha);
CGContextDrawPath(context, kCGPathFill);
CGContextRestoreGState(context);
CGColorSpaceRelease (patternSpace);
CGPatternRelease(pattern);
}
@end
Question
I'm on my way to report this as a bug on Apple's bug tracker but I wanted to check first if someone else finds a flaw in my use the MapKit and Quartz 2D.
Edit #1: I have tried to make fillPath
's code thread safe by wrapping it in a dispatch_sync
call on a common queue but it doesn't fix the problem.
Edit #2: Not fixed in iOS 7.0.3
Issue was actually a bug and addressed from iOS 7.1