2019年11月14日
ティラノスクリプト作品をCordovaでAndroidアプリ化した時のメモティラノスクリプトで作ったゲームをAndroid StudioではなくCordovaでAndroidアプリ化した体験記です。ぶっちゃけめちゃくちゃ面倒です。特に音声ファイルを再生するあたりが。ただ、私の場合はティラノプレイヤーを使っても、なぜかAndroid Studioでうまくビルドできなかったので、Javaも分からないし、こうなったら使い慣れたCordovaで作ったるわ！となってこうなりました。雑に書いたのでめちゃくちゃ分かりにくいですが、いつか誰かが（もしくは未来の自分が）ティラノスクリプト作品をCordovaでAndroidアプリ化する際の参考にでもなったらいいなーと思って、トラブルとその試行錯誤の結果をメモしておきます。 目次
Gradleのパスが通らなくてビルドできなくなったまずAndroid Studioを更新しまくったらGradleのパスが通らなくなって、Cordovaでもビルドができなくなりました。で、Android Studioの「Settings」→「Build,Execution,Deployment」→「Gradle」をクリックしてみると「Service directory path: C:/Users/ユーザー名/.gradle」と書いてあります。 そこで、システム変数「GRADLE_HOME」の変数値を「C:\Users\ユーザー名\.gradle\wrapper\dists\gradle-5.4.1-all\322.....\gradle-5.4.1」に変更！ さらに、システム変数「Path」の編集で「C:\Users\ユーザー名\.gradle\wrapper\dists\gradle-5.4.1-all\322.....\gradle-5.4.1\bin」というパスを追加！ これでCordovaのビルドが通るようになりました！ Cordovaプロジェクトを作る技術雑記さんの【Cordova入門】Androidアプリ開発編という記事を参考に、いつも通りCordovaプロジェクトを作りました。 で、「wwwフォルダ」の中にティラノスクリプトの「dataフォルダ」「tyranoフォルダ」「index.html」の3つを放り込んで、普通にビルドしたら実機でも動くようになりました。 ちなみに、ティラノスクリプトのプロジェクトは特にブラウザ用に書き出さずにそのままコピーしています。また、[playbgm]などの音声ファイル関係のタグを使っているとビルドはできても実機で動きませんでした。 Cordovaで横画面に固定するCordovaプロジェクトのフォルダにある「config.xml」に以下のpreferenceタグを追加しました。
<name>アプリ名</name> で、このままだと機種によっては実機で画面がはみ出ました。 <meta name="viewport" content="width=device-width, user-scalable=no" /> テキストボックスに入力できるようにするスマホの機種によってはテキストボックスをタップしても入力できなかったので、ティラノスクリプトのシナリオファイルに少し追加しました。
[edit width=200 size=25 left=540 top=200 name="sf.namae"] テキストボックスをクリックするとダイアログが表示されて入力が促される形になります。ごり押しですね。 音を出すCordovaではMediaプラグインをインストールしないと音を出せません。 というわけでコマンドプロンプトで、Cordovaのプロジェクトフォルダに移動して、以下のコマンドを実行してMediaプラグインをインストールします。 cordova plugin add cordova-plugin-media それから「wwwフォルダ」に入れたティラノスクリプトの「index.html」にcordova.jsと、後で自分で用意するbgm_se.jsを読み込むタグを追加しておきます。
<head> で、音を再生するための「bgm_se.js」を作って「index.html」と同じ階層に置いておきます。ちなみに「bgm_se.js」の中身はこんな感じです。
function getPath(){ bgm_se.jsの内容メモgetPath、mediaError、onSuccess、mediaStatusBGM はCordovaのMediaを使うための関数です。最後のmediaStatusBGMは、BGMをリピート再生するための関数です。音声ファイルが停止されたら再度再生を開始するという内容です。 CORDOVA_BGM_SEという変数は、「もうCordovaでMediaプラグインを使える状態になっているかどうか」を判定するための変数です。devicereadyのイベントが発火したらこの変数に「OK」と代入されます。 CORDOVA_BGMとCORDOVA_SEは、それぞれBGMとSEの音声ファイルを…こう…代入？しておく的な？変数です。ここでグローバル変数として定義しておきます。 ちなみに私も全然詳しくないので、再生・停止といった最低限の機能のみしか使えません。BGMは繰り返し再生のみ、SEは1回再生のみです。フェードアウト・フェードインも使えません。 playbgm等の標準タグで音を出そうとすると動作が停止してしますので、別途音声ファイルを再生するタグを追加するために、ティラノスクリプト用のプラグインを作ります。 「www\data\others\plugin」の中に「cordova_bgm_se」というフォルダを作成して、その中に「cordova_bgm_se.js」という名前のファイルを作っておきます。「cordova_bgm_se.js」の中身はこんな感じです。
(function(){ cordova_bgm_se.jsの内容メモ音声ファイルを再生するためのタグを定義し、最後にタグとして割り当てています。 bgmStartはBGM再生用のタグです。bgm_se.jsの方で定義したCORDOVA_BGM_SEという変数の中身がOKの時のみ、機能します。（つまり、devicereadyが発火した後のみ機能します。）で、同じくbgm_se.jsで定義したCORDOVA_BGMという変数に新しいMediaを設定し、CORDOVA_BGM.play();で再生開始し、CORDOVA_BGM.setVolume(pm.volume);でボリュームを変更します。再生→ボリューム変更の順序じゃないとボリュームが適用されないので注意です。ちなみに、ティラノスクリプトのsf.bgmという変数をボリューム設定に利用しています。このsf.bgmというのは私が適当に作ったシステム変数です。0.0～1.0の値でボリュームを設定します。 bgmStopはBGM停止用のタグです。こちらもCORDOVA_BGM_SEという変数の中身がOKの時のみ、機能します。まずCORDOVA_BGM.stop()で再生を停止し、CORDOVA_BGM.release()でリソースを解放しておきます。このCORDOVA_BGM.release()がないと、実機で動かしていると途中で動作が止まってしまうので注意です。最後にCORDOVA_BGM=null;で変数を空っぽにしておきます。 seStartはCORDOVA_BGMがCORDOVA_SEになっていること以外、bgmStartとほとんど一緒ですが、CORDOVA_SEという変数に新しいMediaを設定するとき、mediaStatusBGMという関数の記載を省きます。mediaStatusBGMはBGMをリピート再生するための関数なので、1回しか再生しないSEでは不要ということです。あとボリューム設定はsf.bgmではなくsf.seで行います。これも私が適当に作ったシステム変数です。0.0～1.0の値でボリューム設定します。 同じ階層に「init.ks」というファイルも作成します。「init.ks」の中身はこんな感じです。
@loadjs storage="plugin/cordova_bgm_se/cordova_bgm_se.js" で、「www\data\scenario」の中にある「first.ks」あたりで今作ったプラグインを読み込んでおきます。以下のタグを追加します。
[plugin name="cordova_bgm_se"] これで[bgmStart][bgmStop][seStart][seStop]の4つのタグが追加されました。あとは標準タグのplaybgmやplayseタグの代わりに、今回プラグインで作った[bgmStart]や[seStart]タグを使えばＯＫです。なお、上記の記述ではloopパラメータやbufパラメータは形だけなので使えません。何を設定したところでBGMは無限ループ再生、SEは1回再生になります。もっとしっかり作ればその辺もなんとかなるとは思いますが、今回私は必要なかったので割愛しました。 あ、音量の設定は0.0～1.0の値で行います。私はsf.bgm、sf.seというシステム変数を自分で用意して、それを使って音量設定することにしました。オプションで音量を変更するときも、sf.bgmやsf.seの値を変更するようにしています。 ちなみに音声ファイルはOGGファイルを使用しました。軽いので。 対応するOSのバージョンを設定する今回AndroidのOSがVer4.4以上の機種のみで動作確認したので、対応するOSは4.4以上に設定しようと思います。 Cordovaプロジェクトのフォルダにある「config.xml」の<platform name="android">のあたりにタグを追加します。
<platform name="android"> 後は普通にビルドしてGooglePlayに申請する技術雑記さんの【Cordova入門】Androidアプリ開発編という記事を参考に、いつも通りビルドしました。 しかしGooglePlayにアップロードしたら署名ファイルの有効日数が短すぎるとのことなので、署名ファイルの作成は以下のコマンドに変更しました。（testの所は適宜、実際のプロジェクトごとの名前に変更します） keytool -genkey -v -keystore test.keystore -alias test -keyalg RSA -keysize 2048 -validity 50000 validityのところを10000から50000に変えています。これで申請したらアップロードすることができました。後は審査が終わるまで待ち、今回は申請から4日後くらいに無事公開開始されました。
以上、Cordovaでティラノスクリプト作品をAndroidアプリ化してGooglePlayに登録し公開開始するまでの体験記でした。なんか改めて見るといろいろ面倒ですね。特に音声ファイル周りがやっかいです。それでもなぜCordovaを使ったかというと、Javaがさっぱり分からないからです。Android Studioを使うなら、ある程度Javaの知識が要るな～めんどくさいな～と思って、JavaScriptだけで大体なんとかなるCordovaを使うことにしました。Javaが分かる方は普通にAndroid Studioを使えばいいのだと思います。ティラノプレイヤーっていう公式のフレームワークも使えますしね。 ★今回の私の環境
|