Wie implementiere ich Parallaxen-Scrollen in 2D?


Antworten:


20

Teilen Sie die Position jeder Ebene durch den „Abstand“, den Sie von der Kamera haben möchten.

Beispiel: Erstellen Sie einige Variablen zur Darstellung der Kameraposition cameraXund cameraY. Stellen Sie diese so ein, dass sie der Position Ihres Charakters entsprechen, und erhöhen Sie möglicherweise die Bewegungsrichtung.

Die Hauptschicht würde nur bei positioniert werden

mainLayer.x = -cameraX;

die mittlere schicht bei sowas

middleLayer.x = -cameraX * 0.5;

und die ferne Schicht bei

farLayer.x = -cameraX * 0.2;

Ändern Sie die Konstanten nach Bedarf.


3
Was Iain gesagt hat, plus ich nehme den "Parallaxenfaktor" (1, 0,5 und 0,2 in Iains Code) und mache ihn zu einem Parameter, der meine Ebenen beschreibt. Auf diese Weise kann ich die Subtilität der Parallaxe anpassen (oder zur Laufzeit).
Troy Gilbert

6

Grundsätzlich möchten Sie, dass sich Objekte umso schneller bewegen, je näher sie an der „Kamera“ sind. Wie Sie das umsetzen, liegt ganz bei Ihnen.

Ich ordne jeder meiner Ebenen eine Tiefe zu und teile diese beim Scrollen für jede Ebene durch die Tiefe der Ebene, sodass sich weiter entfernte Ebenen langsamer bewegen.


5

Eine Ebene, die "weiter hinten" ist, müsste mit einem Bruchteil der Geschwindigkeit der Vordergrundebene scrollen. Die Hälfte der Geschwindigkeit bedeutet die doppelte Entfernung. Andere Effekte wie das Abtönen zur Simulation von Nebel usw. könnten ebenfalls zur Illusion beitragen.


1

Am besten rendern Sie Sprites einfach als Quads mit Werbeplakaten in 3D. Das "Gameplay" kann in einer Ebene stattfinden, während der Hintergrund und der Vordergrund im 3D-Raum näher oder weiter positioniert werden können. Auf diese Weise wird der Parallaxeneffekt für Sie erledigt, ohne dass Sie eine spezielle Codierung vornehmen müssen :-)


3
Wenn Sie dies tun, müssen Sie entweder Ihre entfernten Quads vergrößern, um die Entfernungsskalierung zu kompensieren, oder Sie müssen eine Projektionsmatrix einrichten, die keine Perspektive anwendet. Es ist vielleicht einfacher, die Quads selbst zu übersetzen.
Munificent

0

Lassen Sie die untere Ebene scrollen, indem Sie von ihrer Position abziehen, zeichnen Sie die mittlere Ebene wie gewohnt und lassen Sie die obere Ebene mit der Geschwindigkeit scrollen, mit der die untere Ebene durch zwei geteilt wird.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.