본문 바로가기
GameMaker강좌[GM8]/RPG강좌

[게임메이커강좌-액션Rpg 강좌]액션Rpg-1-캐릭터 이동 (1/2)

by 타락카얀 2013. 9. 21.
728x90

 

 

GAME MAKER 강좌

 

 

KAYAN

 

 

 

 

이번 강좌부터 본격적으로 게임을 만들어 보도록 해요.

 

 

(▲이번 강좌에서 만들 캐릭터이동)


캐릭터를 만들기 전에 맵의 타일을 먼저 배치하도록 합시다.

 

 

 

 

 

 

 

 

 

◈맵

 

 


맵에 배치하는 것은 오브젝트를 통해 스프라이트 이미지를 표시하는 것과,
배경 이미지로 만들어 룸의 배경 탭에서 배경으로 배치하는것, 배경이미지를
타일로 설정하여 룸의 타일 탭에서 타일로 배치하는 것이 있습니다.
강좌에선 모두를 이용할거에요
매우 복잡하고 어려울 것 같지만 매우 간단하답니다.

일단 룸을 2개정도 만듭니다.
강좌에서는 룸의 이름을 rm_map1, rm_map2라고 짓겠습니다.
룸의 크기는 적당히하고, 룸의 속도는 60정도로 맞추도록 해요.
그리고 뷰의 설정은 실제 표시되는 윈도우의 크기로 설정하시면 됩니다.

 

 

(▲뷰의 설정)


View in room 은 룸에서 어느정도의 부분(영역)을 화면에 표시할 것인지 지정하는 것입니다.
Port on screen 는 지정한 룸 화면을 어느정도 사이즈로 표시할 것인지 지정하는데, 뷰가 1개일때는 이것이

게임 화면의 크기(게임 해상도)를 설정하게 됩니다.
만약 뷰가 여러개 일때는
Port on screen 에서 지정한 크기 중 가장 큰 사이즈가 게임 화면의 크기에 영향을 줍니다.
그리고 뷰를 사용하지 않을 때는, 룸의 크기가 게임 화면의 크기로 설정됩니다.

 

강좌에서는 기본 설정인 640X480크기의 화면으로 맞추도록 하겠어요.

먼저 배경이미지를 배경 탭에 배치하는 것부터 알아봅시다.

 

 

(▲배경 탭에서 배치할 배경이미지)


배경 탭에선 주로 큰 이미지나, 루프식 타일을 룸에 깔때 사용합니다.

 

 

(▲배경 탭)


룸의 배경 탭을 선택해 위의 그림 처럼 사용할 배경 번호(0~7)을 먼저 선택하고,
중간의 Foreground image 아래 칸에서 룸에 배치할 배경이미지를 선택하면 룸에 선택한 배경이미지로
채우게 됩니다.

[참고]
배경 번호(0~7)은 배경의 우선순위에 해당합니다.
만약 0과 1에 배경을 설치했을 때 1번이 0번보다 화면 앞에 보이게 됩니다.
Foreground image를 체크하게 되면 일반 배경 또는 그 어느 오브젝트 보다도 화면의 맨앞에 표시하게 됩니다.
꼭 무엇보다도 화면 앞에 표시하고자 할때 체크하고 배경이미지를 표시하시면 됩니다.
단, 깊이(depth)는 따로 설정할 수 없습니다. 맨 후위, 또는 맨 상위 2가지만 제공됩니다.

다음은 타일에 대해 알아봅시다.

 

 

(▲타일 탭에서 배치할 배경이미지)


이것 역시 배경이미지가 필요합니다.
배경이미지를 추가하고, 배경 설정중 Use as tile set을 체크하면 위와 같이 타일로 설정됩니다.

그리고 룸의 타일 탭으로 이동해서 룸에 배치할 이미지를 선택하여 타일을 배치하면 됩니다.

 

 

(▲타일탭에서 타일을 선택하여 이미지를 배치할 수 있음)


타일 탭에서는 배경 탭과는 달리 레이어가 제공되어 깊이별로 배치할 수 있다는 장점이 있습니다.
타일 탭의 맨 아래에 위치한 Add버튼을 누르면 레이어를 설정할 수 있고, Current Tile Layer에서
현재 레이어에서 다른 레이어로 이동할 수 있습니다.
그리고 Delete를 누르면 현재 레이어에 배치된 타일과 함께 삭제가 됩니다.
간단하죠.
깊이 없이 이미지만 표시할 것이라면 타일로 배치하는 것이 좋습니다.
오브젝트로 너무 많이 배치할 경우 게임이 버벅거릴수도 있거든요.


하지만 타일로도 매번 깊이를 조절하여 배치하기가 힘들기 때문에 일부는 오브젝트를 통해 배치해야합니다.

(타일은 정지된 상태의 그래픽이고, 게임에서 이벤트와 같은 세부적인 설정을 처리할 수 없기 때문)


그래서 다음은 오브젝트를 통해 배경을 배치해보도록 합시다.
먼저 깊이가 필요한 배경을 스프라이트로 구성합니다.

 

 

(▲나무 스프라이트 이미지)


중심점을 나무 뿌리, 즉 바닥과 맞닿은 지점을 중심으로 맞추세요.
이 나무는 장애물로 설정할 수도 있기 때문입니다.

 

 

(▲나무의 마스크 설정)


이런식으로 설정하면 마스크로 설정되어 나무 뿌리 쯤에 플레이어가 충돌시 플레이어를 멈추게 할 수 있죠.
이제 오브젝트를 만듭시다.
오브젝트는 모든 장애물의 parent로 사용할 오브젝트와, 실제 배치되는 하위 오브젝트로 구성하시면 됩니다.

     예) obj_block(parent오브젝트)-obj_tree1(실제 배치되는 하위오브젝트)

 

 

(▲장애물 오브젝트. 나무도 장애물 오브젝트로 만듬)


그리고 하위 오브젝트(obj_tree1)parent(obj_block)를 지정하시고, Sprite에 준비된 나무 스프라이트 이미지를
지정하시면 됩니다. 그리고 solid를 체크하도록 합니다.

이제 깊이(depth)를 설정해야합니다.
아래의 그림을 보시죠.

 

(▲ depth설정에 따른 효과)


왼쪽이 depth를 설정하지 않은 것이고, 오른쪽이 depth를 설정한 것입니다.
이와 같이 필드의 위치에 따라 가려질때는 가려지고, 보이고자하는 곳은 보이게 만들 수 있게 해야합니다.

모든 장애물의 parent(obj_block)오브젝트에 Create 이벤트를 추가하고 아래 처럼 깊이를 설정하세요.

 



      ★ obj_block - Create 이벤트

      depth=floor(room_height-y);



깊이(depth)를 룸의 높이(room_height)에서 자신의 y값을 뺀 값이 깊이가 됩니다.
이것은 고정된 장애물에 대한 설정입니다.
만약 움직이는 장애물이라면 이 설정을 Step 이벤트에 작성하셔야 합니다.

[참고]
깊이는 작을 수록 화면 앞으로 나오게 되고, 클수록 후위로 가게 됩니다.
또한 하위 오브젝트에 parent 오브젝트와 동일한 이벤트가 있을 경우, 하위 오브젝트의 이벤트만 실행되는데

parent오브젝트의 이벤트도 실행시키고자 한다면,

     event_inherited();

이 함수를 하위 오브젝트의 이벤트에 삽입해 parent의 이벤트를 상속시켜야 합니다.

이제 여러분들도 룸을 그럴싸하게 꾸며보도록 합시다.

 

 





◈ 플레이어의 이동(obj_player, obj_pl)

 

 


이제 플레이어를 만들어 봅시다.
먼저 방향별로 캐릭터의 이미지를 준비해 스프라이트로 구성하도록 합니다.

 

 

(▲방향별로 걷는 스프라이트 이미지)


강좌에서는 걷는 모습을 이렇게 구성했습니다.

중심점은 바닥과 맞닿은 지점을 중심으로 설정하세요.

마스크 역시 바닥과 맞닿은 지점을 중심으로 할 수도 있고, 캐릭터 전체 설정할 수도 있습니다.

여러분의 게임에 맞게 설정하시면 됩니다.

 

 

(▲걷는 모습)


넵. Rpg Maker의 캐릭터 칩과 비슷하죠.
Rpg Maker의 캐릭터 칩으로 구성해도 되고, 모션별로 부드럽게 여러장 구성하셔도 됩니다.
어차피 오브젝트 통해 행동별로 표시할 것이기 때문에, 많이 만드셔도 상관은 없어요.
강좌를 빠르게 진행하기 위해, 저는 간단하게 걷는 모션만으로 구성하도록 하겠습니다. 헤헷.

다음은 플레이어로 사용할 오브젝트와 parent로 사용할 오브젝트를 각각 하나씩 만듭니다.

 

 

(▲플레이어 오브젝트)


장애물과 같이 실제 배치되는 오브젝트(obj_pl)에만 sprite에 이미지를 지정하고 parent를 지정하시면 됩니다.
이렇게 하는 이유는 아시겠지만, 다양한 플레이어의 캐릭터가 있을 수도 있기 때문에 parent가 필요한 것입니다.
물론 강좌에선 플레이어가 하나지만요.

그리고 플레이어 오브젝트(obj_player)Create 이벤트를 추가하고, 필요한 변수들을 선언하도록 해요.

 



 
     ★ obj_player - Create 이벤트

     pspeed=1;//이동 속도

     spr_move[0]=spr_pl_0;//배열에 방향별로 이미지를 지정함.
     spr_move[1]=spr_pl_90;
     spr_move[2]=spr_pl_180;
     spr_move[3]=spr_pl_270;

     move_on=0;//이동중인지 체크. 0은 정지, 1은 이동
     unit_dir=round(direction/90) mod 4;//방향을 4부분으로 나눔
     image_speed=0.2;//애니메이션의 속도

     key_disable=0;//키 입력을 중단시킬지 정할 변수. 1은 키 입력 중지, 0은 키 입력 가능.



캐릭터에 어떠한 행동에 따라 어떠한 기본 변수나 스위치 변수가 필요한지 생각하신 후에 변수를 선언하시면됩니다.

아니면, 이벤트를 직접 작성하시다가 '아~! 이곳에는 변수가 필요하겠군!'이라 생각될때 마다, Create 이벤트

변수를 선언하고, 편집하고 있는 이벤트에서 변수를 사용할 수도 있겠지요.

여러분이 편하신 방법을 사용하시면 됩니다.


저는 이 정도 변수를 만들도록 하겠습니다.

스프라이트는 배열에 연결 시키면 호출할 때 변합니다.
예를 들어,

    draw_sprite_ext(spr_move[unit_dir],-1,x,y,1,1,0,c_white,1)

이렇게 한다면, 간단하게 unit_dir의 네개의 값(0,1,2,3)에 따라 방향별로 이미지를 표시하게 되는 것이죠.

이것을 토대로 Draw이벤트를 추가하고, 방향별 이미지를 표시하도록 해요.

 



 
     ★ obj_pl - Draw 이벤트

     var col;
     col=c_white;

     if move_on=0{//멈춰있을 때
     draw_sprite_ext(spr_move[unit_dir],0,x,y,1,1,0,col,1);
     }
     else{//이동할 때
     draw_sprite_ext(spr_move[unit_dir],-1,x,y,1,1,0,col,1);
     }



캬~! 간단하죠.
이 처럼 배열을 이용하면, 변수 호출을 간단하게 하여 작성할 수 있어요.

다음은 이동을 대한 이벤트를 작성해보도록 합시다.
Step 이벤트를 작성하고, 아래처럼 이동에 대한 이벤트를 구성하도록 해요.

 





     ★ obj_pl - Step 이벤트

     move_on=0;//이동 체크

     if key_disable=0{//키 입력 체크

     if keyboard_check(vk_left){//왼쪽
     x-=pspeed*place_free(x-pspeed,y);//장애물이 없을 때만 이동
     direction=180;//방향 설정
     move_on=1;//이동 설정
     }

     if keyboard_check(vk_right){//오른쪽
     x+=pspeed*place_free(x+pspeed,y);
     direction=0;
     move_on=1;
     }

     if keyboard_check(vk_up){//위쪽
     y-=pspeed*place_free(x,y-pspeed);
     direction=90;
     move_on=1;
     }

     if keyboard_check(vk_down){아래쪽
     y+=pspeed*place_free(x,y+pspeed);
     direction=270;
     move_on=1;}

     }



이것은 키 입력 중단을 체크하는 변수를 통해 키 이벤트를 실행시킬 수 있거나, 키 이벤트를 실행 못하게

할 수 있습니다.
예를 들면 어떠한 장면에 따라 키 입력을 막아야 할때, 또는 키를 입력하여 플레이어가 움직이면 안될때

유용하겠지요.


여러분이 구성하고 싶은 대로 작성하시면 됩니다.


다음은 깊이(depth)에 대해 설정해보도록 합시다.
End Step이벤트를 추가하고, 깊이(depth)에 대해 설정합시다.

 



 
     ★ obj_pl - End Step 이벤트

     depth=floor(room_height-y);



그리고 이미지가 연결된 배열 변수의 설정을 방향에 따라 변경되도록 추가하도록 해요.

 



 
     ★ obj_pl - End Step 이벤트

     unit_dir=round(direction/90) mod 4;



이것은 방향에 따라 값을 4개로 나누는 것입니다.
이 부분은 Draw 이벤트의 스프라이트를 표시하기 전에 넣어도 됩니다.

다음은 룸밖으로 나가지 않도록 설정해볼까요.
마찬가지로 End Step 이벤트에 아래와 같이 추가 작성하도록 합니다.

 



 
     ★ obj_pl - End Step 이벤트

     x=max(16,min(x,room_width-16));
     y=max(16,min(y,room_height-16));



이것은 스프라이트 이미지의 크기에 맞추어 밖으로 나가지 못하게 만드는 것입니다.

즉, x와 y좌표는 항상 룸의 크기의 -16 보다는 작고, 16보다 크게 고정시키는 것이죠.

예를 들어 800X640크기의 룸이 있을때, (x, y)좌표가 (0, 0)이라면 (16,16)으로 고정시키고, (x, y)좌표가

(900, 64)이라면 (800, 64)가 되는 것입니다.

 

스프라이트가 32X32 보다 크다면, 32의 절반인 16보다 큰 값을 넣으면 되겠지요.


다음은 룸이 실제 게임 화면(뷰)보다 클 경우, 뷰가 플레이어를 따라 다니게 만들어야 합니다.
이것은 룸에 있는 뷰 탭Object following에서 설정하실 수 있습니다.

 

 

(▲Object following설정)


위와 같이 사용할 뷰를 선택하고, Object following에 플레이어의 parent 오브젝트를 지정하시면 됩니다.

이렇게 이곳에 오브젝트를 지정하게 되면 해당 뷰는 그 오브젝트를 중심으로 화면을 이동하게 될 것입니다.

오옷! 플레이어가 어느 정도 된것 같네요.
룸에 배치하여, 설정한대로 잘 되는지 확인해보도록 해요.

 

 

 

 

-다음 강좌에서 계속-

 

 

 

300x250

댓글