モーリーのメモ

プログラミングやCG作成等、アプリ開発を中心に情報を収集中!

プロジェクトの実行とビルドを確認する!:Cocos Creator

 こちらの記事で、インストールからプロジェクトの作成まで行いました。
mmorley.hatenablog.com

 今回は、作成した『Hello World』プロジェクトがちゃんと実行できるのか、そしてiOS向けにビルド出来るのかを確認します。
 いろいろ作る前に、そもそもゴールに行けるのか試したいと思います。

使用環境

 私が使用している環境です。

  • Mac OS X El Capitan Version 10.11.4
  • Cocos Creator Version 1.0
  • Xcode Version 7.3
  • ブラウザ:Google Chrome Version 49.0.2623.110 (64-bit)

まずは実行(プレビュー)

 新規作成した『Hello World』プロジェクトをそのまま実行してみます。
 『Simulator』と『Browser』のどちらのデバイスで実行するか選択し、『Game Preview』ボタン(上図の赤枠)で実行(プレビュー)します。
 f:id:mmorley:20160403145700p:plain:w400

『Simulator』で実行

 『Cocos Simulator』が起動し『Hello World』が実行されました。
f:id:mmorley:20160403153208p:plain:w300

実行速度

 実行されるまでの時間は速いです。
 プロジェクトの中身が違いますが、『Cococs Code IDE Version 1.2.0』から『Simulator』で実行した場合と同等か、『CocosCreator』の方が速いです。

ログ出力

 画面中央下部『Console』にログが表示されます。"cc.log"を書き加えて見ましたがこちらに出力されました。
 "Simulator : libpng warning: iCCP: known incorrect sRGB profile"というWarningが1つ出ましたが、これは使用しているpngに余計な情報があるからみたいです。
 (参考URL:http://qiita.com/takahashim/items/39534bd820f7fd71a5bb

『Browser』で実行

実行速度

 ブラウザ(Google Chrome)に『Fireball | New Project』というページが起動し、『Hello World』が実行されました。
 f:id:mmorley:20160403153404p:plain:w300
 こちらは実行されるまでの時間がめっちゃ速いです。
 『Cococs Code IDE Version 1.2.0』より速いです。いちいちターミナルが起動しません。

ログ出力

 『Console』ウインドウには"Compiled successfully"と表示されるだけでした。
 "cc.log"の内容は『Google Chrome』の『デベロッパーツール(キーボードのoption + command + i)』で確認できました。
f:id:mmorley:20160403155446p:plain:w400

リロードボタン

 『Simulator』で実行したときには無効のままで、『Browser』で実行したときに有効になりました。
 試していませんが『CocosCreator』にプレビュー用のアドレスに接続しているデバイスに対するリロードボタンでしょうかね。
f:id:mmorley:20160403160927p:plain

プロジェクトの『Xcode』への出力(Publish)

 ドキュメントに『Xcode』用のプロジェクトを出力する方法があったので試してみました。
 『CocosCreator』のアプリケーションメニューの『Project』-『Build』をクリックします。
 f:id:mmorley:20160403164545p:plain:w400
 下記のような『Build』画面が開くので、『Platform』で『iOS』を選択し、『Build』をクリックします。
 f:id:mmorley:20160403165904p:plain:w200
 進捗バーに『Sleep』と表示された後、ログを確認して”Build suceed.”とあれば完了です。
 プロジェクトフォルダ内に『build』フォルダが作成されます。
 『Xcode』用のプロジェクトは下記の場所に作成されます。
 『/NewProject/build/jsb-default/frameworks/runtime-src/proj.ios_mac
 f:id:mmorley:20160403171041p:plain:w200
『proj.ios_mac』を『Xcode』に取り込んで、Build→『iOSシミュレータ』で実行まで出来ました。
 私のパソコンのスペックが低いからかも知れませんが、Buildはけっこう時間がかかりました。

『CocosCreator』で『iOS』向けのビルド

 『CocosCreator』でビルド可能です。
 『Build』画面で『Build』に続いて『Complile』を実行します。
f:id:mmorley:20160405000222p:plain:w200
 これもかなり時間がかかりました。
 『Complile』完了後、『Play』をクリックすると『Xcode』の『iOSシミュレータ』が起動して、実行出来ました。
 実行ファイルは下記の場所に作られました。
 『/NewProject/build/jsb-default/publish/ios
 f:id:mmorley:20160403200957p:plain:w200

『CocosCreator』で『Web Desktop』向けのビルド

 『Build』で、『Platform』で『Web Desktop』を選択し、『Build』をクリックします。
f:id:mmorley:20160405000729p:plain:w200
 実行に必要なファイルのセットは下記の場所に作られました。
 『/NewProject/build/web-desktop』
 f:id:mmorley:20160403203228p:plain:w200
 試しに『GitHub Pages』にアップしてみました。
Cocos Creator | HelloWorld

あとがき

 『Hello World』ぐらい動いて当たり前と思いきや、自分の環境では動かないということもあるので、最初に出力の部分を確認しました。
 いろいろ実装したらまた変わるかもしれませんが、それはまたその時ということで。
 こまめに動作確認しながら作りたいので、プレビュー実行がとても速いのは助かります。