【2015年冬版】phonegapでアプリ化する(Android版)
☆専用のアプリ化用ツール「ティラノプレイヤー」が公開されています。
この記事の方法は古いですので、ご注意ください。
最新のアプリ化手順は以下となります。
===================
ティラノスクリプトで作成したゲームをアンドロイドアプリ化する手順を説明します。
解説で確認した環境は windows10 です。
Macでも各自で対応するものをインストールして実施いただければ支障はないかと思います。
なにかありましたら、ご連絡いただけると幸いです。
JDKのインストール
最初にJDKをインストールします。
以下のURLにアクセスしてください。
Java SE Development Kit 8 - Downloads
Accept License Agreement にチェックを入れて
ご利用の環境に応じて、ファイル名のリンクを選択してください。
ダウンロードが完了したら、インストールを実施してください。
続いて、JDKにパスを通します。
コントロールパネル → システム → システムの詳細設定
から環境変数を開きます
システムの環境変数に新規追加します。
変数名:JAVA_HOME
変数値: C:\Program Files\Java\jdk1.8.0_65
この変数値は、ダウンロードしたバージョンや環境によって異なる場合がありますのでそれぞれの値に置き換えてください。上のまま書いてもうまく動きません。
AndroidStudioのインストール
つづいて、以下のURLにアクセスします。
Download Android Studio and SDK Tools | Android Developers
DOWNLOAD ANDROID STUDIO をクリックして
ダウンロードを開始します。
ダウンロードが終わったらインストールを開始してください。
インストール中の設定は特に変更せずデフォルトのまま進めてください。
設定が完了したら、AndroidStudioを起動してください。
注:ここでエラーがでて起動できない場合はJDKの環境変数の設定が間違っている可能性がありますので、再度確認してください。
起動したら、エミュレーターでの動作を確認してみます。
まず、[File]-[New]-[NewProject] から適当なAndroidプロジェクトを作成してください。
その後、
[Tools]-[Android]-[SDK Manager] を選択します。
SDK Tools のタブを選択して
「Intel x86 Emulator Accelerator(HAXM installer) 」にチェックを入れて Applyを押してください。
これだけでは、インストールは終わりません。
AndroidSDKがインストールされているフォルダを開いて intelxaxm-android.exe を実行してインストールしてください。
それぞれの環境により場所は変わりますが
<各自のパス>\AndroidSdk\extras\intel\Hardware_Accelerated_Execution_Manager
フォルダの中にダウンロードされているかと思います。
この後、AndroidStudioを一回閉じてください。
NodeJSのインストール
つづいて、NodeJSをインストールします。
にアクセスして v5.0.0 Stable をダウンロードしてインストールしてください。
PhoneGapのインストール
コマンドプロンプトを起動してください。
黒い画面が表示されるかと思いますのでそこで
npm install -g phonegap
と打ち込んで最後にエンターを押してください。
成功したら、そのままコマンド画面で
phonegap create mygame
と打ちます。次に
cd mygame
phonegap plugin add cordova-plugin-media
phonegap build android
と続けて実行します。
これで、アンドロイドプロジェクトが作成され、アプリ化する準備が整いました。
ティラノスクリプトをアプリ化する
さて、いよいよティラノスクリプトのゲームをアンドロイドアプリ化します。
先ほどのコマンド画面で
explorer .
と打ってください。するとWindowsのエクスプローラーが開くかと思います。
以下のような mygame フォルダの中身が表示されるのを確認してください。
つづいて、アプリ化したいティラノスクリプトのプロジェクトフォルダを用意します。
ティラノスクリプトのプロジェクトは以下のような構成になっているかと思います。
この index.htmlをエディタで開いて、</ body> の直前に以下のコードを追加してください。
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
保存します。
その後、プロジェクトフォルダの中身のファイルをすべて選択してmygameのフォルダの中の
\mygame\platforms\android\assets\www
フォルダの中へすべて上書き保存してください。
これで、アプリ化の準備は完了です。
エミュレーターで動作確認
それでは、アプリ化をテストしてみましょう。
再度、AndroidStudioを起動してください。
[File]-[New]-[Import Project]を選択して
先ほど作成しておいた、「mygame」フォルダを選択します。
その後の確認事項については、デフォルトのまま進めてください。
プロジェクトが開けたら、
[Run]-[EditConfigurations]を選択します。
その後開いた画面において
①左上の+ボタンを押してください。(AndroidApplicationを選択)
②NameはTest
③Moduleはandroidを選択
④Emulator は 適当に表示されるものを選択。
(なにも表示されない場合はAVDManagerでインストールしてください)
OKを押します。
最後に今回作成したものを選択されていることを確認して再生を押してください
起動には時間がかかります。
しばらく待ってください。
こんな感じでエミュレーターが起動して、ティラノスクリプトのゲームが始まりましたね。
上部の電池バーや横向き、縦向きの設定なども簡単にできますので作成したゲームに合わせて設定してください。
実機で確認する
実機で確認する方法も簡単です。
まず、お手持ちのAndroid端末で開発者モードを有効にしてください。
以下の、ブログが詳しく書かれています。
Android Studioでアプリを実機で動作確認する - Android Studioでアプリ開発!
USBデバックを有効にします。
つづいて、先ほどと同様に
[Run]-[EditConfigurations]を選択します。
その後開いた画面において
①左上の+ボタンを押してください。(AndroidApplicationを選択)
②NameはJikkiTest
③Moduleはandroidを選択
④TargetDevice のところを USB deviceに指定
OKを押したあと、実行してください。
実機で表示されましたね。
注:実機がPCで認識されない場合はWindowsマシンにドライバが入っていないことが多いです。テストで使用した実機のドライバをWindowsにインストールして認識させてください。デバイスドライバで!みたいなものが出ている場合、ドライバが必要です。
以上でティラノスクリプトのAndroidアプリ化は完了です。
GooglePlayなどで販売したい場合は apk を生成してアップロードするだけです。他のブログで解説などが山程ありますので、割愛します。
(要望があれば、apkとGooglePlay への提出も書くかも)
お疲れ様でした。