Animacja 2D z flipbook

Flipbook to funkcja Paper 2D używana do tworzenia animacji 2D za pomocą Sprites. W tym artykule zobaczymy, jak używać kineografów do animowania wojownika.

Skorzystajmy z poniższego obrazka, który przedstawia Sprites wojownika wykonującego różne ruchy. 

Utwórz nowy pusty projekt bez korzystania z zawartości startowej i utwórz nowy pusty poziom. W Wyszukiwarce bibliotek utwórz folder o nazwie „FighterSprites” i zaimportuj powyższy obraz do tego folderu. Zmień nazwę tekstury na „Fighter”. Kliknij teksturę prawym przyciskiem myszy i wybierz „Działania Sprite -> Zastosuj ustawienia tekstury Paper2D”. Zapisz teksturę.

Wybierz opcję „Działania Sprite -> Wyodrębnij Sprite”:

W “Trybie wyodrębniania sprite’a” wybierz “Grid” i wpisz rozmiar sprite’ów  104×124:

Teraz stwórzmy kineografy z animacjami wojownika. Wybierz sprite’y o indeksach od 0 do 5 (Fighter_Sprite_0 do Fighter_Sprite_5). Kliknij prawym przyciskiem i wybierz „Create Flipbook”:

Zmień nazwę utworzonego kineografu na „IdleAnim”. To jest animacja, której użyje wojownik, gdy się nie porusza. Kliknij dwukrotnie flipbook, aby otworzyć edytor:

We właściwości „Klatki na sekundę” ustaw wartość 10. Należy to zrobić dla wszystkich kineografów, które utworzymy w tym artykule.
Musisz dokonać pewnych zmian w sekwencji sprite’ów „IdleAnim”. Animacja używa sprite’ów w tej kolejności {0,1,2,3,4,5,4,3,2,1}. Musimy więc zduplikować sprite’y od 1 do 4 i umieścić je w odwrotnej kolejności na końcu animacji. Aby powielić, kliknij prawym przyciskiem myszy na ikonie animacji i wybierz „Duplikuj”:

Następnie po prostu kliknij i przeciągnij duszki do właściwej pozycji. „IdleAnim” wygląda następująco:

W Wyszukiwarce bibliotek wybierz sprite’y z indeksami od 6 do 21 i utwórz flipbook o nazwie „WalkAnim”. Zmień opcję „Klatki na sekundę” na 10.

Wybierz sprite’y 34, 35 i 36 i utwórz flipbook „PunchAnim”. Sekwencja „PunchAnim” to {34,35,36,36,35,34}. Zwróć uwagę, że duszek 36 zajmuje dwie klatki animacji. Edytor kineografu pozwala zdefiniować, ile klatek animacji zajmuje duszek:

Flipbook „KickAnim” jest podobny do „PunchAnim”. Używa sprite’ów 37, 38 i 39, a sekwencja animacji to {37,38,39,39,39,37}. Teraz stwórzmy schemat wojownika. Będzie to typ „PaperCharacter”:

Wpisz nazwę „FighterCharacter” dla tego nowego schematu i otwórz edytor planów. „PaperCharacter” zawiera element flipbook o nazwie „Sprite”. Wybierz go i wybierz „IdleAnim” jako „Source Flipbook”:

Utwórz następujące zmienne logiczne:

Aby kontrolować zawodnika, będziemy używać prawej i lewej strzałki do poruszania się, lewego Shifta do uderzania i lewej Control do kopania. Poniższy obraz przedstawia zdarzenia wejściowe:

Animacje, których będziemy używać, mają różne cechy. Jeden będzie działał w odwrotnej kolejności, a niektóre pozostaną w pętli. Aby uprościć, utwórz makro o nazwie „ Play2DAnimation ” i ustaw następujące parametry:

W „Flipbook Komponent”  parametr  jest „Paper Flipbook Komponent”. Parametr „Animation” to „Paper Flipbook”.

Makro ma następujące akcje:

Akcje wojownika są obsługiwane podczas wydarzenia „Tick”. Jeśli wojownik atakuje, żadne nowe polecenie nie zostanie wykonane, dopóki animacja ataku się nie zakończy. Poniższe obrazy przedstawiają działania zdarzenia „Tick”.

 Blueprint „Fighter” można zdefiniować jako „Default Pawn” w „GameMode”. Jeśli to zrobisz, nie zapomnij umieścić „PlayerStart” na poziomie, aby wskazać, gdzie gracz zacznie.

„PaperCharacter” jest już skonfigurowany do automatycznego wykorzystywania grawitacji. Jeśli nie chcesz używać grawitacji, po prostu ustaw wartość „0.0” we właściwości „Skala grawitacji” komponentu „Ruch postaci”:


Źródło:https://romeroblueprints.blogspot.com/2015/07/2d-animation-with-flipbooks.html