Web活メモ帳 » iPad

[iPhoneアプリ開発]Yahoo!JAPANのiOS Map SDKを使って地図を表示する方法

linja — Tue, 17 Jan 2012 01:00:14 +0000

Yahoo!JAPANが提供している地図をiPhoneアプリ内に組み込む処理を調べたので自分用にメモです。

手始めに、地図だけを表示するサンプルの作り方をご紹介します。

利用準備

まずは、必要なフレームワークをダウンロードします。

Yahooのデベロッパーネットワークから、YMapKitフレームワークをダウンロードします。
iOS Map SDK

同時に、アプリケーションIDを取得します。
Yahoo!デベロッパーネットワーク – アプリケーションの管理

※詳しくはYahooのデベロッパーネットワークのページが詳しいです。

Yahoo!デベロッパーネットワーク – YOLP（地図） - iOS Map SDK - 利用準備

開発してみる

まず、Single View Applicationを作成します。

最初に、YMapKitに必要な以下のフレームワークをプロジェクトに追加します。

必要なのは、以下になります。

UIKit.framework
SystemConfiguration.framework
CoreGraphics.framework
CoreLocation.framework
Foundation.framework
OpenGLES.framework
QuartzCore.framework
libxml2.2.dylib

コードの編集

ViewController.mにてライブラリを読み込む処理を追加します。

#import

次に、ViewDidLoadを以下の内容で上書きします。


- (void)viewDidLoad {

    [super viewDidLoad];

    YMKMapView* ymapView = [[YMKMapView alloc] initWithFrame:CGRectMake(0, 100, 300, 300) appid:@"アプリケーションID" ];
    ymapView.mapType = YMKMapTypeStandard;
    CLLocationCoordinate2D coord = {.latitude =  35.178088, .longitude = 136.891022};
    YMKCoordinateSpan span = {.latitudeDelta =  0.02, .longitudeDelta =  0.02};
    YMKCoordinateRegion region = {coord,span};
    [ymapView setRegion:region];
    [self.view addSubview:ymapView];

    [ymapView release];
}

これだけで、設定完了です。簡単ですね。

実機でテスト

実機でテストする際には、最初だけ真っ黒な画面が出てきてましたが、
2回目のビルドだと正常に動作しました。

ソースコードは以下のサイトを参考にさせていただきました。感謝。
YMapKit を使って iPhone に地図を表示するシンプルなサンプル (2011-09-15)

以上、iOS Map SDKを使って地図を表示する方法でした。

iOS/MacOS開発者必見！UIを投稿してシェアできる「Cocoa Controls」

linja — Mon, 25 Apr 2011 00:50:24 +0000

iOS/MacOS開発者のためのUIデータベースを見つけたので情報をシェア。

「Cocoa Controls」は、カスタムコンポーネントとして作ったUIを投稿してシェアできるようになっています。

全てソース付きのようですので、自分のアプリの中に組み込む事も可能ですよ。

以下にいくつか気になったものをご紹介。

Center Button in Tab Bar for iOS

↑タブバーのセンターボタンを大きくするコンポーネント

Pull-to-Refresh TableView for iOS

↑Twitterのように、画面を引っ張るとテーブルビューをリフレッシュする事ができます。

WEPopover for iOS

↑ポップオーバーの実装

JSLockScreen for iOS

↑OSのロック画面の機能を持ったIOSのUIコンポーネント。

HGPageScrollView for iOS

↑Safariタブビューアのように複数のページのスクロールを可能にするUIScrollView

上記のようなコンポーネントが多数公開されています。
ソースもダウンドード出来ますので、有る程度開発ができるひとであれば問題なく導入できると思います。
便利で分かりやすいインターフェイスがたくさんあるので、上手く使って行きたいですね。

iPadだけにCSSを適用する方法

linja — Tue, 23 Mar 2010 02:23:15 +0000

2010.08.20追記
こちらの記事はipad「だけ」に適用する内容ではありませんでした。
実際にはJavaScriptなどの条件判定が必要なようです。

「HOWTO: CSS for the iPad」というエントリーにてiPadだけにCSSを適用する方法が紹介されていましたので、メモ的にエントリー。

詳しくは以下

設定方法

以下のコードで設定できるようです。

このタイプのメディアタイプを扱えないブラウザが無視するためiPadだけに適用されるようになるようです。
同様のやり方でiPhoneにも対応できるとの事。

iPhoneだけに適用したい場合はmax-device-widthを480pxに設定すれば良いそうです。

iPadのデザインテンプレートがダウンロードできるサイト

linja — Wed, 03 Feb 2010 13:15:53 +0000

iPad 楽しみですね。
発売してからすぐに開発にかかれるよう今から準備しておくのに良いかもしれません。
iPad用のデザインテンプレートがダウンロードできるサイトをご紹介。

Apple iPad fully editable PSD

iPadの枠付きのPSDがダウンロード可能になっています。
全体の雰囲気はこれでつかめるのではないでしょうか。

iPad GUI PSD

PSD形式でダウンロード可能です。UI要素もとても豊富になっています。