【iOSアプリ開発】SampleMapKit作成!地図を使ったアプリを作る為に


今回はMapKitを使ったサンプルの作成手順をご紹介いたします。

以前のブログ記事、iOSアプリ開発の強い味方、cocoapodsを使いこなそう!で紹介したライブラリ、JPSThumbnailAnnotationを使う前提として地図を表示するためにMapKitというフレームワークを使用し、地図を表示させる必要があります。

※JPSThumbnailAnnotationを使うとこんな見た目のサムネイル付きピンが作れます。
スクリーンショット 2015-01-30 14.30.37

今回、MapKitを使った地図アプリを作成後、上記の記事を読んで頂きライブラリを追加後に、是非ピンのカスタマイズを行ってみてください。

それではMapKitを使ったサンプルの手順になります。

 

前提

SingleViewApplicationを選択して作成したプロジェクトであること

 

1.プロジェクトにMapKitフレームワークを追加

左のツリー表示から青いプロジェクトファイルを選択
Linked Frameworks and Librariesにて『+』ボタンをクリック
現れたウィンドウ上の検索パネルで「MapKit」と検索し、Addボタンで追加

mapkitf

 

 

2.ViewController.h に 2点追加

  • #import <MapKit/MapKit.h>
  • <MKMapViewDelegate>

こんな形になります。

#import <UIKit/UIKit.h>
#import <MapKit/MapKit.h>
@interface ViewController :UIViewController<MKMapViewDelegate>
@end

 

3-1.ViewDidLoadにMapKitオブジェクト作成

- (void)viewDidLoad
{
[super viewDidLoad];
//MapViewオブジェクトを生成
MKMapView *mapView = [[MKMapView alloc] init];
mapView.delegate = self;
//大きさ、位置を決定
mapView.frame = CGRectMake(0, 20, 320, 460);
//表示するためにViewに追加
[self.view addSubview:mapView];
}

 

3-2.ViewDidLoad内で追加したMapKitオブジェクトの中心座標を設定

- (void)viewDidLoad
{
[super viewDidLoad];
//MapViewオブジェクトを生成
MKMapView *mapView = [[MKMapView alloc] init];
mapView.delegate = self;
//大きさ、位置を決定
mapView.frame = CGRectMake(0, 20, 320, 460);
//表示位置を設定  ↓追加ここから☆☆☆
CLLocationCoordinate2D co;
//アヤラの位置を設定
co.latitude = 10.317347;    //緯度
co.longitude = 123.905759;   //経度
[mapView setCenterCoordinate:co];
//追加ここまで↑ ☆☆☆
//表示するためにViewに追加
[self.view addSubview:mapView];
}

 

3-3.ViewDidLoad内で追加したMapKitオブジェクトの地図縮尺を設定

- (void)viewDidLoad
{
[super viewDidLoad];
//MapViewオブジェクトを生成
MKMapView *mapView = [[MKMapView alloc] init];
mapView.delegate = self;
//大きさ、位置を決定
mapView.frame = CGRectMake(0, 20, 320, 460);
//表示位置を設定
CLLocationCoordinate2D co;
//アヤラの位置を設定
co.latitude = 10.317347;    //緯度
co.longitude = 123.905759;   //経度
[mapView setCenterCoordinate:co];
//縮尺を指定 ↓追加ここから☆☆☆
MKCoordinateRegion cr = mapView.region;
cr.span.latitudeDelta = 0.8;
cr.span.longitudeDelta = 0.8;
cr.center = co;
[mapView setRegion:cr];
//追加ここまで ↑☆☆☆
//表示するためにViewに追加
[self.view addSubview:mapView];
}

 

3-4.ViewDidLoad内で追加したMapKitオブジェクトの表示タイプを設定(ピンも1つたてておく)

- (void)viewDidLoad
{
[super viewDidLoad];
//MapViewオブジェクトを生成
MKMapView *mapView = [[MKMapView alloc] init];
mapView.delegate = self;
//大きさ、位置を決定
mapView.frame = CGRectMake(0, 20, 320, 460);
//表示位置を設定
CLLocationCoordinate2D co;
//アヤラの位置を設定
co.latitude = 10.317347;    //緯度
co.longitude = 123.905759;   //経度
[mapView setCenterCoordinate:co];
//縮尺を指定
MKCoordinateRegion cr = mapView.region;
cr.span.latitudeDelta = 0.8;
cr.span.longitudeDelta = 0.8;
cr.center = co;
[mapView setRegion:cr];
//地図の表示種類設定
mapView.mapType = MKMapTypeStandard;   //追加☆☆☆
//ピンを立てる↓☆☆☆
//アヤラ
MKPointAnnotation *pin = [[MKPointAnnotation alloc] init];
pin.coordinate = CLLocationCoordinate2DMake(co.latitude, co.longitude);
pin.title = @"アヤラ";
pin.subtitle = @"biggest Shopping Mall in Cebu.";
[mapView addAnnotation:pin];
//ここまで↑☆☆☆
//表示するためにViewに追加
[self.view addSubview:mapView];
}

Author Profile

IchinoheEriko
IchinoheEriko
ニュージーランド・オーストラリアを経てセブ島にやってきた、世界を飛び回るベテラン女性エンジニア。インターネット創世期よりWebサイト製作を経験。小売業販促アイテム印刷システム「ipopweb」の立ち上げに企画時から参画し、DB 設計・プログラミング 開発を担当しリリース。業務システムエンハンスやポータルサイトのリニューアル開発、運営、保守も多数手がける。OracleMaster保持者。PHP、JavaScriptを始め15以上の言語使用経験を持つ。茨城大学工学部システム工学科卒。