Flickr APIと位置情報を使い画像をiPhoneの地図に表示するには：iOSでジオ（GEO）プログミラング入門（2）（3/3 ページ）

» 2011年06月06日 00時00分公開

[郷田まり子，株式会社鳥人間]

パースした情報を基に、地図に表示するには

　先ほどの「fetchNearbyPhotos」をクラスを、「GeoPhotoViewController.m」から呼び出します（GeoPhotoViewControllerクラスを実装して地図にピンを出すまでの手順は、前回の記事を参照してください）。

BOOL fetchPhotoDone = NO;
 
- (void)locationManager:(CLLocationManager *)manager didUpdateToLocation:(CLLocation *)newLocation fromLocation:(CLLocation *)oldLocation {
   if (!fetchPhotoDone) {
       fetchPhotoDone = YES;
       FlickrPhotoParser *parser = [[[FlickrPhotoParser alloc]init]autorelease];
       NSArray *photoList = [parser fetchNearbyPhotos: [newLocation coordinate]];
       for (int i=0, l=[photoList count]; i<l; i++) {
           Photo *photo = [[photoList objectAtIndex:i]retain];
           [mapView addAnnotation: photo];
       }
   }
}

GeoPhotoViewController.m

　現在地が取得できたら、FlickrPhotoParserクラスのfetchNearbyPhotosメソッドを呼び出し、Flickr APIを使って写真をリストを取得します。そして、リストに含まれたPhotoインスタンスをMKMapViewにアノテーションとして追加します。

　これを実行してみます。写真のある場所に旗が立ち、旗をタップすると写真の情報が表示されます。

図8　地図に旗が表示される

アノテーションにボタンを追加するには

　これでは写真が見られないので、まだあまり面白くありませんね。アノテーションをカスタマイズして、写真を閲覧するためのボタンを付けてみましょう。

　「ピン」「吹き出し」をカスタマイズするために、前回作ったCustomAnnotationViewクラスを改造します。青文字の部分が、前回からの変更点です。

#import <Foundation/Foundation.h>
#import <MapKit/MapKit.h>
#import "Photo.h"
 
@interface CustomAnnotationView : MKAnnotationView {
}
 
-(void) showDetail: (id) sender;
   
@end

CustomAnnotationView.h

#import "CustomAnnotationView.h"
 
@implementation CustomAnnotationView
 
- (id)initWithAnnotation:(id <MKAnnotation>)annotation reuseIdentifier:(NSString *)reuseIdentifier {
   
    [super initWithAnnotation:annotation reuseIdentifier:reuseIdentifier];
    self.image = [UIImage imageNamed:@"flag.png"];
   
    self.canShowCallout = YES;
   
    UIButton* button = [UIButton buttonWithType:UIButtonTypeDetailDisclosure]; //……【1】
    [button addTarget:self action:@selector(showDetail:)
     forControlEvents:UIControlEventTouchUpInside]; //……【2】
    self.rightCalloutAccessoryView = button; //……【3】
   
    return self;
}
 
-(void) showDetail: (id) sender { //……【4】
    NSURL *url = [[NSURL alloc] initWithString: [(Photo*)self.annotation url] ];
    [[UIApplication sharedApplication] openURL:url];
}
 
@end

CustomAnnotationView.m

　【1】の個所では、ボタンを生成します。タイプとして「UIButtonTypeDetailDisclosure」を指定していますが、これは、iOSでおなじみの青い矢印ボタンです。

　【2】の個所では、生成したボタンに、タップしたときのアクションをセットしています。ここでは、そのインスタンスの「showDetail」メソッドを呼び出すように指定しています。

　【3】で、そのボタンを、吹き出しの右側に出すアイテムとしてセットしました。

　【4】が、ボタンをタップしたときに呼ばれるメソッドです。Photoクラスのurlメソッドは、写真を閲覧するためのURLを返すものでした。そのURLを、Safariで開きます。

　これで実行すると、写真を閲覧するためのボタンが追加され、近所の写真を見て楽しむことのできるアプリケーションになりました。