14.07.2026 11:15

Moonlight Animate — wizualny edytor scen gry: drzewo, inspektor, paleta

⏱️ 4 min czytania
Udostępnij:

Silnik gier 2D wbudowany w Moonlight Animate dorobił się wizualnego edytora scen. Do tej pory scenę gry składało się z gotowego szablonu i uruchamiało w podglądzie „Play", a jakiekolwiek zmiany w strukturze wymagały ręcznej edycji plików sceny. Od teraz jest inaczej: obok okna Play mamy panel, w którym widać żywe drzewo sceny i można je edytować na bieżąco — dodać węzeł, ustawić jego właściwości, poukładać hierarchię i zapisać. To pierwsza pełna, wizualna pętla składania sceny.

Żywe drzewo z przeciąganiem

Panel pokazuje całą scenę jako drzewo węzłów odświeżane w czasie rzeczywistym. Węzły przeciąga się myszą, żeby zmienić rodzica — upuszczenie na inny węzeł czyni go dzieckiem, upuszczenie pomiędzy wstawia jako rodzeństwo we wskazanym miejscu. Domyślnie węzeł zostaje dokładnie tam, gdzie był na ekranie (zmieniamy tylko, komu podlega, nie gdzie leży); z wciśniętym Shiftem — zachowuje pozycję lokalną i „jedzie" razem z nowym rodzicem. Próba przeniesienia węzła w jego własne poddrzewo jest odrzucana, więc nie da się rozspójnić sceny.

Pod maską siedzi mały, dokładnie przetestowany kawałek matematyki: żeby węzeł nie drgnął na ekranie po zmianie rodzica, silnik liczy odwrotność złożenia transformacji i podmienia transformację lokalną w momencie, gdy węzeł jest odpięty od drzewa — dzięki temu działa to poprawnie również dla węzłów z fizyką (które budują swoje ciało w chwili wpięcia do sceny).

Edytowalny inspektor właściwości

Zaznaczenie węzła buduje property-grid — siatkę kontrolek dobranych do typu każdego pola. Nazwa i teksty dostają pole tekstowe, liczby całkowite i zmiennoprzecinkowe swoje pola liczbowe (pozycja i skala jako para x/y, rotacja w radianach), a przełączniki — pola typu tak/nie (np. widoczność). Każda zmiana kontrolki zapisuje się wprost do węzła na żywo — efekt widać natychmiast w oknie Play. Węzły ruchu po siatce pokazują dodatkowo swoje pola (prędkość, ruch po skosie, inteligentne wyznaczanie trasy), a węzły graficzne swój indeks warstwy.

Zadbaliśmy o rzecz, która potrafi być irytująca w edytorach: odświeżanie nie kradnie tego, co właśnie wpisujesz. Podgląd żyje kilka razy na sekundę, ale pole, w którym trzymasz kursor, jest nietykalne do momentu zatwierdzenia — możesz spokojnie wpisać wartość do końca. Pod gridem został podgląd „tablicy" węzła (dowolne właściwości ustawione przez skrypt) oraz informacja o dołączonym skrypcie.

Paleta węzłów i zapis

Pod drzewem jest paleta wszystkich typów węzłów — dwuklik dodaje wybrany typ pod aktualnie zaznaczony węzeł (albo pod korzeń sceny). To najszybsza droga do rozbudowy sceny; dochodzą do tego akcje z menu kontekstowego (dodaj / zmień nazwę / usuń) i pasek narzędzi z pauzą logiki gry.

Całość spina przycisk „Zapisz scenę", który zrzuca bieżący stan drzewa z powrotem do pliku sceny projektu. Nad przyciskiem czuwa znacznik „niezapisanych zmian" (gwiazdka), który znika po zapisie albo po ponownym starcie podglądu. Zalecany rytm pracy to: uruchom podgląd, zatrzymaj logikę pauzą, poskładaj scenę „na stole", zapisz — i gotowa scena wstaje przy następnym uruchomieniu z naniesionymi zmianami.

Co dalej

Fundament wizualnego edytora stoi: drzewo + inspektor + paleta to komplet, który pozwala zbudować i zapisać scenę bez dotykania plików. W kolejnych krokach dojdzie malowanie map kafelkowych bezpośrednio na kanwie oraz rozstawianie obiektów kliknięciem w scenę — czyli pełny warsztat układania świata gry.

📚 Powiązane posty

14.07.2026 22:19

Silnik gier: od szablonu do grywalnej gry RPG top-down

Startowy szablon silnika gier to teraz kompletny, grywalny wycinek gry RPG top-down: chodzenie po siatce, rozmowy z postaciami, przeciwnik goniący gdy...
Czytaj dalej →
14.07.2026 19:16

Moonlight Animate — system dialogów w grach

Silnik gier 2D w Moonlight Animate ma teraz kompletny system dialogów: kwestie z efektem maszyny do pisania, wybory z warunkami, zmienne fabularne i g...
Czytaj dalej →
14.07.2026 18:40

Moonlight Animate: ruchoma panorama dźwięku także w wyeksportowanym wideo

Dźwięk przejeżdżający z lewego do prawego głośnika brzmiał dobrze w podglądzie, ale eksport przez serwer zamrażał go w miejscu. Ostatnia luka parytetu...
Czytaj dalej →

📧 Bądź na bieżąco!

Zapisz się na listę oczekujących, aby otrzymywać powiadomienia o nowych postach na Dev Blog oraz informacje o starcie platformy Moonlight.