CCDxLib72を使って過去に作ったゲーム3種をAndroidに移植してみた

はじめに

前回の記事で、Cocos2dxで動くDxLibの関数群のライブラリであるCCDxLib72を公開しました！
今回の記事は、それで実際にGooglePlayに出したところまで解説します！
chy72.hatenablog.com

完成品

最初に完成品を見せるのが一番だろうということで。

①GreedGreen

https://play.google.com/store/apps/details?id=suken.greedgreen
https://lh3.googleusercontent.com/fyqJneg92hJImrRrwKXALhyQpeXOn07YnSZ3-qDwI8ht03HSC_p55jPHMYJ9idDzq88=h900

高校生の後輩がDxLibで作成したゲームです。
全体的にすっきりとしていて、操作ももともとマウス操作なのでスマホにそのまま移植しても綺麗に動きました。
紹介する三作品の中で一番スマホで遊びやすくてオススメです。

②Celestial

https://play.google.com/store/apps/details?id=suken.celestial&hl=ja
https://lh3.googleusercontent.com/zyX1fGTCfVDCSXOdmCQHwB_3EkruLHJDsMYC-Fwflq2BNwBr3e-iQVao8_AbPmVGXA=h900

僕が高校３年の頃にDxLibで作成したゲームです。
とりあえずWindows版のまま殆ど手を加えずに移植したので、操作性・見やすさは難ありです。
（絵も音楽も自分で作ったのと、受験期だったという理由で、作品のレベルに関してはご容赦ください）

③日本史クイズ

https://play.google.com/store/apps/details?id=suken.historyquiz
https://lh3.googleusercontent.com/PA0aPALf8wZKA53tjPIDx8Gg8wm0H1dlU-SySnCvSa02ckgmUmU5A0grqoDx1n4qvQ=h900

これも後輩がDxLibで作成したゲームです。
操作はもともとマウス操作だったので、スマホにそのまま移植しても操作はできてよかったのですが、スマホの小さい画面では見づらいかもしれないです。

元となるゲームを用意

github.com
（残り２つの作品は、もともと自分が作ったゲームではない（後輩が作った）ので、コードを公開するのも気が引けるので…）
まずは、元となるDxLibで動くゲームを用意します。

移行

まずは、cocosのプロジェクトを作成します。
最初のHelloWorldSceneがAndroidでも動くところまでは自力でお願いします。
移行した時に躓いたところを中心に列挙します。

コードのリファクタリング

  • Data という名前の変数をもともと使用していました。しかしCocosにもDataというクラスはあるので、そのDataという変数を一括でcDataという名前に置き換えました。
  • ShiftJisでもともとコードを保存していましたが、DrawStringで文字化けが発生するのでUTF-8(コードはBOMあり、読み込むテキストファイルはBOMなし)に変更しました。
  • #define RED とかしていたのですが、それがCocosのColor3Bクラスの REDと競合したので sRED とかに変えました
  • windows.h(ShellExeCuteに利用)など、Windows専用のヘッダーはincludeしないようにしました
  • main.cpp というファイルを使っていたのですが、cocosのmain.cppと競合したので、main2.cppという名前に変更しました。

bmpをpngに

BGMの読み込み

  • 内部ではSimpleAudioEngineというものを利用して音を鳴らしているのですが、メモリに先立って読み込めるのは確か10秒程度までの効果音なので、10秒以下の効果音を読み込む前に SetCreateSoundDataType(DX_SOUNDDATATYPE_MEMNOPRESS) を、10秒以上のBGMを読み込むときはSetCreateSoundDataType(DX_SOUNDDATATYPE_MEMPRESS)を宣言します。

ファイル入出力変更

  • 普通にfopenなどをしたいところですが、Resourcesに同梱してアプリに入れるデータは、読み込みしかできないこと、AndroidのManagerを利用してしか読み込めないということがあるので、それ専用の機能としたFileRead~~ の関数に書き換えます。
  • また、書き換えるデータ（セーブデータなど）は、専用の場所に新しくファイルを作成するため、専用の関数UserDatafopenにfopenを変更します。(移行は普通にfseekとかもできます)fopenをしたくない場合は、getUserDataPath()を利用して、書き換え可能なパスを取得して使います。

操作方法変更

  • Androidにはキーボードはないので、新たに作成したエミュレート用の関数を宣言します。
  • これが一番重要なのですが、ここが一番スマホとパソコンとの大きな違いなので、もともとマウスで操作するゲームをタッチ操作に置きかえるのならともかく、キーボードで操作するゲームをタッチしかないスマホに置きかえると、単純に置き換えただけでは操作性を激しく損なう(このゲームがよく分かる例)ことを注意してください。

ロジック変更

  • InitやCCDxStartやCCDxLoopを使う形に変更します。
  • ProcessMessage,ScreenFlipでループを作って利用しているコードがあると思いますが、CCDxLib72では、ProcessMessageに当たるものがなく、CCDxLoopを抜けるということでしかProcessMessageやScreenFlipすることができません。
  • そういう部分がもしもあれば、ロジックを考えて書き直すしかありません。(通常は、ゲーム全体として一つの大きなループでしかないと思うので、その場合は必要ありません)
  • 理由としては、cocos2dxの方へCCDxLoopを抜けたあとに制御を返して、他の処理（イベント処理やFPS制御やDxLibでいうProcessMessageや他のSceneの処理）をしてもらって描画するという形をとっているからです。
  • ProcessMessageに当たる関数を作成することも考えたのですが、それをすると他のcocos2dxの機能(Widgetなど)が使えなくなったり、バージョンアップで動かなくなったり、マルチプラットフォーム対応が難しくなったりしそうだったので、これに関してはご容赦ください。代わりにただのSceneとしてしかCCDxLibは存在しないので、他のcocosの機能は使い放題だと喜んでください！
  • メモ：この処理をうまく非同期にできれば、可能かもしれません、強い方、実践してください。

完成

以上の変更(cocosの機能に関する変換(png,BGM,UTF8),マルチプラットフォームに関する変換(fopen,Emulate),ProcessMessage)を行い、cocos compile -p android で、コンパイルして、Googleに3000円投げてアカウント開いてGooglePlayにapkを投げて必要事項を記入したらすぐ公開です！

思ったこと

DxLibで作成したゲームは、どうしてもPC用に最適化されていて、コードをそのまま写しただけだとどうしても操作性がやや難になってしまいます。画面も小さくなるので意識していないと見辛くなることもしばしばです。なので、このライブラリでは移植の大部分を手助けすることはできますが、根幹の操作性だとかユーザビリティというところまではどうしても対処できないということを思いました。
やはり、ユーザーのことを考えるなら、苦を覚悟して手をかなり加える必要があるのかもしれません

スマホ向けにDxLibのコードがそのまま動く！ Cocos2dxで動かせるDxLib、「CCDxLib72」を公開します！

2017/10/25追記

ＤＸライブラリ置き場 Androidアプリ開発の注意点など
公式でAndroid版が出たようなので、そちらを使用すべきです。
僕が作った以下で紹介するライブラリはもうメンテナンスされておらず、
今後もするかどうかも未定である点からも公式のものを使うべきです。
しかしながら、cocos2dxでラップした以下の版を使いたい方も
いるやもしれませんのでこの記事はこのまま残しておきます。


リポジトリ

github.com

これは何？

Cocos2dxの機能でDxLibの関数群(現在72個)をラップしたものです。

何が出来るの？

DxLibは通常Windowsでしかビルド出来ません。
しかしこれを使えば、同じC++で書かれているcocos2dxを利用して、
DxLibのコードを殆どそのままでスマホ向け等にゲームをビルド出来ます！
使用許諾などはいらないので、好きに使ってください。

開発環境の整え方

リポジトリ　https://github.com/Muratam/CCDxLib72　のReadMeに記入していますが、
例えばAndroidに向けてビルドする手順の概略としては、

  • python,cocos2dxをインストールして、cocos2dxのプロジェクトを新規作成する。
  • CCDxLib72 をダウンロードして Classesに入れて、同梱のButtonExample.pngをResourcesに入れる。
  • 書いたDxLibのコードをClassesフォルダに入れて、ゲームで読み込むファイルをResourcesフォルダに入れる。
  • 同梱のReadMe.mdを見ながらコードをマルチプラットフォーム用に書き直す。(例えばファイル入出力やユーザーの入力操作)
  • cocos2dxへの移行のヒントはReadMe.md にも書いてあります。
  • cocos compile -p android でAndroid向けにビルドで完成！

紹介スライド

www.slideshare.net

Cocos2dxでにゃんにゃんする

初めに

DxLib http://homepage2.nifty.com/natupaji/DxLib/ の関数をcocosでエミュレートできるようにラッパー関数を作っています。
昔はDxLibでゲームを作っていたので、そのコードをそのまま改変することなくAndroid,Macintosh,ios,linux,...にもビルド出来るようになれたらと思い、作成しています。
一度JavaでAndroid用にDxLibを作っていたのですが、C++ ->Java で結構リファクタリングする必要があるのであまり需要もないし面倒だったので、今回C++であるcoco2dxsにしようとした次第です。github.com
今、半分くらいの関数をcocos2dxでエミュレート出来ているので、もう少しで公開出来そうです。
その過程でつまづいたところを先にメモしておきます。

cocosのバージョン

cocos2dxのversionは3.8です(cocos2d.cppより)
cocos --version は2.0だった

開発環境

windows10 + Visual Studio 2013 Professional です。
基本的には、VisualStudioでWin32用でテストしていって、Android実機で試すということをしていってます。

開発環境導入

pythonがいりますね、僕はPietとRubyは入れていたのですが…
cocos2dxもcocosも落としてsetup.pyしてwin32のslnをVisualStudioで開いて10分くらいかけてコンパイルしたらまずHelloWorldのゲームシーンが出来ますね。
VisualStudioだとスクリプトの文字コードの警告が多いので、BOMとかUnicodeとか頑張ってください。あくまでもWarningなので問題はないですし。
一度ビルドしてしまえば以降は楽になります。

Androidビルド

EclipseやAndroidStudioなくても、SDK Ant NDK があればいいですよね。
画像などのファイルは最上階層のResourcesにいれておけば勝手にコンパイルするときにAndroidの方いじらなくてもassetsに入れてくれます(解像度とか気にしなければ)。
書いたコードを他のプラットフォームでもコンパイルできるようにするためには、最上階層のClassesの中にコードをいれておきましょう。
proj.android/jni/Android.mk を書き換えましょう。
　　　　　../../Classes/HelloWorldScene.cpp \
のところを整合性を揃えてないとエラーになります。
VisualStudioでてきとーに作っていて BYTE とか TRUE std::_pi とか使っていても、そういうのがないってこのAndroidビルドの時に怒られて気づけます。

cocos

Windows版のpreloadBackgroundMusic()の中何もないのおもしろすぎでしょ。
あとAutoBatchingがあるからBatchNodeが非推奨になっているのとか。

僕の考えた最強のvimperatorrc

右手だけでの直感的ブラウジングに焦点をあてたやつ

p：タブ開く

l：お気に入りバーを開く

s：検索ボックスに標準を移す

Delete：タブを消す

Alt+⇆：戻る・進む

Ctrl+⇆：タブ切り替え

t：タブを選んで開く

u：タブを開きなおす

U : タブを選んで開きなおす

f：例のアレ

vimらしさ：無し

 

gist.github.com

東京旅行に行ってきました

はじめに

両方の一大イベント(コミケとYAPC)に行ってきました！
親切な人が東京には多くて、とても楽しかったです。
が、なかなか毎日歩いて歩いて疲れました…
別にこれはつらつらとその10日間の記録を書いただけなので、気楽にどうぞ！

8/12

居場所を求めて誰もいない夜の部室で待機(朝早く起きれそうになかったので)

8/13

しんばしまで18きっぷでいきました！
まずは、そのまま初めてのカプセルホテルへ…
しかたないですよね、コミケが気になって夜寝れなくても…

8/14

たくさんの人がいるコミケへ行きました！
！！！こんなに人で混んでいるんだ！！！やばい！！！
そんなに本気ではなかったのでゆっくり物見遊山しました。
のんびり評論ブースとか見ていました。
話は変わりますが、企業のKMCを見つけたりもしました。

 

8/15

しばらくきゅうけい～ということで、この日は東京観光しました。
あきはばらを巡ったり、初の猫カフェに行ったりしました！
いがいと猫ってかわいいですね～追いかけまわしたら逃げられました…
のんびりその後はアキバのゲーセンを見たりしました。

8/16

場面は変わってコミケ3日目＆自作ゲームフェス授賞式の日です!!
かなり朝早くから出発しましたが、すでに始発は満席…やばい。
ラッシュでアイマス島を見ました、朝いちばんはさすがに歩くスペースはありました。
逃げるようにゲーム島を漁ってから…授賞式へ！
ゲーム島でKMCも出店しました！！！買ってくれた方はありがとうございました！
たくさんの自作ゲーム受賞者とそのまま立食して二次会に行きました！
くたくたになっていたので僕はそこで半分寝てしまったのを後悔しています…
っと…ゲーム作りをしている人はみんな楽しそうで良かったです！

8/17

てか、YAPCまで暇だ！ということで、KMCのメンバーと築地へ行きました！
僕は海鮮丼が大好きなので、築地市場の魚を食べれてとてもよかったです！
はち公(@渋谷)を見つけたり、東京を色々巡りました。
東京の会社の社内見学を先輩と一緒にしたりもしました。

8/18

京大マイコンクラブの部員のお使いをしに下北沢へ行きました！
へぇ～！あそこってカジュアル女性服がいっぱい売ってるんですね～！
行くついで、銅鑼パーソンのライバル「スリスリくんさん」に会ってきました！

 

8/19

くたくただったので、のんびり過ごしていました～

8/20

この日は、YAPCの前夜祭ですね！少しだけお手伝いもしてきました。
とちゅうでイヤホン買いに行きました。
にひひ…やっぱ専門店は違いますね！
しかも、安いですしね。
まずはYAPCは前夜祭ということで、uzullaさんから始まりました！
しかも内容はPHP...Perlの話そういえばYAPC通してあまり聞かなかった…
たくさん人がいて盛り上がっていて楽しかったです！

8/21

YAPC1日目！
休憩時間でせっかくなのでPerlの本を買ったりしました。
発表を聞いていると、僕のレベルでは「へぇ～こんなことが出来るなんてすごいなあ…」
って感じだったのですが、
やってみたいと思えることがどんどん増えていって良い刺激となりました。
やっぱり家でじっとしていたり、
京都にいているだけでは得られないことってたくさんあるんだなあと思いました。
KMCからは、(多分唯一の)学生トーカーとしてhnagaminが難解画像プログラミング言語Pietの話をしました。
Perl,PHP,Pythonと来たらPietしかないですもんね！
そしてLT。銅鑼パーソンとして銅鑼を叩かさせてもらいました！
途中で黒塗りの高級車で拉致した忍者スリスリくんさんと一緒に叩きました！
2000人もいる会場で銅鑼を叩くなんて緊張するかも…と最初は思っていましたが、
むしろLTの内容がおもしろくってそんな緊張は吹き飛んでしまいました！
思ったのは、LTをする人たちは、本当にLTが上手いということです。
4分～4分30秒で終わる人が多く、勢いにまかせてLTをしているように見えてきちんと計算してやっているんだなあと思いました。
この短い時間でも、きちんと自己紹介もして伝えたいことも全部伝えているというのはやはり流石だと思いました。
実際この日は2人しか5分を越えなかったですし。
間の準備の時間は猫トーストラボさんのトークがありました。
猫トーストラボさんの退場の時に銅鑼を叩いてもいいかなあと思ったんですが、
やはり銅鑼はLTの締めとして使うのがいいということと、
東京の笑い的には猫トーストラボさんの退場は流れる感じで退場する方がよいとのこと。
なるほどなるほど。
笑いの絶えない猫トーストラボさん恐るべし。
個人的には「Perl同人活動報告2015」がツボでした。
所変わって、立食の時間。LarryWallにサインをもらいました！
Web系エンジニアは勢いだけで生きているように感じるくらい勢いがあって楽しかった！

8/22

YAPC2日目！
この日も銅鑼パーソンをさせてもらいました！
この日のLTは、電話や実際に無線を組み立てるのやモールス信号みたいに、懐古的なものが多くておもしろかったです。
特に実際にCONBUの人達が組み立てるLTは、間近で設営の様子を見れて良かったです
はっとしている間に設営完了！これをLTでやるセンスは流石です。
いきなりこちらに来て設営を始めたので思わず銅鑼を叩きそうになりました
ステージ全体を使うLT、音楽を鳴らすLT、どのLTも5分以内でしかも観客の心をつかんでいて奥深いと思いました。
ということで、二日間の銅鑼を担当させてもらいました。
こんな貴重な体験をさせてもらったのも何かの縁ということで、感謝感謝です!

8/23

青春18きっぷで帰宅しました。

おわりに

エンジニア人生最高！

サクラエディタでSchemeする

私はサクラエディタだ！

サクラエディタでSchemeを編集して色がついたり、かっこの開始と終わりが分かったりするようにした！

gyazo.com

www.dropbox.com

設定→タイプ別設定からインポートしてください