지에고의 XNA Game Studio < 퍼즐게임 만들기 > #1

간단한 퍼즐게임을 하나 만들어 보겠습니다.^^

조각 맞추기 퍼즐게임을 다들 잘 아시죠^^?
이미지는 이걸로 하겠습니다
가로 6칸 세로 4칸으로 구현하겠습니다.

게임을 어떻게 구현할지 간단하게 생각해보겠습니다.
1. 그림파일을 가져와 일정한 크기로 나열합니다.
2. 각 그림들을 내열할때 다중배열로 저장합니다.
3. Rectangle, vector2, int[][] 만 잘사용하면 금방 끝납니다^^

시작 하겠습니다.

가장먼저 초기 선언을 하겠습니다.

    public class Game1 : Microsoft.Xna.Framework.Game
    {
        GraphicsDeviceManager graphics;
        SpriteBatch spriteBatch;
        Texture2D bk;//배경그림
        const int bw = 40;//각 셀 사이즈 40*40
        int[,] data = new int[4, 6];//가로 6 세로 4사이즈
        int count = 0;//data배열에 값을 저장할 변수
        KeyboardState stopkeyboard;//키보드 중복 인식 방지



주석 참고 해주시구요~
가로 셀 6개 세로 셀 4개의 조각 퍼즐을 만들 생각입니다.
data[0,0] = 0; data[0,1] = 1;.... 이런식으로 지정할 생각입니다.




        protected override void LoadContent()
        {
            // Create a new SpriteBatch, which can be used to draw textures.
            spriteBatch = new SpriteBatch(GraphicsDevice);
            bk = Content.Load("bk");
            // TODO: use this.Content to load your game content here
        }

위와 같이 그림파일 불러와 주세요

다음으로는 초기화 부분입니다 각 셀의 정보를 가지고 있을 data 녀석에게 수치를 부여합시다.
각 수치에 따라 그림 위치가 정해질 것 입니다.

        protected override void Initialize()
        {
            // TODO: Add your initialization logic here
            for (int i = 0; i < 4; i++)
            {
                for (int j = 0; j < 6; j++)
                {
                    if (i == 3 && j == 5) data[i, j] = -1;
                    else data[i, j] = count++;
                }
            }
            setdivise();//화면크기 변경 무시하셔도 됩니다.
            base.Initialize();
        }

이중 for문을 이요해서 data[0,0]~data[3,5] 까지 0~22 의 수치와
마지막 셀에는 -1의 수치를 넣어주도록 합시다.
-1을 넣은 이유는 나중에 그릴때 빈 블럭(퍼즐조각의경우 빈블럭있음)을
그리기 위함입니다.

네 키보드 입력을 받아 이동할 MoveBlock(int x, int y)는 두번째 블로깅에서
올리도록 하고 이번에는 일단 지금 까지 작성한걸 출력해보도록 하겠습니다.
>

        protected override void Draw(GameTime gameTime)
        {
            GraphicsDevice.Clear(Color.CornflowerBlue);
            spriteBatch.Begin();
            for(int n=0; n<4; n++)
                {
	           for(int m=0; m<6; m++)
		  {
		    if(data[n,m] < 0)//-1은 그리지않음(빈블럭)
		      {
	              }
		    else{
	                   int cx = data[n,m]%6;(x셀의 좌표는 0~5까지)
	                   int cy = data[n,m]/6;(y셀의 좌표는 0,1,2,3까지)
                            Rectangle Clip = new Rectangle(cx * bw, cy *bw ,bw, bw);
                  spriteBatch.Draw(bk, new Vector2(m * bw,n *bw), Clip, Color.White);
			}
                    }
                }
             spriteBatch.End();
        }

draw 부분에 위와같이 작성하도록 합시다.
for문으로 각 셀의 데이터를 조사합니다
-1 일 경우 아무것도 하지 않고 else 일 경우에 그리도록합니다.
x좌표는 총 0~5까지니 6으로 나눈 나머지가 되겠구요
y좌표는 몫이 0~3 까지 나오게 합니다.
그림내부에 그릴 영역을 설정합니다(rectangle)
bw 는 각 셀의 크기 입니다.
cx,cy 좌표에 bw크기만큼 곱합니다. 그림의 좌표 값이 되겠구요 이미지 영역은 bw,bw 만큼 설정합니다.
마지막 이제 그리도록 하겠씁니다
spriteBatch.Draw(bk, new Vector2(m * bw,n *bw), Clip, Color.White);

아까 저장한 bk의 이미지에 위치는 각 셀의 data[n,m] 값을 가져와 설정하고
그림 영역은 셀이 저장하고있는 수치정보로 Clip(rectangle)을 설정합니다.

자 위와 같이 입력하셨으면 출력해보도록 하겠습니다.

다음은 키보드 입력을 받아 이동하는 함수를 하나 제작해보도록 하겠습니다.
3#에서는 랜덤으로 퍼즐을 나열하도록 해보겠습니다.