[iPhone] MapKit にアイコン画像でピンを立ててタップ可能にする
MapKit を使用してい以下のことをやってみます。
- アイコン画像でピンを立てる
- ピンをタップするとバルーンを表示する
- バルーンのアクセサリをタップ可能にする
アノテーションクラス
ピンを立てるにはアノテーションというプロトコルを使用します。このプロトコルを持ったクラス MyAnnotation を作成します。バルーンには左右に View とタイトルとサブタイトルを表示することができます。左右に表示する View は後で説明する MKAnnotationView に設定しますが、タイトルとサブタイトルは MKAnnotation プロトコルを持つクラスに設定します。
#import <Foundation/Foundation.h> #import <MapKit/MapKit.h> @interface MyAnnotation : NSObject <MKAnnotation> { CLLocationCoordinate2D coordinate; NSString* subtitle; NSString* title; } @property (nonatomic, readonly) CLLocationCoordinate2D coordinate; @property (nonatomic, retain) NSString* subtitle; @property (nonatomic, retain) NSString* title; - (id) initWithCoordinate:(CLLocationCoordinate2D) coordinate; @end @implementation MyAnnotation @synthesize coordinate, subtitle, title; - (id) initWithCoordinate:(CLLocationCoordinate2D)c { coordinate = c; return self; } @end
アノテーションをマップに追加
MyAnnotation クラスを使用してマップにアノテーションを追加します。ここでは東京タワーの緯度、経度、タイトル、サブタイトルを指定しています。
MyAnnotation *annotation; CLLocationCoordinate2D location; location.latitude = 35.65533333; location.longitude = 139.7486111; annotation =[[MyAnnotation alloc] initWithCoordinate:location]; annotation.title = @"東京タワー"; annotation.subtitle = @"高さは333mだよ"; [mapView addAnnotation:annotation]; [annotation release];
アノテーションをマップに表示
addAnnotation: でアノテーションを追加すると mapView: viewForAnnotation: が呼び出されます。アノテーションを表示する MKAnnotationVIew 作成します。UITableViewCell のようにリユースされます。また、現在地を表示する青い丸印もアノテーションです。そのまま処理すると現在地も指定した画像で処理されます。青い丸印のまま表示するには nil を返します。
-(MKAnnotationView*)mapView:(MKMapView*)_mapView viewForAnnotation:(id)annotation { // 現在地表示なら nil を返す if (annotation == mapView.userLocation) { return nil; } MKAnnotationView *annotationView; NSString* identifier = @"Pin"; annotationView = (MKAnnotationView*)[mapView dequeueReusableAnnotationViewWithIdentifier:identifier]; if(nil == annotationView) { annotationView = [[[MKAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:identifier] autorelease]; } annotationView.image = [UIImage imageNamed:@"location.png"]; annotationView.canShowCallout = YES; annotationView.rightCalloutAccessoryView = [UIButton buttonWithType:UIButtonTypeDetailDisclosure]; annotationView.annotation = annotation; return annotationView; }
rightCalloutAccessoryView でバルーン右側のアクセサリを指定しています。canShowCallout を YES にするとアノテーションをタップすることによりバルーンを表示させることができます。実際に実行した結果は下記のようになります。
アノテーションのバルーンのアクセサリをタップ可能にする
さらにバルーンのアクセサリー部分をタップしたときに何か処理をするには、MKMapViewDelegate の mapView: annotationView calloutAccessoryControlTapped: を使用します。
- (void) mapView:(MKMapView*)_mapView annotationView:(MKAnnotationView*)annotationView calloutAccessoryControlTapped:(UIControl*)control { // タップしたときの処理 // annotationView.annotation でどのアノテーションか判定可能 }
関連する投稿
3 comments
コメントをどうぞ
Additional comments powered by BackType
[...] [iPhone] MapKit にアイコン画像でピンを立ててタップ可能にする | Sun Limited Mt. (tags: programming) [...]
[...] – Takahiro Octopress Blog [iPhone] MapKit にアイコン画像でピンを立ててタップ可能にする – Sun Limit… MKMapView にピンを立てる – [...]
3nominate…
…