Fejlesztőkörnyezet felkészítése Cocos2D keretrendszerben készült IOS játék Androidra portolására 1. rész

Posted by | · · · · · · | Cégélet · Webstar Works | 3 hozzászólás Fejlesztőkörnyezet felkészítése Cocos2D keretrendszerben készült IOS játék Androidra portolására 1. rész című bejegyzéshez

Szerezzük be a fejlesztéshez szükséges eszközöket, forrásokat, – mint az Android SDK, az Android NDK és a cocos2d-x keretrendszer, – hozzunk létre egy alap projektet, valamint támogassuk meg a projektünket verziókövetéssel.
A cégünk a tavalyi évben kiadott egy logikai játékot IOS-re, a Sprinkfield-et. (A játék fejlődéstörténetéről itt olvashattok.) Ennek apropóján jött az elképzelés, hogy adjuk ki Androidra is ezt a remek addiktív, logikai játékot. Én itt kerültem a képbe. Mivel az eddigi Fedex projektjeim mindegyike Android platformon íródott, így én kaptam meg a feladatot, hogy véghezvigyem ezt a konverziót.

Az első megdöbbenés akkor ért, amikor kiderült, hogy nincs támogatott Androidos (Java-ban írt) verziója a keretrendszernek, amiben a Sprinkfield készült. Ezért a Cocos2D cross-platform verziója mellett döntöttünk (cocos2d-x). Érdekesség a keretrendszerrel kapcsolatban, hogy C++ nyelven íródott, így mind Android alatt natív kódként, mind IOS alatt, mind Windows Phone-on futtatható. A platformok különbségeit lekezeli, ezért ugyanaz a kód futtatható különböző eszközökön (az adott platform operációs rendszerével a platform által használt nyelvben írt kapcsoló osztályok kommunikálnak).
A fejlesztést Xubuntu 12.10-es verzióján végzem, de bármely más Ubuntu disztribúción vagy bármely OSX verzión is működnek a bejegyzéseimben leírt módszerek.
Ez egy két részesre tervezett bejegyzés-sorozat, a terjedelem miatt. 🙂
Plusz három bejegyzést terveztünk még, szorosan a témába és a lenti példához kapcsolódóan:

  • a hasznos külső függvénykönyvtárak
  • a fordítás gyorsítás
  • fejlesztés során hasznos (egyedi) eszközök, szkriptek
Nézzük az egész projekt létrehozási folyamat első részét.

adt

Előkészületek

IDE és Android SDK letöltése

IDE-nek az Android által preferált Eclipse ADT kiadását választottam, ami egyben szállítja is a legfrissebb Android SDK-t és a fejlesztéshez elengedhetetlen androidos pluginokat is. Mindez letölthető innen.

A telepítés egyszerű, csak ki kell csomagolni a letöltött tömörített fájlt és már futtathatjuk is az IDE-t.

Én a $HOME/dev/ mappába csomagoltam ki, majd létrehoztam egy symlinket ami a $HOME/android mappáról mutat a $HOME/dev/adt-bundle-linux-x86_64 mappára (vagy adt-bundle-mac-x86_64 mappára OSX esetén).

ln -s $HOME/dev/adt-bundle-linux-x86_64 $HOME/android

Be kell rakni a PATH változóba a $HOME/android/sdk/tools és a $HOME/android/sdk/platform-tools mappákat, különben a később használt eszközök egy része nem biztos hogy működni fog.
android-developer-tools-logo-512a

Android NDK

A következő lépés az Android NDK telepítése, letölthető itt.

Egyszerűen csak ki kell csomagolni a $HOME/android mappába.

Így született egy android-ndk-r8d mappa, amire azonnal létre is hoztam egy symlinket (igen, nagyon szeretem a symlinkeket 🙂 ) ami ugyanabba a mappába, de egyszerűen ndk mappanévvel hivatkozik.

ln -s $HOME/dev/adt-bundle-linux-x86_64/android-ndk-r8d $HOME/dev/adt-bundle-linux-x86_64/ndk

Ez akkor jön jól, ha a jövőben újabb verzió jelenik meg az Android NDK-ból. Ekkor szimplán csak ki kell csomagolni a másik mellé, törölni az ndk symlinket, és az új verzió mappájára mutató symlinket hozni létre ugyancsak ndk névvel. Ebben az esetben elkerülhető sok elérési út átírása a projektekben.

Szerezzük be a keretrendszer forráskódját!

cocos2dx_portrait

Letölthető tömörítve a cocos2d-x honlapjáról vagy a GitHub-ról is.

Én inkább az elsőt ajánlom, később egyszerűbb dolgunk lesz vele. Ha mégis a GitHub-ról töltjük le, beleeshetünk abba a hibába, hogy egy nem stabil, fejlesztés alatt álló verziót kezdünk el használni, és később értetlen arccal tekintünk a világba. Hogy miért nem úgy működnek bizonyos dolgok, ahogy elvárnánk… (nem tagadom le, hogy ezt a hibát én is elkövettem 🙂 ).

Ha tömörítve töltöttük le, akkor a kicsomagolás után nevezzük át a mappát cocos2d-x-re. Bármelyiket is választjuk, ügyeljünk arra, hogy a cocos2d-x mappa a $HOME/workspace mappába kerüljön.

mv $HOME/workspace/cocos2d-2.1beta3-x-2.1.1 $HOME/workspace/cocos2d-x

Ha maradtunk a GitHub repository klónozásánál, akkor álljunk vissza egy stabil verzióra, ezeket megtaláljuk itt (akár innen is letölthetőek a bizonyos tag-nek megfelelő verziók).  pl így:

git checkout cocos2d-2.1beta3-x-2.1.1

Ha GitHubról szereztük be a cocos2d-x-ünket akkor törölnünk kell a $HOME/workspace/cocos2d-x/ mappából a .git mappát, valamint a .gitignore és a .gitmodules fájlokat, később fontos lesz, hogy ezek ne létezzenek.

Hozzuk létre az alap projektünket

A cocos2d-x szállít egy alap projektet létrehozó scriptet, esetünkben ez a cocos2d-x mappában található create-android-project.sh fájl.

Ezt mi módosítottuk az igényeinknek megfelelően. Elérhetitek a mi scriptünket innen (más módosításokkal együtt), vagy használhatjátok az eredetit.

Ha a mi módosított változatunkat használjátok, csak tömörítsétek ki a mellékelt fájl tartalmát a cocos2d-x mappátokba és írjátok felül a már létező fájlokat.

Ami nekünk nem tetszett az eredetiben (nem mondjuk, hogy rossz, csak szokás, ízlés, stb. kérdése):

  • a projektet a cocos2d-x mappa alatt hozta létre
  • környezeti változóktól függött, ha megegyezünk az sdk és az ndk helyében ($HOME/android/sdk,ndk) akkor használhatjuk azt különböző fejlesztői gépeken is
  • proj.android nevű mappát hozott létre a projektünkben, ehelyett projekt névnek megfelelő mappa legyen
A cocos2d-x mappába lépve adjuk ki a következő parancsot:

./create-android-project.sh

A folyamat lekérdezi az alkalmazásunk adatait, majd létrehozza annak könyvtárszerkezetét, benne a cocos2d-x HelloCpp példájának kódjával.

Verziókövetés beállítása

ralph2
CCScene* HelloWorld::scene()
{
    // 'scene' is an autorelease object
    CCScene *scene = CCScene::create();

    // 'layer' is an autorelease object
    HelloWorld *layer = HelloWorld::create();

    // add layer as a child to scene
    scene->addChild(layer);

    // return the scene
    return scene;
}
fix1

A fejlesztés során sokszor csak Wreck-It Ralph-ként tönkreteszünk már működő dolgokat, ilyenkor a legjobb, ha rendelkezésre áll a saját Fix-It Felix-ünk, amit verziókövetésnek hívnak. 🙂
A legfőbb funkciója persze nem az, hogy meg nem történtté tegyük a hibáinkat, de sokszor használjuk erre.

A fejlesztő csapatunk a Git-et részesíti előnyben, így a továbbiakban Git specifikusan közelítem meg a dolgokat.

Először is kandidálni kell egy tárhelyet, ahol a Git tárolhatja a projektjeinket. Ez lehet egy másik számítógépen is, amit ssh-n keresztül érünk el, vagy az adott számítógépen egy mappa (nem összetévesztendő a $HOME/workspace mappával – egy másik legyen)

pl: $HOME/git

Saját cocos2d-x repository

Inicializáljunk a saját cocos2d-x repository-nkat.

Belépünk terminálba és az előző pontban kiválasztott mappába navigálunk.

cd $HOME/git

A repository inicializálását a következő paranccsal tehetjük meg:

git init --bare cocos2d-x.git

Ezután nevezzük át a $HOME/workspace/cocos2d-x mappát.

mv $HOME/workspace/cocos2d-x $HOME/workspace/cocos2d-x-tmp

majd futtassuk le az alábbi parancsokat:
(nekem a $HOME/git volt a git repositorykat tartalmazó mappa a példában)

cd $HOME/workspace
git clone $HOME/git/cocos2d-x.git
cp -R cocos2d-x-tmp/* cocos2d-x/ && cp cocos2d-x-tmp/.gitignore cocos2d-x/ && rm -R cocos2d-x-tmp

Mi az igényeinknek megfelelően írtunk egy saját .gitignore-t, ez is benne van fent említett tömörített fájlban (amiben minden más cocos2d-x-et érintő változtatásunk is,  innen letölthető). Ha korábban letöltöttétek és kitömörítettétek, akkor már a helyén lesz a fenti parancsok végrehajtása után.

Ha ez megvan, akkor commitoljuk fel a saját cocos2d-x repositorynkat, az alábbi parancsokkal:

cd $HOME/workspace/cocos2d-x
git add -A && git commit -m "first" && git push origin master

Létrejött a saját cocos2d-x repositorynk, ez a későbbiekben jól jön majd.

Projektünk repositoryja

Hozzunk létre egy új repositoryt a már említett módon a projektünknek, most legyen a neve HelloCocos2dx

cd $HOME/git
git init --bare HelloCocos2dx.git

Ezután nevezzük át a $HOME/workspace/HelloCocos2dx mappát.

mv $HOME/workspace/HelloCocos2dx $HOME/workspace/HelloCocos2dx-tmp

majd futtassuk le az alábbi parancsokat:

cd $HOME/workspace
cp -R HelloCocos2dx-tmp/* HelloCocos2dx/ && cp HelloCocos2dx-tmp/.gitignore HelloCocos2dx/ && rm -R HelloCocos2dx-tmp

A projekthez is készítettünk saját .gitignore fájlt, ezt a létrehozási folyamat bemásolja a projektünkbe.
Ezt be kell másolni a $HOME/workspace/HelloCocos2dx mappába.

Ha ez megvan akkor commitoljuk fel a saját HelloCocos2dx repositorynkat is, az alábbi parancsokkal:

cd $HOME/workspace/HelloCocos2dx
git add -A && git commit -m "first" && git push origin master

Létrejött a saját HelloCocos2dx repositorynk. HURRÁ! 🙂

Most kössük be szépen a cocos2d-x repositorynkat, hogy ha más fejlesztő klónozza a HelloCocos2dx repository-t, ne kelljen keresnie a hozzá tartozó keretrendszert is.

Erre tökéletesen megfelel ha git submodule-ként bekötjük a cocos2d-x-et, majd letöltjük azt.

Ezt az alábbi paranccsal tehetjük meg:

cd $HOME/workspace/HelloCocos2dx

git submodule add $HOME/git/cocos2d-x.git

Ezzel meg is lennénk a verziókövetés beállításával, további submodule-okat a fent leírt módon adhatunk hozzá.

Összefoglalás

Ebben a bejegyzésben beszereztük a fejlesztéshez szükséges, eszközöket, forrásokat. Létrehoztunk egy alap projektet, amiben később dolgozhatunk majd és megtámogattuk ezt verziókövetéssel. A bejegyzés következő részében beállítjuk az ADT Eclipse fejlesztőeszközt és benne a projektünket, működő kódkiegészítéssel.

Share on FacebookShare on Google+Email this to someoneTweet about this on TwitterShare on RedditShare on LinkedIn

3 hozzászólás

Fejlesztőkörnyezet felkészítése Cocos2D keretrendszerben készült IOS játék Androidra portolására 2. rész | Webstar Blog says:

2013. március 19. at 12:27

[…] így bírjuk működésre az 1. részben létrehozott projektünket az ADT […]

Reply

Hasznos külső könyvtárak cocos2d-x keretrendszerben való fejlesztéshez | Webstar Blog says:

2013. március 26. at 17:00

[…] feltételezik két korábbi bejegyzésünk során létrehozott példaprojekt környezetét, itt és itt találjátok a kapcsolódó […]

Reply

Android-os cocos2d-x játék fordításának felgyorsítása | Webstar Blog says:

2013. április 9. at 14:55

[…] leírt megoldások feltételezik a korábbi példák projekt környezetét, melyek elérhetőek itt, itt és […]

Reply

Leave a comment