Tag: ios mapkit tutorial

MapKit example in iPhone

In this application we will see how to map display and how to point out any location using latitude and longitude.

Step 1: Create a View base application using template. Give the application name “MapKitDisplay”.

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: Xpand classes and notice Interface Builder created the MapKitDisplayViewController class for you. Expand Resources and notice the template generated a separate nib, MapKitDisplay ViewController.xib, for the “ MapKitDisplay”.

Step 4: We need to add NSObject class in the project. Select Classes -> Add -> New File -> Cocoa Touch Class -> Objective C class -> select NSObject from the Subclass of. Give the file name “DisplayMap”.

Step 5: We have added two framework in the project. Select Frameworks -> Add -> Existing Frameworks -> Add CoreLocation.framework and MapKit.framework.

Step 6: In the MapKitDisplayViewController.h file, we have import MapKit framework, and define MKMapViewDelegate protocol in the file, also add Outlet with a pointer to the MkMapView class. So make the following changes in the file.

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

@class DisplayMap;

@interface MapKitDisplayViewController : UIViewController <MKMapViewDelegate> {
       
        IBOutlet MKMapView *mapView;
}
@property (nonatomic, retain) IBOutlet MKMapView *mapView;

Step 7: Double click the MapKitDisplayViewController.xib file and open it to the Interface Builder. First drag the MapView from the library and place it to the view window. Connect File’s Owner icon to the View icon and select view. Connect File’s Owner icon to the MKMapView and select mapView. Now save the MapKitDisplayViewController.xib file, close it and go back to the Xcode.

Step 8: Open the MapKitDisplayViewController.m file and make the following changes in the file:

– (void)viewDidLoad {
    [super viewDidLoad];
       
        [mapView setMapType:MKMapTypeStandard];
        [mapView setZoomEnabled:YES];
        [mapView setScrollEnabled:YES];
        MKCoordinateRegion region = { {0.0, 0.0 }, { 0.0, 0.0 } };
        region.center.latitude = 22.569722 ;
        region.center.longitude = 88.369722;
        region.span.longitudeDelta = 0.01f;
        region.span.latitudeDelta = 0.01f;
        [mapView setRegion:region animated:YES];
       
        [mapView setDelegate:self];
       
        DisplayMap *ann = [[DisplayMap alloc] init];
        ann.title = @" Kolkata";
        ann.subtitle = @"Mahatma Gandhi Road";
        ann.coordinate = region.center;
        [mapView addAnnotation:ann];
}

–(MKAnnotationView *)mapView:(MKMapView *)mV viewForAnnotation:
 (id <MKAnnotation>)annotation {
        MKPinAnnotationView *pinView = nil;
        if(annotation != mapView.userLocation)
        {
                static NSString *defaultPinID = @"com.invasivecode.pin";
                pinView = (MKPinAnnotationView *)[mapView dequeueReusableAnnotationViewWithIdentifier:defaultPinID];
                if ( pinView == nil ) pinView = [[[MKPinAnnotationView alloc]
                                                                                  initWithAnnotation:annotation reuseIdentifier:defaultPinID] autorelease];

                pinView.pinColor = MKPinAnnotationColorRed;
                pinView.canShowCallout = YES;
                pinView.animatesDrop = YES;
                }
        else {
                [mapView.userLocation setTitle:@"I am here"];
        }
        return pinView;
}

We define here first, coordinate regions to zeros, Then we enter coordinates of our place that, Kolkata (Mahatma Gandhi Road), define the latitude and longitude of this place. We create an instantiate of DisplayView object and add it to our map. To do this, we add the delegate function that will display the annotations on to our map. We start by having DisplayView name a pointer we’ll call “ann.”

Step 8: In the DisplayView.h file , we have import and set CLLocation class reference to incorporate the geographical coordinates and altitude of our device. So make the following changes in the file.

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

@interface DisplayMap : NSObject <MKAnnotation> {

        CLLocationCoordinate2D coordinate;
        NSString *title;
        NSString *subtitle;
}
@property (nonatomic, assign) CLLocationCoordinate2D coordinate;
@property (nonatomic, copy) NSString *title;
@property (nonatomic, copy) NSString *subtitle;

Step 9: Open the DisplayView.m file and make the following changes in the file:

#import "DisplayMap.h"

@implementation DisplayMap

@synthesize coordinate,title,subtitle;

–(void)dealloc{
        [title release];
        [super dealloc];
}

Step 10: Now compile and run the application on the simulator.

You can Download SourceCode from here MapKitDisplay