libGDX Android Studio alatt LibGdx alapú program létrehozása, meglévő projekt importálása, képek mozgatása
Készítette: Lukácsi Roland
Frissítette: Hajdu Richárd Karádi Gábor Kiglics Norbert Verkman István
Tartalom 1
Bevezetés......................................................................................................................................... 2
2
Projekt importálása az Android Studioba........................................................................................ 3
3
Megvalósítás.................................................................................................................................... 4 3.1
Kirajzolás.................................................................................................................................. 4
3.2
Irányítás ................................................................................................................................... 9
1 Bevezetés Az alábbiakban egy egyszerű Adroid alapú applikációt fogunk készíteni a libGdx segítségével. Nem kisebb feladat vár ránk, mint egy pálcikaember mozgatása ide-oda a képernyőn a kijelző nyomogatásával. A program készítését lépésről lépésre fogjuk bemutatni.
2 Projekt importálása az Android Studioba LibGdx alapú projekt létrehozásáról „A libGdx letöltésének telepítési lépéseinek bemutatása” című dokumentumban esik szó, ezzel ez a dokumentum külön nem foglalkozik. Amennyiben már elsajátítottuk a libGdx projekt létrehozásának csínját-bínját, akkor az első lépés, hogy importáljuk a frissen létrehozott Gradle projektünket. Ehhez kattintsunk a File menüpontra, majd az Import Projekt pontra. Keressük meg a projektünk mappáját, jelen esetben test, majd jelöljük ki a build.gradle fájlt, aztán kattintsunk az OK gombra.
1. ábra Importálás Ha mindent helyesen csináltunk, akkor az Android Studio kis idő múlva beimportálja a projektet.
3 Megvalósítás 3.1 Kirajzolás Adott tehát egy üres Projekt. Keressük meg a core mappán belül a fő osztályt, ami jelen esetben NewGame néven szerepel. Amikor a Gradle generál egy új projektet, ez az osztály egy ApplicationAdapter típusú osztály lesz, ami a mi kis küldetésünknek tökéletesen megfelel.
2. ábra Üres projekt Töröljünk ki minden felesleges sort, maradjon csak egy üres create() és render() függvény a képen látható módon. Annyit azért érdemes tudni, hogy a create() függvény egyszer fut csak le az osztály meghívásakor, míg a render() függvény folyamatosan fut, egy véget nem érő ciklus, ha úgy tetszik. Először is szükségünk lesz egy képre, amit majd mozgathatunk. Töltsünk le egy tetszőlegeset az Internetről. Itt mindenki kiélheti a fantáziáját, mi egy egyszerű pálcika embert fogunk használni.
3. ábra Pálcikaember
Tipp: Ha a kép valamilyen háttérrel rendelkezik, még ha fehér is, akkor is meg fog jelenni a figuránk körül. Ezért érdemes valamilyen képszerkesztő programmal eltüntetni a hátteret. A Gimp erre a célra tökéletesen megfelel. Ha megvan a kép, helyezzük azt az android/assets mappába a képen látható módon. Jelen esetben stickman.png nevű fájl tartalmazza a nagy tettekre hivatott pálcika emberkénket.
4. ábra Források Következő lépésben hozzunk létre hősünknek egy textúrát
5. ábra Textúra
Rajzoltassunk ki a fehér hátteret.
6. ábra Háttér
A Gdx.gl.glClearColor() függvény red, green, blue, alpha értékeket vár 0 és 1 között. Ha mindent paramétert beállítunk egyesre (1,1,1,1) és lefuttatjuk, akkor csak fehér hátteret kapunk.
7. ábra Teszt 1 Tipp: Minden apró módosítást nem érdemes valós eszközön tesztelni, teszteljünk desktop módban olyan változtatásoknál, amik nem érintik a valós eszközön való működést, összességében sok időt spórolhatunk ezzel. Hozzunk létre egy Sprite objektumot, hogy könnyebben kezelhessük a textúránkat.
8. ábra Sprite A Sprite egyébként egy nagyon hasznos dolog. Méretet, elfordulási szöget, kép orientációt, pozíciót és sok egyéb dolgot művelhetünk vele.
Állítsunk is be a pálcika emberünk kezdeti értékeit.
9. ábra Paraméterek A width és height értékek lesznek a pálcikaemberünk szélessége és magassága. A szélesség jelen esetben a képernyő szélességének fele, a magasság pedig a figura szélességének kétszerese. A figurát a képernyő bal alsó sarkában helyezzük el, ezért a 0,0 paraméterek a setPosition-nél.
Elérkezett az idő, hogy kirajzoljuk a figuránkat, de ehhez létre kell hoznunk egy SpriteBatch nevű objektumot. Egyébiránt mindent, amit ki szeretnénk rajzolni, a SpriteBatch.begin() és SpriteBach.end() függvények közé kell, hogy kerüljön.
10. ábra SpriteBatch Futtatva a programot, a következőt látjuk:
11. ábra Teszt 2
Bizony megveregethetjük a vállunkat. Mérföldkőhöz érkeztünk, ott pihen a figura az alsó sarokban az elvárásainknak megfelelően, már csak mozgásra kell bírni. Lássunk hozzá.
3.2 Irányítás Először is kezelni kell az interakciókat valahogy. Szerencsére a libGdx ilyen osztállyal is szolgál: az InputProcessor névre hallgató osztály tökéletesen megfelel a célnak. Nem hozunk létre új osztályt, inkább a New Game osztályon belül implementáljuk. Előfordulhat, hogy a studio valamit nem talál. Fel fogja ajánlani, hogy importáljuk a megfelelő csomagot, és hívjuk meg a szükséges metódusokat.
12. ábra Függvények Számunkra jelen példa esetében ezek közül a touchDown() és touchDragged() metódusok érdekesek. Valósítsuk meg, hogy hősünk oda ugráljon a képernyőn, ahova bökünk!
Először is állítsuk be az InputProcessort:
13. ábra InputProcessor Majd kezeljük az érintést:
14. ábra Irányítás 1 Hogy mi szükség az y változó bevezetésére mikor van nekünk egy screenY paraméterünk is? A fejlesztők valamilyen kifacsart humorérzéktől vezérelve úgy gondolták vicces lesz invertálni az Y koordináta lekért értékeit, így egy 800 magas kijelző aljára bökve 800, tetejére bökve 0 értéket kapunk, ami nem túl jó, ezért vonjuk ki a magasságból a lekért értéket így korrekt értékeket kapunk. Ha futtatjuk a programot, láthatjuk, hogy az megfelelően működik, csupán két probléma van: egyrészt az, hogy ha végighúzzuk a képernyőn az ujjunkat, akkor nem a megfelelően reagál, valamint a figura kicsit jobbra föl csúszik a bökéshez képest. Utóbbi azért van, mert a figura orientációja a bal alsó sarkában helyezkedik el. Ez a középpont pedig nem a figura mértani középpontja. Oldjuk meg a problémát úgy hogy a képet tartalmazó sprite méreteinek a felét kivonjuk a bökés pozíciójából.
15. ábra Irányítás 2
Ugyanezeket a sorokat bemásolva a touchDragged() függvénybe a másik problémánk is megoldódik egy csapásra, és immár ide-oda húzogathatjuk karakterünket.
16. ábra Irányítás 3 Futtassuk le! Ha mindent jól csináltunk, a program megfelelően fog működni.
