Bevezetés a Conststruct 2-be
Készítsük el az első HTML5 játékunkat, aminek a neve 'Ghost Shooter' lesz. A cél: a játékos az egérrel forogjon, nyilakkal mozoghat és az egérrel lenyomásával le tudja lőni a szörnyeket. Mindent átnézünk, amit tudni kell egy egyszerű játék elkészítéséhez - a rétegektől az eseményrendszerig!
Megjegyzés: Ha kérdésed van az útmutatóval kapcsolatban, akkor kérlek ne a kommenteknél tedd fel! Ehelyett látogass a fórumra, hogy a lehető legjobb választ kapj kérdéseidre.
Construct 2 telepítése
Ha még nem tetted meg, telepítsd fel a Construct 2 legújabb verzióját itt. A Construct 2 csak Windows operációs rendszeren futtatható, de az általad készített játékok bárhol futhatnak, például Macen, Linuxon vagy iPadon. A Construct 2 korlátozott felhasználói fiókokkal is telepíthető. Hordozható, így felmásolhatod például egy USB adathordozóra és magaddal viheted!
Első lépések
Telepítés után indítsa el a Construct-t. 2. Kattintson a File (Fájl) gombra, és válassza a New (Új) lehetőséget.
Ezután megjelenik a 'Template or Example' (Sablon vagy példa) párbeszédpanel.
Itt található egy lista példákkal és sablonokkal, ami alapján lehet elkészíteni az új játékot. Egy üres új projekt létrehozásához válasszd ki a New empty project-et kattintson a mező alján található „Megnyitás” elemre. A Construct 2 az egész projektet egyetlen '.capx' fájlban készíti el számunkra. Egy üres layout (vászon, tervrajz) lesz a képernyőn közepén, ahova az objektumokat lehet létrehozni és elhelyezni. A layoutot úgy kell elképzelni, mint a játék egy szintje vagy egy menü képernyője. Más szerkesztőkben ezt room-nak (helyiségnek), scene-nek (jelenetnek) vagy frame-nek (keretnek) hívják.
Objektumok beszúrása
Csempézett háttér
Az első dolog, amit szeretnénk beilleszteni, egy ismétlődő háttérlap. Ezt a Tiled Background (Csempézett vagy Mozaik háttér) objektum teszi meg nekünk.
Új objektum beillesztéséhez kattints duplán egy üres területre a layouton. (Később, ha megtelt, akkor kattintson a jobb gombbal, és válassza az Insert new object lehetőséget.) Miután megjelenik az Insert new object (Új objektum beszúrása) párbeszédpanel, kattints duplán a Tiled Background (Csempézett háttér) objektumra a beillesztéshez.
Megjelenik egy célkereszt, amely jelzi, hova helyezi el az objektumot. Kattints valahova a layout közepére. A texture editor (textúra szerkesztő) nyílik meg, hogy beillesszünk egy csempe textúrát. Importáljuk a korábban mentett csempe képet. Kattintson a mappaikonra, hogy beilleszthesse a kiválasztott fájlt.
Zárd be a textúra-szerkesztőt a jobb felső sarokban lévő X-re kattintva. Ha a rendszer erre kéri, feltétlenül mentsen! Most már az új csempézett háttér jelenik meg a layouton. Méretezzük át, hogy lefedje a teljes layoutot. A baloldalon lévő Properteries (tulajdonságok) mutatja az objektum összes beállítását, köztük a méretét és a pozícióját. Állítsuk át a helyzetét 0, 0-ra (a layout bal felső sarkára), és méretét 1280, 1024-re (a layout mérete).
Vizsgáljuk meg az eredményt. A nézet csökkentéséhez tartsa Control billentyűt és az egér görgőjével görgessen lefelé. Alternatív megoldásként kattintson a View (Nézet) gombra – majd a zoom out-al kicsinyíthet. Az egér középső gombjával vagy a szóközzel is lehet pásztázni. A csempézett háttérnek most le kell fednie a teljes layoutot:
A Control + 0 vagy a View - zoom to 100% opcióval visszatérhet az 1: 1-es nézethez.
(Ha már türelmetlenül szeretnéd látni az eredményt kattints az ablak címsorában található 'Run' (Futtatás) ikonra - egy böngészőnek kell felbukkannia a csempézett hátteres elrendezéssel!)