C언어따위 모르는 지에고의 XNA 스튜디오 배우기 #4

자 4번째 시간입니다. -_-ㅋ
이제 슬슬 XNA스튜디오의 모습이 익숙해져가고 있습니다 하하하..

이번시간에는 이미지를 이동시키는 법을 배워보겠습니다.

2D 비행기게임같은경우 위에서 아래로 맵을 이동시켜야겠쬬?
이미지를 계속 아래로 내려주면서 이동하는 느낌을 주도록 합시다.

준비사항은 XNA스튜디오 출력화면이 800X600 이니까 이사이즈의 그림파일을 하나 추가시켜줍시다.

1이라는 그림파일을 하나 추가시켰습니다.
컨텐츠에 그림파일 불러오는건 다들 +_+알죠?

알거라 믿습니다. + _ +ㅋ








우리가 해야할 일은 Y자표의 이동으로 이미지를 아래로 움직이게 하는 것입니다.
그러기 위해선 좌표값을 저장할 공간이 필요합니다.

저기 보시면 그냥 단순히 숫자(좌표값)을 저장하기 위한 공간을 마련했습니다.
private int imy;//저장공간마련
imy <라는 저장공간을 마련했습니다.

아 그리고 yong 이미지를 저장할공간안에 컨텐츠로드에가서 이미지 불러오는거 까먹지 마시구요~

앞시간에
이미지띄우
기에서 했던
사항입니다.^^



자 이제 이미지를 아래로 내리려고하면 Y값을 계속 변화를 줘야 하겠습니다.

Update 부분으로 가서 Y값에 변화를 줘봅시다.
imy += 10
imy라는 저장공간에 10씩 계속 더해줘라를 적었습니다.
if (imy >= 600)
 imy = 0;
if구문인데요 간단하게 만얀 무엇이라면 아래 문장을 실행하라라는 뜻입니다.
이미지가 아래로 계속 이동하다가 화면 끝에까지 이동하면 다시 맨위로 올라와라라는 뜻으로
600이상이되면 0으로 초기화 하도록 구문을 적었습니다.

Y좌표를 설정했습니다.

깔끔하게 출력해보도록합시다. 끌어내기 + _+ Draw로 가봅시다.

spriteBatch.Draw(이미지가저장된곳,화면상이미지가 출력될 위치,그림파일자체크기설정,Color.White);
Draw의 간단한 문법설명입니다. 우리 프로그래밍에 맞게 적어보겠습니다.
spriteBatch.Draw(yong,new Rectangle(0, imy, 800, 600),new Rectangle(0, 0, 800, 600),Color.White);
복잡해보이지만 간단합니다.+_+
 yong는 이미지저장한 곳이고,
new Rectangle는 (x,y,가로,세로) 입니다.
x좌표는 0이겠죠 위쪽은 imy로 수치가 올라가면서 아래로 이동하겠죠 맨위가 0부터시작하니까요~그렇게 수치가
올라가고 가로는 이미지 크기까지니까 800 아래로는 600이겠습니다. ^^화면상에 보여질 위치설정했구용~

이미지파일 자체는 전부다 나와야겠죠?
이미지크기만큼 800x600으로 설정하겠습니다.new Rectangle(0, 0, 800, 600) ~그담은 색지정입니다.

자이제 출력해보겠습니다. 어떻게 나올지 상상이가시죠~-0-

저는 심심해서 상당히 무서운 포스터를 이용했습니다.
잠이 확 달아납니다.............................................

잘움직이죠?ㅎ
내려가기만하고 뭐 좀 어색합니다. 좀더 깔끔하게 짤린 부분을 위로 올려서 비행기게임 맵처럼
올라가게해보겠습니다.

이렇게 하려면 Y축으로 이동만하는게 아니라 이동한 만큼 짤린 그림을 위로 출력시켜야겠습니다.
그럼 생각해봅시다-_-Y축으로 이동한만큼을 어떻게 위에 출력 시킬것인가.

 


spriteBatch.Draw(
         yong, new Rectangle(0, 0, 800, imy), new Rectangle(0, 600 - imy, 800, imy),
         Color.White);

이부분이 추가 되었습니다.

앞에서 설명한부분입니다. 이게왜 짤린부분을 가져오냐면~봅시다

new Rectangle(0, 0, 800, imy),  이게 화면에 출력될 사각형을 설정해주는 부분입니다.

왼쪽과 위쪽이 0,0 으로 딱 붙여놨구요 오른쪽을 800으로 이미지 크기만큼 그리고
아래쪽으로는 짤린부분을 내려야하니까  imy로 설정했습니다. imy가 처음에는 0이다가
imy의 수치가커지면서 아래로 출력화면이 커지겠습니다.

이제 이거에 맞게 원본이미지크기를 설정해주면 되는데요 주의하실점이 이미지가 아래쪽부터 출력하게
해야한다는걸 생각하고있어야 합니다. 그래야 그림이 돌아가는 것처럼 보이겠죠?

new Rectangle(0, 600 - imy, 800, imy),이게 원본그림파일을 이크기로 불러오겠단 설정입니다.
왼쪽은 0이고요 이미지를 아래에서 부터 출력시켜야함으로 위쪽크기를 이미지 크기만큼 600으로 올려서
imy만큼 빼야합니다. 그다음은 이미지 크기만큼 오른쪽 800이구요  아래부분은 imy만큼 설정하면 되겠죠

자 이제 됐습니다.

상큼하게 에프 오번을 눌러봅시다^^;

빙글빙글 잘 돌아갑니다........무섭군요..........