Jak zaimplementować przewijanie paralaksy w 2D?

21

Załóżmy, że mam trzy warstwy: pierwszy plan, pośrednią ziemię i tło. Na czym polega użycie tych trzech warstw do tworzenia przewijania paralaksy ?

Bryan Denny
źródło

Odpowiedzi:

20

Podziel pozycję każdej warstwy przez „odległość”, jaką chcesz ustawić od kamery.

Na przykład: Utwórz kilka zmiennych reprezentujących pozycję kamery, cameraXi cameraY. Ustaw je tak, aby równały się z twoją postacią, prawdopodobnie dodając nieco więcej w kierunku ruchu.

Główna warstwa byłaby po prostu ustawiona

mainLayer.x = -cameraX;

środkowa warstwa przy czymś takim

middleLayer.x = -cameraX * 0.5;

i daleka warstwa przy

farLayer.x = -cameraX * 0.2;

Zmień stałe w razie potrzeby.

Iain
źródło
3
To, co powiedział Iain, a także biorę „współczynnik paralaksy” (1, 0,5 i 0,2 w kodzie Iaina) i ustawiam go jako parametr opisujący moje warstwy, w ten sposób mogę dostosować subtelność paralaksy (lub w czasie wykonywania).
Troy Gilbert
6

Zasadniczo chcesz, aby obiekty poruszały się szybciej, im bliżej „kamery”. To, jak wdrożysz, zależy od Ciebie.

Każdej z warstw przypisuję głębokość, a następnie, gdy przewijam scenę, dla każdej warstwy dzielę przewijanie przez głębokość warstwy, aby warstwy znajdujące się dalej oddalały się wolniej.

Kevin Laity
źródło
5

Warstwa „cofająca się” musiałaby przewijać się o ułamek prędkości warstwy pierwszego planu. Połowa prędkości oznacza dwukrotność odległości. Inne efekty, takie jak przyciemnianie w celu symulacji mgły itp., Również mogą zwiększyć iluzję.

Karantza
źródło
1

Najlepszym sposobem na to jest po prostu renderowanie duszków jako billboardowych quadów w 3D. „Rozgrywka” może odbywać się na jednej płaszczyźnie, podczas gdy tło i pierwszy plan mogą być umieszczone bliżej lub dalej w przestrzeni 3D. W ten sposób efekt paralaksy jest obsługiwany bez konieczności specjalnego kodowania :-)

Joel Martinez
źródło
3
Jeśli to zrobisz, musisz albo przeskalować odległe kwadraty, aby skompensować skalowanie odległości, lub skonfigurować macierz projekcji, która nie stosuje żadnej perspektywy. Łatwiej może być samodzielnie przetłumaczyć quady.
hojny
0

Przewiń dolną warstwę, odejmując od jej położenia, narysuj środkową warstwę jak zwykle, a górną warstwę przewiń z prędkością dolnej warstwy podzieloną przez dwa.

Sam
źródło