시차 스크롤을 2D로 구현하려면 어떻게해야합니까?

21

전경, 중간 지상 및 배경의 세 가지 레이어가 있다고 가정합니다. 시차 스크롤 을 만들기 위해이 세 가지 레이어를 사용하는 것과 관련이있는 것은 무엇입니까 ?

2d parallax-scrolling

20

각 레이어의 위치를 카메라에서 원하는 "거리"로 나눕니다.

예를 들어 카메라 위치를 나타내는 변수의 몇 가지를 작성 cameraX하고 cameraY. 캐릭터의 위치와 동일하게 설정하여 이동 방향에 약간의 추가 효과를 줄 수 있습니다.

메인 레이어는

mainLayer.x = -cameraX;

같은 중간 층

middleLayer.x = -cameraX * 0.5;

그리고 먼 층에

farLayer.x = -cameraX * 0.2;

필요에 따라 상수를 변경하십시오.

— 이아 인
소스

3

Iain이 말한 것 외에도 "Parallax factor"(Iain 코드에서 1, 0.5 및 0.2)를 사용하여 시차의 미묘함을 조정하거나 런타임에 내 계층을 설명하는 매개 변수로 만듭니다.

— 트로이 길버트

6

기본적으로 물체가 '카메라'에 가까워 질수록 물체가 더 빨리 움직이기를 원합니다. 당신이 그것을 구현하는 방법은 당신에게 달려 있습니다.

각 레이어에 깊이를 지정한 다음 장면을 스크롤 할 때 각 레이어에 대해 스크롤을 레이어의 깊이로 나눠서 멀리 떨어진 레이어가 느리게 이동합니다.

— 케빈 라 이티
소스

5

"뒤로"있는 레이어는 전경 레이어 속도의 일부로 스크롤해야합니다. 속도의 절반은 두 배의 거리를 의미합니다. 안개 등을 시뮬레이션하기위한 색조와 같은 다른 효과도 환상에 추가 될 수 있습니다.

— 카란 차
소스

1

가장 좋은 방법은 스프라이트를 빌보드 쿼드로 3D로 렌더링하는 것입니다. "게임 플레이"는 한 평면에서 모두 발생할 수 있지만 배경과 전경은 3D 공간에서 더 가까이 또는 더 멀리 배치 될 수 있습니다. 그렇게하면 특별한 코딩을 할 필요없이 시차 효과가 처리됩니다.

— 조엘 마르티네즈
소스

3

그렇게하면, 거리 스케일링을 보상하기 위해 먼 쿼드를 스케일 업하거나 원근법을 적용하지 않는 프로젝션 매트릭스를 설정해야합니다. 쿼드를 직접 번역하는 것이 더 쉬울 수 있습니다.

— munificent

0

해당 위치에서 빼서 아래쪽 레이어를 스크롤하고 중간 레이어를 정상적으로 그린 다음 아래쪽 레이어의 속도를 2로 나누어 스크롤합니다.

— 샘
소스