海外で人気のフレームワーク”libGDX”を使って、Androidでアニメーション作ってみた

はじめに

少し前になりますが、東京メトロでオープンデータ活用コンテストがありまして、そこに出した下記Androidアプリの一部を担当しました。

TOKYOTOKYO

これのTOP画面について、「オープンデータを使って動的にアニメーションするものを、いい感じに作って」という無茶ぶりからはじまり、2日くらいで色々やって、デザイナーの方にもお忙しい中手伝って頂き(ありがとうございます!)、下記の形に落ち着きました。

動きに関しては実際インストールするか、動画もありますのでご覧ください。

これは現在走行中の各路線の列車数を取得し、その分だけ路線色の円をぐるぐる動かしてます。

今回はこの実装方法の簡易版を用意したので、それについて説明します。

libGDX

今回制作するにあたって、libGDXを利用しました。

これはゲーム用ライブラリなのですが、描画に関してはActivityかViewに対して行えて、今回他の方が作る部分にマージしなければならなかったので採用しました。

あのIngressもこのlibGDXを使って作られてるらしいです、ただ海外だと結構流行ってるのですが、日本だとそうでもなくて、日本語資料があまりないのが辛い所でした。

実装

プロジェクトの作り方については、下記を参考にして下さい、基本的にはlibGDXをダウンロードして、プロジェクトに入れるだけです。

Android専用にlibGDXのプロジェクトを作る

まず、libGDXのviewを表示するために、Activityのlayout.xmlに下記を追加します。

 次に表示するActivityの継承クラスをAndroidApplicationに変更して、先ほどの追加したレイアウトにlibGDXのViewを貼り付けます。

次にassetsフォルダに表示する画像を入れます、今回はこのブログのキャラクターである下記画像を入れました。

そしてMainConfigrationとMainListenerを実装します。

MainConfigrationはlibGDXの設定です、今回はほぼ意味のないものですが、デフォルトの設定を変えたい場合はここをいじります。

MainListenerで描画を行います、本来であればステージの制御だったり、シーンの制御だったりと色々ゲームの制御をしますが今回は描画だけです。

 そして、描画の位置を計算するクラスを実装します、色々やってますが簡単にいうと、描画の度に経過した時間がもらえるので、それを元に位置をずらしています。

 これらを実装するとキャラクターをぐるぐると表示することができます。

動かないのでわかりづらいですが、実行結果のスクリーンショットです。

最後に

私はOpenGLは詳しくないのですが、ligGDXを使うと色々と小難しい部分はlibGDXが吸収してくれるので、今回は大分助かりました。

この記事では画面が更新される度に位置をずらしていますが、iOSのように(0, 0) から (100, 0)まで、何秒で移動みたいな関数もあって楽しいライブラリですので、ぜひやってみてください。

●この記事を書いた人