有看過在iPhone裡直接秀出地圖app嗎? 看起來挺酷的吧。猜猜看寫一個把google map載入到iphone的功能要花多少時間? 又要寫幾行程式碼? 如果只是要單純的把地圖拉進iPhone顯示，答案是3分鐘以內(還包含開啟Xcode、interface builder跟編譯的時間，如果動作快一點，不用1分鐘就搞定了)，而且還不用寫到一行程式碼，你可以親自開Xcode來試試看就知其實並不會太麻煩的。

在iOS 3.0之前要讀取地圖可能得用一些比較麻煩的方法去抓google map進來，但在3.0之後新增了MapKit Framework之後，人生就都變彩色的了。

打開Xcode，新增專案，這裡我先偷懶的選用view-based application，選擇專案名稱，這裡我幫它取名為MapDemo(不一定要取這名稱，只是如果你取的名稱是不同的，後面專案的程式碼檔名可能會有所不同)。

專案新增後，打開Resources資料夾裡的MapDemoViewController.xib，它會自動啟動interface builder，接著到Library裡找到一個叫做MapView的元件，把它拖拉到場景上放好對齊。

存檔，回到xcode環境。接下來看一下你的Frameworks資料夾，因為預設的Framework只放了UIKit、Foundation跟CoreGraphics這三個，如果要用到MapView的話，還需要把MapKit Framework加進來，不然編譯會發生錯誤。在Frameworks資料夾按右鍵->Add->Existing Frameworks..

找到MapKit Framework，把它加進來：

你應該就可以在你的Frameworks資料夾裡看到MapKit了：

加好之後，執行Build and Run，這樣就完成了!

從開始到現在如果手腳快一點可能還不用一分鐘就搞定了，而且除了一開始你打了MapDemo幾個字母的專案名稱外，應該沒有再需要用到鍵盤輸入任何程式碼。MapView預設是以Google Map為資料來源，而且這個地圖已經有包含放大、縮小、拖拉的功能了。你可以在試著模擬器裡按著option鍵加滑鼠移動可以模擬你在實機上縮放的手勢。

但是，就這樣出現個世界地圖的app似乎沒什麼鳥用，跟之前看到某房仲業推出的手機看屋的app的複雜度還差得多，不過但至少知道其實在iPhone上面加入地圖功能不算是非常難做的功能。

接著來加一下可以依據經緯度座標來定位的功能：

1
2
3
4
5
6
7
8
9
10
11

// 檔名：MapDemoViewController.h

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

@interface MapDemoViewController : UIViewController
{
  IBOutlet MKMapView *map_view;
}

@end

然後到interface builder裡，把這個map_view變數”串”到你剛剛拖到場景上的那個MapView，讓我們在程式碼裡面可以透過這個變數去操作場景上的那個元件。這個動作如果不熟悉的話，可以參考前面那篇BMI app實作的文章。

串完之後，接著就要來開始寫code了，為了展示目的，我直接把程式碼寫在viewDidLoad裡面：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

// 檔名：MapDemoViewController.m

#import "MapDemoViewController.h"

@implementation MapDemoViewController

- (void)viewDidLoad
{
    // 建立一個region，待會要設定給MapView
    MKCoordinateRegion kaos_digital;

    // 設定經緯度
    kaos_digital.center.latitude = 25.01141;
    kaos_digital.center.longitude = 121.42554;

    // 設定縮放比例
    kaos_digital.span.latitudeDelta = 0.007;
    kaos_digital.span.longitudeDelta = 0.007;

    // 把region設定給MapView
    [map_view setRegion:kaos_digital];

    [super viewDidLoad];
}

- (void)dealloc
{
    [super dealloc];
}

@end

存檔，回到Xcode執行Build and Run，畫面看起來應該比剛剛的好多了。剛我在程式裡設定的那組經緯度是我公司的位置，沒問題的話你看到的地圖應該會在台灣新北市樹林跟新莊的交界處附近。

另外，MapView預設的模式是一般的街道地圖的，你可以用程式來調整：

1
2
3
4
5
6
7
8

// 這是預設的標準模式
map_view.mapType = MKMapTypeStandard;

// 衛星地圖模式
map_view.mapType = MKMapTypeSatellite;

// 混合模式
map_view.mapType = MKMapTypeHybrid;

或是在interface builder環境，從MapView的inspector去調整：

如果你想要秀出使用者的所在位置：

1

map_view.showsUserLocation = YES;

或是用inspector設定：

如果你把這個選項開啟的話，在模擬器裡會出現在美國的某個有趣的地方：

希望做到目前這個階段對大家還不會太困難，但老實說就算現在這樣其實也沒什麼用，甚至也不知道到底指定的位置在哪裡，想靠它賺大錢還早。不過沒關係下一篇我們會來弄一些比較進階的功能，例如是幫地圖加上大頭針，或是加一些自訂的icon圖示等功能，讓地圖看起來更漂亮、實用些。但因為可能會用到在Objective-C裡的Protocol觀念，所以在正式開始實作之前，會先來說明一下在Objective-C裡的Category跟Protocol是怎麼回事。

以上，希望對各位有幫助，若有錯誤的地方還請不吝指教，感謝 :)