O čom je lab
Cieľom tohto cvičenia je práca s Unreal Engine. Náplňou bude inštalácia a vytvorenie jednoduchej 3D hry, ktorej cieľom bude pozbierať všetky kocky, ktoré sa budú nachádzať v mape, a zároveň sa vyhnúť pascám.
Objectives
- Inštalácia Unreal Engine
- Vytvorenie nového projektu
- Pridanie assetov
- Pridanie interakcie do hry
Ukážka
Instructions
Step 1: Inštalácia Unreal Engine
Task 1.1
Registrujte sa na Epic Games.
Prvým krokom je registrácia na Epic Games. Táto registrácia je zadarmo. V prípade, ak už ste registrovaní na Epic Games, preskočte tento krok.
Task 1.2
Stiahnite Epic Games launcher.
Pre stiahnutie Unreal Engine je potrebné si nainštalovať Epic Games launcher, ktorý je dostupný na tomto odkaze.
Task 1.3
Stiahnite a nainštalujte Unreal Engine.
Po stiahnutí Epic Games launchera je možné stiahnuť samotný Unreal Engine pomocou nasledujúcich krokov:
- Po otvorení Epic Games launcher-a je potrebné kliknúť v ľavej časti na Unreal Engine a v hornej lište sa zobrazia jednotlivé sekcie, treba sa prekliknúť na časť Library.
- Na inštaláciu novej verzie UE slúži tlačidlo so symbolom "+", ktoré sa nachádza pri Engine Versions. Na tomto cvičení sa bude používať verzia 4.16.x.
- Po kliknutí na tlačidlo Install, je potrebné kliknúť na tlačidlo Options a uistiť sa, že pri platformách nie je zaškrtnutá žiadnu možnosť. Rovnako tak nie je nutné sťahovať Engine Source. (Tieto veci nie je potrebné sťahovať a tým ušetríte miesto vo vašej pamäti. V prípade ak si tieto veci nainštalujete, nespôsobí vám to chybu.)
Comment
Platformy sa nachádzajú nižšie (je potrebné scrollovať). Uistite sa, že máte zaškrtnuté iba "Starter Content" a "Templates and Feature Packs".
- Po označení potrebných možností inštalácie stačí stlačiť tlačidlo Apply a následne Install.
Comment
Ak ste správne nainštalovali engine, mala by sa Vám pri ňom zobraziť možnosť "Launch".
Step 2: Vytvorenie nového projektu
Po otvorení verzie Unreal Engine pomocou tlačidla Launch (pri verziách UE v Epic Games launcheri), nasleduje vytvorenie nového projektu. Parametre nového projektu majú obsahovať Blueprint a ThirdPerson možnosť, aby sa ušetril čas s vytváraním sveta a pohybu kamery. Ďalej sa vyplní možnosť úložiska a názvu projektu.
Comment
Ak si vyberiete vytváranie sveta od začiatku (Blank), nezabudnite do sveta pridať aj svetlo, atmosféru, základnú plochu na hranie, vášho hráča a počiatočnú polohu kamery.
Step 3: Pridanie assetov
Pri vývoji hier sa často používajú rôzne assety, preto je táto časť venovaná vloženiu assetov do herného sveta.
Task 3.1
Stiahnite assset s názvom Infinity Blade: Grass Lands v marketplace epic games.
Task 3.2
Pridajte assetu do projektu v marketplace, po stiahnutí.
Task 3.3
Otvorte projektu a vložte objekty do mapy (napr. bránu, kríky a pod.). Tieto objekty sa nachádzajú v adresári Content v priečinku s názvom Infinity Blade.
Pri vkladaní assetov treba brať do úvahy, že nie všetky assety sú dostupné pre všetky verzie Unreal Engine. Ideálne je si pri vyhľadávaní assetov zvoliť tie, ktoré sú kompatibilné s vašou verzou UE.
Comment
Môžete si zvoliť ľubovoľný asset, avšak je potrebné odskúšať, či sa dajú dané objekty pridať.
Step 4: Pridanie interakcie do hry
Táto časť je venovaná vytvoreniu základnej hry, ktorej cieľom bude pozbierať všetky kocky v mape a zároveň sa vyhnúť pascám. V prípade, ak hráč stúpi na pascu, automaticky prehrá hru.
Herná mechanika sa v Unreal Engine vytvára pomocou Blueprintu (BP) a C++. Pri vytváraní komplexných hier je ideálne použiť kombináciu oboch, jednak kvôli prehľadnosti ale aj funkcionalite. Rozhodnutie, kedy používať ktorú možnosť, závisí od hry a fukncionality, ktorá sa vytvára.
Comment
My budeme používať Blueprint, nakoľko budeme vytvárať iba jednuchú hru, ideálne je však používať oba spôsoby.
Step 5: Vytvorenie kocky a rátanie skóre
Najskôr vytvorte premennú na počet kociek. Nakoľko sa táto premenná bude meniť v závislosti od hlavného hráča, bude táto premenná v BP objektu ThirdPerson.
Task 5.1
Otvorte si BP objektu ThirdPerson a pridajte do nej premennú boxes.
Task 5.2
V BP v ľavej časti obrazovky si vytvorte premennú boxes a nastavte ju na public (kliknite na ikonku vedľa premennej, aby sa premenná stala public, teda aby pri nej bolo otvorené oko). Následne si túto premennú nastavte v pravej časti obrazovky na typ integer. Skompilujte BP a automaticky sa tým vygeneruje počiatočná hodnota 0.
Step 6: Vytvorenie widgetu na zobrazenie aktuálneho skóre
Pre vykreslenie aktuálneho skóre (počet pozbieraných kociek) je potrebné vytvoriť widget, ktorý slúži ako plátno, ktoré sa bude zobrazovať nad samotnou hrou.
Task 6.1
Pre vytvorenie widgetu si v časti Content Browser do priečinka Content vytvorte priečinok UI, do ktoré budete ukladať jednotlivé widgety. Widget si vytvorte tak, že ťuknete pravým tlačidlom a zvolíte možnosť User Interface -> Widget Blueprint (názov môže byť napríklad Score).
Vo widgete sa budú nachádzať 2 texty. Jeden s nápisom "Tvoje skóre:" a druhý, ktorý sa bude meniť v závislosti od premennej boxes v objekte ThirdPerson.
Task 6.2
Oba texty presuňte z ľavého panela do časti widgetu. (Takto pridáte texty do widgetu.)
Druhý text, ktorý sa bude meniť dynamicky, je potrebné na-bind-ovať, nakoľko sa jedná o premennú, ktorá sa bude časom meniť.
Task 6.3
Pri hodnote textu v pravej časti kliknite na bind a create binding a následne otvoríme BP a vložte do neho nasledujúcu funkcionalitu:
Comment
Pre pridanie funkcií do blueprintu, kliknite pravým tlačidlom myšky a dajte vyhľadať funkciu podľa názvu. Nakoľko ideme pristupovať k hodnote premennej boxes a tá sa nachádza v objekte ThirdPersonCharacter, je potrebné pre zobrazenie tejto funkcie potiahnúť čiaru od návratovej hodnoty tejto funkcie (za funkciou "cast to ThirdPersonCharacter" potiahnite myšku od "As ThirdPersonCharacter" a napíšte "get boxes")
Task 6.4
Ďalšou úlohou je zabezpečiť, aby sa widget vykresľoval pri každom frame-e. To zabezpečíte tak, že otvoríte blueprint levelu hry. V hornej lište si zvoľte Blueprints a Open Level Blueprint.
Task 6.5
Do tohto blueprintu následne pridajte funkcionalitu, aby sa v každom frame zobrazil tento widget a vykreslil sa do Viewportu.
Comment
Nakoľko sa v tomto widgete nachádzajú aj texty, ktoré sa menia dynamicky počas hrania hry, je potrebné z tohto widgetu vytvoriť premennú a vložiť ju do viewportu. To urobte tak, že potiahnete čiaru z Return Value (funkcia Create Score Widget) a vyberte hneď prvú možnosť pod bielym inputom = "Promote to variable". (Tým sa vám vytvorí funkcia Set)
Task 6.6
Teraz si odskúšajte svoju hru. Pri spustení by sa Vám už malo ukazovať skóre.
Step 7: Pridanie kociek a rátanie skóre
Pre pridanie kocky do herného sveta stačí kocku posunúť z ľavej lišty do hracieho sveta.
Task 7.1
Pridajte 1 kocku na ľubovoľné miesto. Následne pre túto kocku vytvorte BP. V BP kocky vytvorte box collision. Box collision slúži na to, aby sme zistili, kedy sa hráč bude nachádzať blízko kocky.
Comment
Ak pridáte Box Collision automaticky sa vám zmení názov na Box, nie je to chyba. Treba nastaviť collision, aby mal väčšie rozmery ako kocka. Inak nebude možné zodvihnúť kocku.
V BP kocky je potrebné ďalej nastaviť, aby sa pri kolízií kocky a hráča prirátala (pomocou funkcie add) hodnota 1 k premennej boxes (lokálna premenná objektu ThirdPerson). A taktiež, aby sa táto kocka po kolízií vymazala z hracieho plánu
Task 7.2
Pridajte nasledujúcu funkcionalitu do BP kocky.
Task 7.3
Následne môžete do herného sveta pridať niekoľko kociek. Ak ste tieto kroky spravili správne váš hráč by už mal vedieť zdvihnúť kocky a malo by sa mu prirátavať skóre, ktoré sa Vám zobrazí na vašej hracej ploche.
Comment
Kocky môžete duplikovať pomocou klávesových skratiek CTRL+C a CTRL+V (na MAC-u pomocou CMD+C a CMD+V).
Step 8: Ukončenie hry výhrou
Ukončenie hry môže nastať v dvoch prípadoch. V prvom ak hráč úspešne prejde hrou a pozbiera všetky kocky a v druhom prípade ak stúpi na pascu.
Pre vytvorenie výherneho konca hry je potrebné si vytvoriť widget. Ten bude obsahovať text, že hráč vyhral a dve tlačidlá. Jedno bude slúžiť na opakovanie hry a druhé bude slúžiť na ukončenie hry. Môžete sa inšpirovať návrhom:
Task 8.1
Vytvorte widget a vložte do neho text a tlačidlá.
Comment
Text na tlačidlo pridáte tak, že posuniete text z ľavej lišty na už vložené tlačidlo vo widgete. (Malo by sa vám to automaticky zarovnať, pre overenie správnosti si skontrolujte v ľavej časti obrazovky, v hierarchi, aby sa text nachádzal v tlačidlách)
Task 8.2
Ďalším krokom je pridanie funkcionalít tlačidlám v BP tohto widgetu. To vytvoríte tak, že sa preklikneme do graph (pravý horný roh obrazovky, tým sa dostanete do BP). V ľavej lište sa nachádzajú premenné tlačidiel, kliknite na jendu z nich a pod ňou sa zobrazí lišta s detailami o tlačidle. Pridajte Event na On Click a zopakujete to aj pre druhé tlačidlo.
Pri tlačidle quit sa zavolá funkcia "Quit Game" a pri opakovaní hry sa zavolá funkcia "Open level" a otvorí sa level, ktorý hráč práve hral. Zároveň je potrebné nastaviť, aby zmizol kurzor z obrazovky pri opakovaní hry. To zabezpečuje funkcia "set show mouse cursor".
Task 8.3
Pridajte jednotlivé funkcionality do funkcií. Nezabudnite že kurzor pri otvorení nového levelu musí mať hodnotu false. Nakoľko sa funkcia "Set show mouse cursor" viaže k objektu "player controller", je potrebné ťahať čiaru z návrtovej hodnoty tohto objektu a tak vyhľadať funkciu show mouse cursor.
Posledným krokom je zabezpečiť, aby sa hra ukončila, ak hráč pozbiera všetky kocky. Keďže hra sa ukončí pri zbieraní kociek, otvorte si BP kociek a doplnte, že ak hráč nazbieral už všetky kocky (v tomto prípade 4), vykreslí sa widget "Win".
Nakoľko sa na tomto widgete nachádzajú tlačidlá, je potrebné, aby sa zobrazil aj kurzor myšky (pomocou funkcie set show mouse cursor a hodnota bude true). Ďalej je potrebné hru zastaviť. Ak by táto funkcionalita chýbala, hráč by ešte vedel skočiť na pascu.
Task 8.4
Pridajte do BP kocky, za funkcie set a destroy actor nasledujúce funkcie.
Comment
Funkcia pre porovnanie dvoch čísel je equal, berte do úvahy, že porovnávate 2 integre. Pri porovnaní zmeňte hodnotu 4 na počet kociek, ktoré máte v hracom pláne
Task 8.5
Otestjte si svoju hru. Po správnej implementácií, by ste už mali vedieť hru vyhrať.
Step 9: Ukončenie hry prehrou
Vytváranie scenára prehry bude fungovať podobne ako pri scenári výhra. Prvým krokom je vytvorenie widgetu, ktorý bude obsahovať text, že hráč hru prehral a dve tlačidlá. Jedno na opakovanie hry a druhé na ukončenie hry. Funkcionalita jednotlivých tlačidiel je rovnaká ako pri widgete výhry.
Task 9.1
Vytvorte daný widget a tlačidlám priraďte funkcionalitu ako pri widgete výhry.
Task 9.2
Ďalším krokom je vytvorenie pascí. Pridajte do hracieho poľa kužele a na ne vytvorte capsule collision (rovnako ako kocky a box collision).
Posledným krokom je pridanie funkcionality pasce. Teda, ak sa hráč dotkne takejto pasce, vykreslí sa widget "Lose", nastavenie aby sa zobrazil kurzor myšky, zastavenie hry a zničenie pasce, aby sa už nevykreslila v scéne.
Comment
Tu môžete pokojne nechať pascu vykreslenú, ak chcete.
Task 9.3
Do BP pasce pridajte nasledujúce funkcie.
Task 9.4
Otestujte svoju hru. Momentálne by už hra mala byť plne hrateľná a mali by ste hru vedieť aj vyhrať aj prehrať.
Additional Tasks
Ako doplňujúcu úlohy si skúste vytvoriť nový level hry, ktorý bude spĺňať nasledujúce požiadavky:
- Nový level bude dostupný, ak úspešne prejdete prvý level hry. (Nový level vytvoríte kliknutím pravého tlačidla myšky v Content Browser na mieste kde chcete mať nový level uložený.)
- Pridajte do neho aspoň 2 nové assety
- Okrem zbierania kociek bude potrebné zbierať aj guličky, obe sa majú zbierať samostatne a hru vyhrá hráč, ak pozbiera aj všetky guličky aj všetky kocky (počet guličiek a kociek si určite podľa vlastného uváženia)
- Pridajte viacero pascí
- Vyberte si jednu z doplňujúcich úloh, ktorú sme nepreberali:
- Pridanie farebného osvetlenia
- Pridanie materiálov pre ľubovoľné typy objektov v hre (kocky, guličky, pasce)
- Pridanie zvukovej stopy
- Vytvorenie nového herného hrdinu