Comment implémenter le défilement de parallaxe en 2D?

21

Supposons que j'ai trois couches: un premier plan, un sol intermédiaire et un arrière-plan. En quoi consiste l'utilisation de ces trois couches pour créer un défilement de parallaxe ?

2d parallax-scrolling Bryan Denny
la source

Réponses:

20

Divisez la position de chaque couche par la «distance» que vous souhaitez qu'elle ait de la caméra.

Par exemple: créez quelques variables pour représenter la position de la caméra, cameraXet cameraY. Réglez-les pour égaler la position de votre personnage, en ajoutant éventuellement un peu plus dans le sens du mouvement.

La couche principale serait juste positionnée à

mainLayer.x = -cameraX;

la couche intermédiaire à quelque chose comme

middleLayer.x = -cameraX * 0.5;

et la couche éloignée à

farLayer.x = -cameraX * 0.2;

Modifiez les constantes selon vos besoins.

Iain
la source
3
Ce que Iain a dit, plus je prends le "facteur de parallaxe" (1, 0,5 et 0,2 dans le code de Iain) et en fais un paramètre décrivant mes couches, de cette façon je peux ajuster la subtilité de parallaxe (ou à l'exécution).
Troy Gilbert
6

Fondamentalement, vous voulez que les objets se déplacent plus rapidement, plus ils sont proches de la «caméra». La façon dont vous implémentez cela dépend de vous.

J'attribue une profondeur à chacun de mes calques, puis en faisant défiler la scène, pour chaque calque, je divise ce défilement par la profondeur du calque, de sorte que les calques les plus éloignés se déplacent plus lentement.

Kevin Laity
la source
5

Un calque qui est "plus en arrière" devrait défiler à une fraction de la vitesse du calque de premier plan. La moitié de la vitesse implique le double de la distance. D'autres effets comme la teinture pour simuler le brouillard, etc., pourraient également ajouter à l'illusion.

Karantza
la source
1

La meilleure façon de le faire est de simplement rendre les sprites sous forme de quadrillages d'affichage en 3D. Le "gameplay" peut se produire sur un seul plan, tandis que l'arrière-plan et le premier plan peuvent être positionnés plus près ou plus loin dans l'espace 3D. De cette façon, l'effet de parallaxe est géré pour vous sans que vous ayez à faire de codage spécial :-)

Joel Martinez
la source
3
Si vous faites cela, vous devez soit mettre à l'échelle vos quads distants pour compenser la mise à l'échelle de la distance, soit configurer une matrice de projection qui n'applique aucune perspective. Il peut être plus simple de traduire vous-même les quads.
munificent
0

Faites défiler le calque inférieur en soustrayant de sa position, dessinez le calque moyen comme d'habitude et faites défiler le calque supérieur à la vitesse du calque inférieur divisé par deux.

Sam
la source