iPhone/iPad – Adding overlay

This blog is about adding custom overlay to a map. Overlays like polygon and circle can be added to the map. For instance you want to highlight or outline an area of a state or states in a country. In my application i have outlined all the states in US.

MKMapKit provides MKPolygon class and add overlay to achieve this. This can be done with easy four steps
1. Initialize map
2. Get coordinates
3. Create Polygon and add to map.
4. Implement delegate
1. Initialize Map :
Initialize the map view and add it as subview.

MKMapView _mapView = [[MKMapView alloc] initWithFrame:CGRectMake(0, 28, 360, 250)];

MKCoordinateRegion region;

region.center.latitude = 42.5116;

region.center.longitude = -90.6290;

region.span.longitudeDelta = 26.0;

region.span.latitudeDelta = 26.0;

_mapView.showsUserLocation = NO;

[_mapView setScrollEnabled:YES];

[_mapView setRegion:region];

[_mapView setDelegate:self];

[self.view addSubview:_mapView];

2. Get Coordinates
Here in this example, i have outlined all the US states. So to draw a polygon we need coordinates of all the state. Coordinates can be saved in local file or local database. This is the link to get coordinates of all US state
3. CreatePolygon:
Below is the code to add polygon

NSMutableArray* points; (contains coordinates of particular state)

CLLocationCoordinate2D *coords =

malloc(sizeof(CLLocationCoordinate2D) * [points count]);


for(int idx = 0; idx < [points count]; idx++) {

CLLocation* location = [points objectAtIndex:idx];

coords[idx] = CLLocationCoordinate2DMake(location.coordinate.latitude, location.coordinate.longitude);


polygon = [MKPolygon polygonWithCoordinates:coords count:[points count]];


[_mapView addOverlay:polygon];


3. Implement Delegate



– (MKOverlayView *)mapView:(MKMapView *)mapView viewForOverlay:(id )overlay


MKPolygonView *polygonView = [[[MKPolygonView alloc] initWithPolygon:overlay] autorelease];

polygonView.lineWidth = 0.5;

polygonView.strokeColor = [UIColor whitecolor];

polygonView.fillColor = [[UIColor colorWithRed:0.9176 green:0.9098 blue:0.8117 alpha:1.0] colorWithAlphaComponent:0.5];;

return polygonView;



zooming also taken care by this implementation. We dont need to do extra coding to handle zoom.

How to work with Core Motion Gyroscope?

It’s a simple app that utilizes Core Motion to roll an object on screen in the direction that the user is rolling the device. Hold the device upright (in portrait mode) and rotate clockwise/counter-clockwise.

You can grab the source code directly below:


How to Move Image using Touch Function in iPhone?

This is the very simple application. In this application we will see how to image move using touch. So let see how it will work.

Step 1 : Open the Xcode, Create a new project using View Base application. Give the application “Touch_Image”.

Step 2: Xcode automatically creates the directory structure and adds essential frameworks to it. You can explore the directory structure to check out the content of the directory.

Step 3: We need add also two resource in the project.

Step 4: In the Touch_ImageViewController.h file, make the following changes.

#import <UIKit/UIKit.h> 

@interface Touch_ImageViewController : UIViewController {
UIImageView *image;
@property (nonatomic,retain) IBOutlet UIImageView *image;

Step 5: Double click the Touch_ImageViewController.xib file and open it to the interface builder. First select the view and bring up Attribute Inspector and change the background color. Drag the label from the library and place it to the view window. Select the label and bring up Attributes Inspector and the text to “Touch Anywhere” . Now drag the ImageView from the library and place it to the view window. Select the Image View from the view and bring up Attribute Inspector and select the litchi-big.png image. Connect File’s Owner icon to the image view and select image. Now save the .xib file, save it and go back to the Xcode.

Step 6: Open the Touch_ImageViewController.m file and make the following changes:

#import “Touch_ImageViewController.h” 

@implementation Touch_ImageViewController

@synthesize image;

– (void)dealloc
[super dealloc];

-(void)touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event

UITouch *touch = [[event allTouches] anyObject];
CGPoint touchLocation = [touch locationInView:touch.view];
image.center = touchLocation;

– (void)didReceiveMemoryWarning

[super didReceiveMemoryWarning];


#pragma mark – View lifecycle

– (void)viewDidUnload
[super viewDidUnload];

return (interfaceOrientation == UIInterfaceOrientationPortrait);



Step 7: Now compile and run the application on the Simulator.