標:在前一個範例中建立的Google Map上,加上座標點(POIs),當點選座標點會觸發對應的event。
☉限制:必須將iPhone的作業系統更新到OS 3.0版本,開發使用的SDK也要是SDK 3.0才有內建Mapkit Framework。
☉效果畫面:
☉步驟說明:
在地圖上每一個座標點,都是一個MKAnnotationView,也就是UI。而每一個MKAnnotationView都需要有對應的資料MKAnnotation,這是Protocal,也就是儲存每個座標點所需要用到的資料的地方。因此,我們要先建立一個使用MKAnnotation的類別。
依照iPhone開發者文件的說明。這個Protocal需要宣告三個屬性和一個初始化方法。三個屬性分別是coordinate、title、subtitle,和一個方法initWithCoords。
下面是MKAnnotation類別的程式碼 POI.h
#import
#import
#import
@interface POI : NSObject{
CLLocationCoordinate2D coordinate;
NSString *subtitle;
NSString *title;
}
@property (nonatomic,readonly) CLLocationCoordinate2D coordinate;
@property (nonatomic,retain) NSString *subtitle;
@property (nonatomic,retain) NSString *title;
-(id) initWithCoords:(CLLocationCoordinate2D) coords;
@end
#import "POI.h"宣告了符合MKAnnotation Protocal的類別後,我們就要在Google Map上建立座標點。在iPhone上顯示Google Map的程式可以參考 使用MKMapView實作Google Map。
@implementation POI
@synthesize coordinate,subtitle,title;
- (id) initWithCoords:(CLLocationCoordinate2D) coords{
self = [super init];
if (self != nil) {
coordinate = coords;
}
return self;
}
- (void) dealloc
{
[title release];
[subtitle release];
[super dealloc];
}
@end
[mapView addAnnotation:poi];把我們所建立的POI加入地圖(MKMapView)的Annotation集合中。 放入集合的只是座標點的資料,這個時候還沒有真正建立座標點。
#import "POI.h"
-(void*) createMapPoint:(MKMapView *)mapView coordinateX:(double)coorX coordinateY:(double)coorY
Title:(NSString*)title Subtitle:(NSString*)subtitle{
if(mapView!=nil){
//set POI lat and lng
CLLocationCoordinate2D p1;
POI *poi;
if(coorX && coorY){
p1.latitude=coorX;
p1.longitude = coorY;
poi = [[POI alloc] initWithCoords:p1];
if(title!=NULL)
poi.title=title;
if(subtitle!=NULL)
poi.subtitle=subtitle;
[mapView addAnnotation:poi];
[poi release];
}
}
return NULL;
}
- (MKAnnotationView *) mapView:(MKMapView *)mapView viewForAnnotation:(id <MKAnnotation>) annotation{
//方法一:using default pin as a PlaceMarker to display on map
MKPinAnnotationView *newAnnotation = [[MKPinAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:@"annotation1"];
newAnnotation.pinColor = MKPinAnnotationColorGreen;
newAnnotation.animatesDrop = YES;
//canShowCallout: to display the callout view by touch the pin
newAnnotation.canShowCallout=YES;
UIButton *button = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];
[button addTarget:self action:@selector(checkButtonTapped:event:) forControlEvents:UIControlEventTouchUpInside];
newAnnotation.rightCalloutAccessoryView=button;
return newAnnotation;
//方法二:using the image as a PlaceMarker to display on map
/*
MKAnnotationView *newAnnotation=[[MKAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:@"annotation1"];
newAnnotation.image = [UIImage imageNamed:@"icon.png"];
newAnnotation.canShowCallout=YES;
return newAnnotation;
*/
}
annotationView.pinColor = MKPinAnnotationColorGreen;設定大頭釘的顏色,不過只有紅色、紫色、綠色,三種顏色(似乎有點稀少XD)。
newAnnotation.canShowCallout=YES;設定在點選大頭釘的時候氣泡視窗是否會談出來。第10行到第12行動態建立了一個DetailDisclousue類型的按鈕,替這個按鈕設置了一個UIControlEventTouchUpInside事件,並將它放入氣泡視窗的AccessoryView中。最後,將建立好的座標點回傳給MapView。 被註解的方法二是直接使用MKAnnotationView建立座標點,並且設置她的image屬性, 因此座標點不一定是大頭釘,可以有更多的變化與花樣。
- (void)checkButtonTapped:(id)sender event:(id)event{上面是UIControlEventTouchUpInside事件所執行的事件處理常式。當點選DetailDisclousue按鈕後,就會跳出一個alert,表示這個event有正確無誤的被處理。
UIAlertView *tmp= [[UIAlertView alloc] initWithTitle:@"訊息!" message:@"Callout測試" delegate:nil cancelButtonTitle:@"OK" otherButtonTitles:nil];
[tmp show];
[tmp release];
}