Tworzenie HUD-u
Heads-Up Display (HUD) to interfejs wyświetlający poziom zdrowia gracza, liczbę punktów i inne informacje. Zróbmy prosty HUD używając obiektu tekstowego.
HUD zawsze pozostaje na tym samym miejscu na ekranie. Mając elementy interfejsu nie chcemy aby poruszały się one gdy porusza się gracz - powinny one pozostawać na ekranie. Domyślnie warstwy się przewijają. Aby pozostawały na ekranie, możemy wykorzystać parametr Parallax (Paralaksa) warstw. Paralaksa sprawia, że poszczególne warstwy przewijają się w różnym stopniu, tworząc pozorny efekt głębi. Gdy ustawimy paralaksę na zero, warstwa nie będzie przewijać się w ogóle - świetnie się to sprawdzi dla HUD-u.
Przejdź do paska warstw. Dodaj warstwę o nazwie HUD. Upewnij się, że znajduje się ona na górze i jest zaznaczona (czyli jest warstwą aktywną). Pasek właściwości powinien wyświetlać teraz jej parametry. Ustaw parametr Parallax na 0, 0 (zero na osiach X i Y).
Kliknij dwukrotnie wolne miejsce na planie aby dodać nowy obiekt. Tym razem wybierz Text (tekst). Ustaw go w górnym lewym rogu planu. Czarny tekst będzie mało widoczny, więc używając paska właściwości ustaw pogrubienie, kursywę, żółty kolor i odrobinę większy rozmiar czcionki. Powiększ obiekt tekstowy aby zmieściła się w nim porządna ilość tekstu. Powinno to wyglądać mniej więcej tak:
Przejdź do arkusza zdarzeń. Sprawmy aby w tekście był wyświetlany wynik gracza. Do dodanego wcześniej zdarzenia Every tick dodaj akcję Text -> Set text (Ustaw tekst).
Używając operatora & możemy przekształcić liczbę na tekst i dołączyć ją do ciągu tekstowego. Wpisz więc dla tekstu:
"Wynik: " & Wynik
Pierwsza część ("Wynik: ") sprawia, że tekst będzie zaczynał się od frazy Wynik:. Druga część (Wynik) to właściwa wartość zmiennej globalnej "Wynik". Operator & łączy obie części.
Uruchom grę i zastrzel kilka potworów. Na ekranie widać Twój wynik, który pozostaje w tym samym miejscu na ekranie!
Końcowe szczegóły
Już prawie skończyliśmy. Dodajmy jeszcze parę drobiazgów na koniec.
Najpierw sprawmy aby pojawiały się nowe potwory. W przeciwnym razie po zabiciu wszystkich potworów gracz nie będzie miał co robić. Będziemy dodawać potwora co 3 sekundy. Dodaj nowe zdarzenie:
Warunek: System -> Every X seconds (Co X sekund) -> 3
Akcja: System -> Create object (Stwórz obiekt) -> Potwór, warstwa 1, 1400 (pole X), random(1024) (pole Y)
1400 to współrzędna X zaraz za prawą krawędzią planu, a random(1024) to losowa współrzędna Y równa wysokości planu.
Na koniec sprawmy aby potwory zabijały postać gracza.
Warunek: Potwór -> On collision with another object -> Gracz
Akcja: Gracz -> Destroy
Podsumowanie
Gratulacje, stworzyłeś swoją pierwszą grę HTML5 w Construct 2! Jeśli masz własny serwer i chcesz pokazać swoje dzieło innym, kliknij Export (Eksportuj) w menu File. Construct 2 zapisze wszystkie pliki w folderze na Twoim komputerze, a Ty będziesz mógł je umieścić w Internecie. Jeśli nie masz własnego serwera, możesz udostępnić swoje gry używając serwisu Dropbox.
Nauczyłeś się ważnych podstaw Construct 2: wstawiania obiektów, korzystania z warstw, zachowań, zdarzeń i nie tylko. Mamy nadzieję, że dzięki temu będziesz w stanie poznać Construct 2 dokładniej! Spróbuj zbadać program i zobaczyć co ma Ci do zaoferowania.
Skończony projekt
Spróbuj ściągnąć gotowy projekt tego samouczka. Dodałem w nim dodatkowe elementy takie jak napis "Game over" i potwory, które z czasem poruszają się coraz szybciej. Ze swoją nowo nabytą wiedzą nie powinieneś mieć problemów z domyśleniem się jak to wszystko działa. Projekt zawiera też komentarze wyjaśniające.
Dobra robota! Jeśli masz jakieś problemy lub uważasz, że coś w tym samouczku można by ulepszyć, zostaw komentarz lub napisz na forum. Zobaczymy co da się zrobić!
Jeśli spodobał Ci się ten samouczek i znasz kogoś komu spodobałby się Construct 2, może wyślesz mu link do tego samouczka? Spróbować nie zaszkodzi. :)
Dowiedz się więcej
Chcesz dodać muzykę lub efekty dźwiękowe? Sprawdź sekcję Dźwięk i Muzyka w podręczniku.
Być może zainteresuje Cię inny samouczek dla początkujących: Jak stworzyć grę platformową.
Jeśli chcesz dowiedzieć się bardziej szczegółowo jak działają zdarzenia w Construct 2, sprawdź sekcję Jak Działają Zdarzenia w podręczniku. Gorąco do tego zachęcamy abyś mógł szybko przejść do tworzenia własnych projektów! Jeśli potrzebujesz jeszcze więcej informacji, pamiętaj, że nasz podręcznik zawiera pełną dokumentację.