センサー類を使ったアプリ深水 拓郎 @uzuki_aoba

1

Coronaにおけるセンサー使えるセンサー heading (方位)

location (位置)

accelerometer (加速度)

gyroscope (ジャイロ)

使い方使用可能か調べる：system.hasEventSource()

値を取得したときのリスナーを登録する：Runtime:addEventListener()

リスナーで値を使う（保存、表示、etc…）

2

コード例

system.hasEventSource(“heading”)でコンパスが使えるか確認する

使えるならRuntime:addEventListener(“heading”, リスナー関数)で、方位を取得した場合の処理を登録する これは方位が変化する度に呼び出される

使えない場合の処理も必要です。（例では使えない旨を表記）

3

build.settingsで許可 androidでGPSを使うにはパーミッション（許可）設定が必要

プロジェクトのフォルダにあるbuild.settingsに記述する12/02/24 http://developer.anscamobile.com/content/configuring-projects#Application_Permissions_Android

1/1chrome-extension://ckibcdccnfeookdmbahgiakhnjcddpki/editor.html

• build.settingsについて：• http://developer.anscamobile.com/content/configuring-projects

• Androidのパーミッション設定の項目について：• http://developer.android.com/reference/android/Manifest.permission.html

4

「シュベーレ・グスタフごっこ。」

ナショジオのミリタリーアワー見ながら何造るか考えてたらこんなことになりました。

ナチス・ドイツが誇るトンデモ兵器である80cm列車砲“シューベーレ・グスタフ（Schwerer Gustav）”をシュミレートします。

方角と発射角度をセンサーで決定して、飛距離と着弾地点を算出します。

兵器の威力と恐ろしさを伝えます。

5

特長センサーを使いました

使ったセンサー

heading

location

accelerometer (所持してるAndroid端末がgyroscope非搭載だったので)

使い方はAnscaのテンプレートやAPIレファレンスの例とほぼ同じです。

マップを表示します

Androidはネイティブのマップが呼び出せません（多様性があるため）

native.showWebPopupでhtmlファイルを表示し、html側でJavaScriptを使ってGoogle Mapを呼び出しています。

GETメソッドで値は渡しています。

CDNで他所にあるスクリプトを読み込んで使うのもOKです。

GoogleにホスティングされているjQueryを使っています。

6

デモ HTC EVOでデモします

7

感想センサー類の実装はネイティブの開発環境よりシンプル

何も考えなくてもだいたいは動く

そして、だいたいはAnscaのサンプル書き換えでOK

マップが呼べない等端末差異やサポートしてない機能も有るけれど、native.showWebPopup()でJavaScriptに仕事させれば何とかなる

センサー類は実機でないと試せないので、デバッグが少し面倒

appMobi XDKみたいに本体傾きや位置のエミュレートが出来るとうれしい…

locationイベントの発生が遅いのはなんでだろう・・・

50秒くらいかかる

8

感想(2) Android端末の間でもセンサーのズレがありますね。個体差かしら。

もともと精度は期待できないので仕方ないけど。

9

付録: native.showWebPopup()を使ったmap表示

htmlを経由することで、AndroidでもiOSでも共通の実装でmapを表示できます。

Google Static Map APIを表示していますが、ちゃんと組めば動かせるMapも出せると思います(未検証

表示用のHTMLはプロジェクトフォルダにつっこんでます。

jQueryが使えるので、だいたいの事はできます。

10

←グスタフごっこでは着弾地点の表示に使ってます

やり方：Corona側 Anscaが公開してるnative.showWebPopupの利用例とほぼ同じ。 Map表示用に準備したHTMLファイルをWebPopupで開く。 表示したいマーカーの座標と、スクリーンサイズをGETメソッドで渡しています。

下が該当部分です（urlRequestListener等は省略してますが、Anscaのサンプル通りでOK）

11

やり方: HTML側 metaタグをちゃんと指定する。 スマートフォン用のviewpointの設定で良いです

map表示用のエレメント(Static Mapの場合img)と、ローディング中の代替表示用のエレメント、閉じるボタン用のエレメントを準備する Corona側で拾うために、閉じるボタンはformとsubmitで作ります。

jQueryを読み込む 他のライブラリでも良いですし、ネイティブ実装でも良いです

JavaScriptでHTMLのロード時の処理を書く GETメソッドでパラメータを取得する

map表示用のエレメントのサイズを、Corona側から渡した画面サイズを基に調節する

Google Static Map APIに投げるリクエストURLを組み立てて、map表示用のimgエレメントのsrc属性に入れる

画像のロード完了時にローディング表示を消してmapを表示する

12