Edited at

最速ではてなフォトライフ・ビューワを作る!

More than 5 years have passed since last update.

最近画像ビューワを作ることにハマってまして、iPhoneアプリではてなフォトライフを使ったものがあまり無いことに気づき、サンプルを作成してみました。

screenshot1.png

人気写真、新着写真はRSSで公開されているので認証とかせず、すぐ試せます。

・人気写真

http://f.hatena.ne.jp/hotfoto?mode=rss

・新着写真

http://f.hatena.ne.jp/userlist?mode=rss

RSSですのでXMLの読み込みにはKissXMLを使用しました。

下記から落とせます。

https://github.com/robbiehanson/KissXML

HTTP通信にはGTMHttpFetcherを使ってみました。

下記からSVNでソースコードをチェックアウトしてください。

http://code.google.com/p/gtm-http-fetcher/

ではそのKissXMLとGtmHttpFetcherを使って人気写真を取得します。

取得したRSSの結果を使いやすいようにNSDictionaryに変換するまでが基本的な流れとなります。

ではまず最初にASPhotoListFetcherクラス(名前は別に何でもいいです)を作成してその何に下記メソッドを追加します。

- (void)beginFetchPopularPhotoList:(void (^)(NSDictionary *result, NSError *error)) completionHandler {

NSMutableURLRequest *request = [NSMutableURLRequest requestWithURL:
[NSURL URLWithString:@"http://f.hatena.ne.jp/hotfoto?mode=rss"]
cachePolicy:NSURLRequestReloadIgnoringLocalCacheData timeoutInterval:60];

// この設定が無いとProxyサーバのキャッシュの結果が返ってくるみたい・・・
[request addValue:@"no-cache" forHTTPHeaderField:@"Cache-Control"];

GTMHTTPFetcher* fetcher = [GTMHTTPFetcher fetcherWithRequest:request];

[fetcher beginFetchWithCompletionHandler:^(NSData *data, NSError *error) {

NSDictionary *xml = nil;
if (!error) {
DDXMLDocument *doc = [[DDXMLDocument alloc] initWithData:data options:0 error:&error];

if (!error) {
xml = [doc.rootElement convertDictionary];

} else {
NSLog(@"%@ %@", [error localizedDescription], [error userInfo]);
}
}

if (completionHandler) {
completionHandler(xml, error);
}
}];
}

上記で人気写真のRSS取得結果をconvertDictionary メソッドを使ってNSDictionaryに変換してます。

XMLの結果を解析してNSDictionaryに変換するのは下記を参考にしました。

http://dev.classmethod.jp/smartphone/iphone/ios-xml-parse-2/

勝手に使っていいということなので、ありがたく使わせてもらってます!

呼び出し元はこんな感じになります。

- (void)requestPhotoList

{
__weak ASPopularListViewController *weakSelf = self;

ASPhotoListFetcher *fetcher = [[ASPhotoListFetcher alloc] init];
[fetcher beginFetchPopularPhotoList:^(NSDictionary *result, NSError *error) {
if (!error) {
// 取得結果を配列に格納します
NSArray *photos = result[@"rdf:RDF"][@"item"];
NSLog(@"photos: %@", photos);
// 取得結果をゴニョゴニョしてください・・・
}
}];
}

取得した結果からほしい項目は下記のようにして取り出せます。

// 写真タイトル

NSString *title = photos[@"title"];
// 投稿日付
NSString *date = photos[@"dc:date"]];
// 画像URL
NSString *imageUrl = photos[@"hatena:imageurl"];
// 小さい画像URL
NSString *smallImageUrl = photos[@"hatena:imageurlsmal"];
// 中くらいの画像URL
NSString *mediumImageUrl = photos[@"hatena:imageurlmedium"];

必要な最低限をことしか書いてないですが、ソースコードアップしたので詳細はそちらを見てください。

https://github.com/asakahara/ASHatenaPhotoClient

サンプルの中ではIDMPhotoBrowserというとても便利なフォトビューワを使ってます。

こちらから落とせます。

https://github.com/ideaismobile/IDMPhotoBrowser

こうやって自分で作ったビューワで画像眺めるのも中々よいです。