2013/03/19

ピンのアニメーション - [開発] - Google Maps SDK for iOS

Google Maps SDK for iOSを使用した場合、地図はもちろんGoogle Mapとなり、ピンもGoogle Mapのマーカーとなる。
Apple Mapのピン表示やアニメーションの方が使い心地がよく、iPhoneアプリらしいので、Google Maps SDKのマーカーをAppleのピンのようにしてみた。


Google Maps SDK for iOSが提供するGMSMarkerは、UIViewのサブクラスではないので、簡単にアニメーションができないようだ。
そこで今回は、無理矢理ではあるがGroundAnchorを利用して、マーカーの表示位置を細かく変化させることでパラパラアニメのようにピンの落下アニメーションを再現してみた。

以下のようにマーカーのGroundAnchorのY座標を変化させる。

// yyは動的に値が変化する変数
[marker setGroundAnchor:CGPointMake(0.255, yy)];

あとは、マーカーのInfoWindowもAppleのポップアップと同じものを表示するために、UIViewのカスタムサブクラスを作成し、マーカータップ時に表示させてあげれば完了。
以下の動画のようになる。


ピンのポップアップの表示に関しても、ピンから拡大表示されるアニメーションにしてあげれば、ほぼApple Mapと同じピン追加時の動作となる。

Google Maps SDK for iOSのマーカー、情報ウィンドウ表示については以下の過去記事を参考に。
マーカー(ピン)を表示する - [開発] - Google Maps SDK for iOS
GMSMapViewDelegate 一覧 - [開発] - Google Maps SDK for iOS

Related Posts Plugin for WordPress, Blogger...

0 件のコメント:

コメントを投稿