게임 제작/주저리

간단한 포물선 운동을 적용해보자..두번째

Mercuders Master 2021. 8. 24. 22:36
반응형

저번 포스팅에 이어 이번엔 코드를 보면서 설명하겠습니다.(https://mercuders.tistory.com/16)

		void update(float delta)
		{
			if (!bArrowShooting) return;

			Vec2 pos = this->getPosition();

			float offset = 40;
			angle = angle + (offset * delta); // angle은 0부터 시작 
			float radian = (angle*M_PI) / 180;
			float radian2 = ((angle + 0)*M_PI) / 180;

			float fHeight = sin(radian);
			float fDistance = cos(radian2);

			pos = pos + Vec2(fDistance * 15, -fHeight * 10);
			this->setPosition(pos);
		}


일단 틱당으로 들어오는 함수가 필요합니다. 여기서 틱당으로 들어오는 함수란 위에 보이는 update() 함수로 계속해서 이벤트가 프레임 단위로 호출이 되는 것을 말하며 쉽게 fps 60이면 초당 60번 그려준다는 듯인데 fps와 같은 개념이라고 생각하시면 될 것 같습니다.

 

float delta는 첫 번째로 이 함수를 호출하고 난 다음 두 번째 호출되기까지의 시간의 단위입니다. 예를 들어 update() 함수로 첫 번째 호출이 들어오고 그다음 두 번째 호출이 1초 뒤에 들어온다면 delta 값은 1.0f 이 될 것입니다. 제 PC에서 delta의 값이 0.016666으로 0.016666초당 계속 이 함수가 호출된다고 보시면 되겠습니다.(PC 마다 다를 수 있습니다.)

미사일의 초기 위치 그리고 곡선운동

그다음은 캐릭터의 위치입니다. 현재 Cocos2 d-x를 사용하고 있기 때문에 5번째 줄에 getPostion()을 통해 위치를 가져옵니다. 그리고 7~10 번째 줄을 통해 sin과 cos에 값을 넘겨주고 있는데 offset 값을 통해 얼마나 멀리 갈지를 이 값을 통해 정합니다.

angle = angle + (offset * delta);

8번째줄이 중요하다고 할 수 있는데요 계속 delta 값을 offset 값에 곱하여 angle이라는 변수에 더해주고 있습니다. 여기서 angle 값은 미사일이 캐릭터의 위치에서 화면 밖으로 넘어갈 때까지 계속 증가하며 화면밖에 나가게 되면 0으로 다시 초기화를 해줍니다. 로그를 찍어보면 angle 값은 0에서 200까지 값이 1~3초 안에 상승하는 것을 볼 수 있습니다.

이렇게 angle 값이 틱당 들어오는 delta 값에 의에 각도의 값이 0 ~ 200 까지 오르고 있습니다(여기서 0~200까지 값은 angle 값을 초기화하기 전까지 200보다 더 높아질 수 있습니다). 이것을 sin과 cos에 넣어주기 위해 라디안 값으로 바꿔서 넣어줍니다.

float radian = (angle*M_PI) / 180;
float radian2 = ((angle + 0)*M_PI) / 180;

라디안 값으로 변경해주는 이유는 sin, cos 의 인자 값이 라디안으로 받고 있기 때문이고 위의 angle의 0 ~ 200도에 대한 라디안 값을 구하는 식은 위와 같습니다.

float fHeight = sin(radian);
float fDistance = cos(radian2);

12번째 줄에서 저렇게 바꾼 float 값을 sin과 cos에 차례대로 넣어줍니다.

sin 그래프와 cos 그래프

이렇게 하여 angle 값이 0도에서 200도까지(약 180도라고 생각하자) 계속해서 sin cos 함수를 거쳐서
sin의 리턴값은 0 에서 시작하여 1 까지 오르고 다시 1 에서 0 으로 돌아오고
cos의 리터값은 1 에서 시작하여 0 으로갔다가 -1 까지 값이 변경된다.

pos = pos + Vec2(fDistance * 15, -fHeight * 10);

이런 sin cos 성질을 이용하여 높이(y좌표) 값은 sin, 거리(x좌표) 값은 cos으로 시작하여 계속해서 위치 값에 더 해준다.
(여기서 위치값은 발사체의 위치이다.)

sin 값을 이용한 발사체의 높이(Y) 값 변화

위 그림은 Height의 값과 실제 발사체 위치에 적용한 -fHeight * 10의 값과 발사체의 높이 값(pos.y)의 변화를 시간에 흐름에 따라 보여주고 있는 로그 값들이다. 실제로 적용시켰을 때 angle은 0에서 200까지 변화를 보였고 그에 따라서 sin 함수에 넣어 0 에서 0.98 까지 올랐다가 다시 0.0으로 내려가고 그 이하로 내려가는 모습을 보여주고 있다.
이는 위 sin 그래프를 통하여 값이 나온 결과를 의미하며 이 값을 통해 초기 높이 약 480 에서 279 까지 발사체의 높이(y) 값이 완만하게 바뀌는것을 확인할 수 있다.(여기서 10을 곱해준 이유는 게임상의 높이에 대해 대략적인 값을 넣어주었다. 다른 해상도에서는 해상도에 따라 오프셋 값을 정하여 넣어주어야 할 것이다)

cos 값을 이용한 발사체 거리(X) 값 변화

위 그림은 cos 그래프에 의한 실제 발사체의 변화를 시간에 흐름에 따라 보여준 것이다. sin과 마찬가지로 angle 값이
0 에서 200 까지 값이 변화하면서 1에서 -1까지의 값이 발사체의 거리(x) 값을 어떻게 변형시켜주는지 보여주고 있다.

이 코드는 sin cos을 이용한 간단한 포물선 운동을 구현한 것이고 위의 코드와 로그 값들을 sin cos 그래프와 천천히 살펴보다 보면 충분히 이해가 갈 것이라고 생각된다. 그럼 오늘도 좋은 하루 보내시길 바란다 :)

반응형