LoginSignup
12
12

More than 5 years have passed since last update.

tmlib.jsをPhoneGap(Cordova)で使う場合の注意点

Posted at

先日、tmlib.jsとCordovaで作ったiOSアプリをリリースしたのですが、はまった点をまとめます。
見当違いの事を書いている可能性もありますので、間違いや気づいた事等ありましたらご指摘頂けるとありがたいです。

使用バージョン
tmlib.js 0.5.0
cordova 3.5.0-0.2.4

CanvasAppのオブジェクト名にappは使えない

Phonegap/Cordovaでappという名前のオブジェクトを生成しているので、tm.CanvasAppをサンプル等で使用しているappという名前で生成するとエラーは起きませんがPhonegap/Cordovaの機能が使用できなくなります。
ソースを見れば当たり前の話なのですが、気付くまで結構掛りました。

canvasタグの追加

tmlibはCanvasに描画してますので、index.html内にcanvasタグを追加する必要があります。
無いと動きません。当たり前ですね(汗)

ShadowBlur等の重いエフェクトは使わない

tmlibに限った事ではないのですが、ShadowBlur等のエフェクトは処理がかなり重たいらしく、動作に深刻な影響がでます。
エミュレータでは全然問題無くても、実機でカクカクになったり…
演出上必要でないのであれば使用しない方が無難です。

実行速度について

Mobile Safari上での実行に比べるとWebViewで実行した場合の実行速度はかなり遅くなります。
原因はWebView上ではセキュリティの関係上JITコンパイラがオフになっているという事らしいです。
iOS8以降はWKWebViewを使用すると速度的にはかなり改善されます。

UIWebViewとWkWebViewについて

上記実行速度に関し、iOS8以降でUIWebViewの実行速度は相当に遅い物となります。
iOS8以降はWKWebViewを使用できますので、こちらを使用すると良いでしょう。
WKWebView化については以下のプラグインを使用しました。
Telerik-Verified-Plugins/WKWebView
https://github.com/Telerik-Verified-Plugins/WKWebView.git

対応していないOSバージョンの場合は自動的にUIWebViewに切り替えてくれるので、こちらが意識する事はありません。

音声再生周りについて

UIWebViewでは、WebAudioを利用出来ますので音声再生には問題ありません。
WkWebViewについて、当初WebAudioが利用出来ないらしく音声再生が出来なかったのですが、特にアップデートも何も掛ける事無くいつのまにか使える様になっていました。
StackOverflowにも同様の質問が上がっており、環境依存では無い問題のはずですが、使える様になった原因は不明です。
ちなみに、Cordova標準の音声再生とローレイテンシオーディオのプラグインがありますが、多重再生が出来ない、再生が遅れる等の問題があり、ゲームへの使用には不向きです。

GameCenterについて

プラグインは下記を使用しました。
crossley/cordova-plugin-game-center
https://github.com/leecrossley/cordova-plugin-game-center.git

スコア登録等に関して通常使用で問題ありませんが、無名関数内等でsubmitScore等に渡すパラメータにローカル変数を使った場合、スレッド間のデータアクセスエラーが起こる場合があります。
自分は以下の様に対処して解決しました

JavaScript
gamecenter.submitScore(successCallback, failureCallback, {
    score: 10,
    leaderboardId: "board1"
});

iTunes connectで行うLeaderBoardの設定は、アプリがReady for saleになると一切変更が出来なくなりますので、厳重にチェックした方がいいです。
一回、スコア登録の最高スコアと最新スコア、昇順と降順の設定を間違えて失敗しました。

ステータスバーについて

下記プラグインを利用してステータスバーを消しております。
apache/cordova-plugin-statusbar
https://github.com/apache/cordova-plugin-statusbar.git

プラグインインストール後にplatforms/ios/<プロジェクト名>内にある<プロジェクト名>-info.plistへ以下を追加してください。

<key>UIStatusBarHidden</key>
<true/>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>

AdMob使用時の注意点

プラグインは下記を使用しました。
floatinghotpot/cordova-admob-pro
https://github.com/floatinghotpot/cordova-admob-pro.git

サンプル通りに設定すれば問題ありませんが、テストモードを有効にした場合でも実機デバッグ時に表示されるバナーおよびインタースティシャルは本番っぽいです。
誤ってタッチした場合、不正クリックとみなされ最悪アカウント停止される可能性もありますので注意が必要です。

iOS7で画面上部または下部にバナーが表示された時点で画面のリサイズが行われ、若干画面が小さく表示されてしまいます。
ゲーム実行上は問題無かったので対処はしておりません。

アプリケーションのバージョン番号について

プロジェクトが入っているフォルダ直下のconfig.xml内にバージョン番号を記述してあります。

config.xml
<widget id="jp.hoge.hogehoge" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>hogehoge</name>

タグのversionを適宜書き換えてください。
cordovaでのビルド時、xcodeのアプリバージョン番号がこの値に書き換えられます。

以下、気付いた事があったら追記予定…

12
12
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
12
12