Windows Phone 7用に「Snake」を作成します

^{著者について： Pasi Manninenは、モバイルおよびWebアプリケーションを開発し、Nokia開発者チャンピオンおよびAdobe Community Professional、Adobe認定エキスパート、Flex、FlashおよびFlash Mobileのトレーナーです。 ユヴァスキュラ大学（フィンランド最大の大学の1つ）を卒業し、応用数学とコンピューターサイエンスの学位を取得しました。}

はじめに

この記事では、Windows Phone用のSnakeの簡単なバージョンを作成する方法を示します。 ジェスチャーを使用して、さまざまな方向にヘビを動かすことができます。 アプリケーションは、メニュー画面、ゲーム自体、およびゲームの結果が表示される最終画面で構成されます。

Windows Phone 7.1 SDK

Windows Phone 7を実行しているデバイス用のアプリケーションを開発するには、Windows Phone 7.1 SDKをインストールする必要があります。 最新バージョンはこちらからダウンロードできます。

Windows Phoneゲーム

新しいWindows Phoneゲームの開発を開始するには、Microsoft Visual Studioを起動し、新しいプロジェクトを作成して、Windows Phoneゲーム（4.0）テンプレートを選択します。 プロジェクト名としてSnakeItを使用します。







この例では、C＃を使用してゲームを開発します。

ゲーム用の画像の準備

まず、食べ物とヘビ自体にシンプルなグラフィック要素を追加します。 表面全体で繰り返すことができる25x25の画像を使用します。

食べ物

ブラウザでSnakeItプロジェクトソリューションのコンテンツを右クリックし、[追加]> [新しいアイテム...]を選択します。

ビットマップファイルを選択し、FootTile.bmpという名前を付けます







食べ物を示すために25x25の緑の長方形を描きます。 ファイルを忘れずに保存してください。

ヘビ

同じ手法を使用して、ヘビ自体の赤い正方形を描きます。 画像にSnakeTile.bmpという名前を付けます。

ゲームフォント

画像の作成に使用したのと同じ方法で、ゲームのフォントを作成できます。 ソリューションエクスプローラーでプロジェクトのコンテンツを右クリックし、[追加]> [新しいアイテム...]を選択します。

Sprite Fontを選択し、Segoe20.spritefontという名前を付けます。







Project Explorerでフォントをダブルクリックし、そのサイズを20に設定します。忘れずにフォントを保存してください。

食品の食品クラスを作成する

ソリューションエクスプローラーでプロジェクトのコンテンツを右クリックし、[追加]> [新しいアイテム]を選択します。インストールされているテンプレートのリストで[コード]を選択し、Foodクラスを作成します。







このクラスは、テクスチャ（テクスチャ、タイプ）および位置（位置）に関する情報を格納します。 幅と高さの寸法は、Game1クラスで衝突を定義するために使用されます。

using System; using Microsoft.Xna.Framework; using Microsoft.Xna.Framework.Graphics; namespace SnakeIt { class Food { // Texture representing the food public Texture2D Texture; // Position of the food relative to the upper left side of the screen public Vector2 Position; // Get the width of the food public int Width { get { return Texture.Width; } } // Get the height of the food public int Height { get { return Texture.Height; } } // Set Food Texture and Position public void Initialize(Texture2D texture, Vector2 position) { Texture = texture; Position = position; } // Draw Food to the Screen public void Draw(SpriteBatch spriteBatch) { spriteBatch.Draw(Texture, Position, null, Color.White, 0f, Vector2.Zero, 1f, SpriteEffects.None, 0f); } } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

Snakeクラスの作成

Foodクラスを作成したのと同じ方法でSnakeクラスを作成します。

使用可能な名前空間

XNA FrameworkとCollectionsのListクラスを使用して、ヘビのすべてのタイルを処理します。

 using System; using Microsoft.Xna.Framework; using Microsoft.Xna.Framework.Graphics; using System.Collections.Generic;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

プロパティ

ヘビを定義するには、そのプロパティのいくつかを定義します。 ヘビの画像をテクスチャテクスチャとしてロードし、画面の中央にヘビの初期位置を設定します（これはGame1クラスの後半で実装します）。 すべてのスネークセルは、snakeTilesリストに保存されます。 ヘビの動きの方向は、ジェスチャーを使用してGame1クラスで制御されます。

 //   public Texture2D Texture; //   public Vector2 Position; //    public List<Tile> snakeTiles; //     public float speed; const float speedIncrement = 0.2f; //   // 1==, 2==, 3==, 4== public int direction; //      ->       public bool newTile;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

初期化

Game1はSnakeオブジェクトを初期化します。 スネークテクスチャがロードされ、その初期位置が設定されます。 ヘビのすべてのプロパティは、最初の起動時およびプレイヤーが再びゲームを完了したいときにデフォルトのプロパティにリセットされます。 デフォルトでは、ヘビは左に5ピクセル移動し、その頭のセルが作成されます。

 //   public void Initialize(Texture2D texture, Vector2 position) { Position = position; Texture = texture; Reset(); } //  ( ) public void Reset() { speed = 5f; direction = 1; Tile tile = new Tile(Texture, Position); snakeTiles = new List<Tile>(); snakeTiles.Add(tile); newTile = false; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

更新する

ゲームはメソッドを呼び出して、新しいゲームステップごとにヘビを更新します。 この方法では、蛇の頭の位置を見つけます（これはsnakeTilesリストの最初のセルです）。 ヘビに新しいセルを追加する必要がある場合（つまり、食べ物が食べられたとき）、headPostionの新しいセルを作成し、snakeTilesリストに追加します。 次に、ヘビの頭だけを動かして、そのサイズを大きくします。 ヘビの新しいセルがもはや予想されない場合、最後のセルをヘビの「頭」に移動するだけで、ヘビ自体を新しい位置に移動します。

 public void Update() { //    Vector2 headPosition = snakeTiles[0].Position; //    if (newTile) { //    Tile tile = new Tile(Texture, headPosition); //    SnakeTiles ( HeadPosition,       ) snakeTiles.Insert(1, tile); } //    ,   ""  else if (snakeTiles.Count > 1) { Tile last = snakeTiles[snakeTiles.Count - 1]; last.Position = headPosition; snakeTiles.RemoveAt(snakeTiles.Count-1); snakeTiles.Insert(0, last); } //      if (newTile) { speed += speedIncrement; newTile = false; } //  ""     switch (direction) { case 1: snakeTiles[0].Position.X -= speed; break; case 2: snakeTiles[0].Position.Y -= speed; break; case 3: snakeTiles[0].Position.X += speed; break; case 4: snakeTiles[0].Position.Y += speed; break; } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

描画

各スネークセルは、Draw（）メソッドで描画されます。 このメソッドは、Game1クラスから呼び出されます。

 public void Draw(SpriteBatch spriteBatch) { for (int i = 0; i < snakeTiles.Count; i++) { spriteBatch.Draw(snakeTiles[i].Texture, snakeTiles[i].Position, null, Color.White, 0f, Vector2.Zero, 1f, SpriteEffects.None, 0f); } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

Tileクラス（Snakeクラスに関連するネストされたクラス）

ネストされたTileクラスを作成します。 このクラスは、ヘビの細胞を決定します。 各セルには、位置とテクスチャがあります。

 class Tile { public Vector2 Position; public Texture2D Texture; public Tile(Texture2D texture, Vector2 position) { Position = position; Texture = texture; } //   public int Width { get { return Texture.Width; } } //   public int Height { get { return Texture.Height; } } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

クラスゲーム1

Game1クラスは、Windows Phone XNA Gamesに基づくゲームのメインクラスです。 ここで、ゲームのコンテンツの初期化とロードが行われます。 ジェスチャーと衝突検出は、Updateメソッドと呼ばれるゲームメソッドで使用されます。 DrawはGameModeプロパティによってゲームモードをチェックし、対応する画面を描画します。

名前空間

通常のXNAおよびTouchクラスを使用して、ジェスチャーを定義します。

 using System; using System.Linq; using Microsoft.Xna.Framework; using Microsoft.Xna.Framework.Graphics; using Microsoft.Xna.Framework.Input; using Microsoft.Xna.Framework.Input.Touch;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

プロパティ

GraphicsDeviceManageクラスを使用して、現在のディスプレイに関する情報を取得します。 SpriteBatchクラスは、画面に情報を表示するために使用されます。 メニュー、ゲーム自体、またはゲーム完了モードを描画するために、Draw（）メソッドで何が起こっているかを制御するために、さまざまなゲームモードを使用することにしました。 これは、画面上のさまざまなモードの描画を処理する非常に簡単な方法です。 さらに、この問題を解決するための爆発的なアプローチが可能です（リンク： Game State Managementを参照）。 現在のゲームモードはModeプロパティに格納され、すべての種類のモードはGameModeの列挙として定義されます。

 //     private GraphicsDeviceManager graphics; //      private SpriteBatch spriteBatch; //  private Snake snake; //    private Food food; //  private SpriteFont segoe20; //     private Vector2 scorePosition; //  private float score; private const float FOOD_POINTS = 20; //    GameMode Mode; //    enum GameMode {Menu, Running, Complete}
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

コンストラクター

まず、GraphicsDeviceManageクラスに接続し、ディレクトリにすべてのコンテンツスプライトとフォントを指定します。 デフォルトでは、フレームレートは30フレーム/秒に設定されています。 また、タップおよびフリックジェスチャーを有効にする必要があります。 さまざまなゲームモードはタップジェスチャーを使用して変更され、ヘビの動きはフリックジェスチャーによって制御されます。

 public Game1() { //   graphics = new GraphicsDeviceManager(this); //      Content.RootDirectory = "Content"; // 30       Windows Phone. TargetElapsedTime = TimeSpan.FromTicks(333333); //       . InactiveSleepTime = TimeSpan.FromSeconds(1); //   Tap  Flick TouchPanel.EnabledGestures = GestureType.Tap | GestureType.Flick; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ゲームの初期化

Initializeメソッドを使用すると、ゲーム自体を開始する前に、ゲームとそのすべてのリソースを初期化するアクションを実行できます。 ここでは、ゲームモードを設定し、食べ物とヘビ自体のオブジェクトを作成します。

 protected override void Initialize() { //     Menu,  Menu    Draw() Mode = GameMode.Menu; //       snake = new Snake(); food = new Food(); //  0  score = 0f; base.Initialize(); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

スプライトとフォントをダウンロードする

LoadContentは、すべてのファイルを読み込むために一度呼び出されます。 まず、SpriteBatchを使用してグラフィックデバイスに接続し、後で画面上にオブジェクトを描画できるようにします。 次に、食べ物と蛇のテクスチャをアップロードして作成します。 この時点で、対応するSnakeクラスとFoodクラスでInitializeメソッドが呼び出されます。 また、フォントを作成し、位置を計算してポイント数を表示します。

 protected override void LoadContent() { //  SpriteBatch    spriteBatch = new SpriteBatch(GraphicsDevice); //         Vector2 snakePosition = new Vector2( GraphicsDevice.Viewport.TitleSafeArea.X + GraphicsDevice.Viewport.TitleSafeArea.Width / 2, GraphicsDevice.Viewport.TitleSafeArea.Y + GraphicsDevice.Viewport.TitleSafeArea.Height / 2); snake.Initialize(Content.Load<Texture2D>("SnakeTile"), snakePosition); //          Vector2 foodPosition = RandPosition(); food.Initialize(Content.Load<Texture2D>("FoodTile"), foodPosition); //  segoe20 = this.Content.Load<SpriteFont>("Segoe20"); //       scorePosition = new Vector2(20, 20); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ゲーム更新

更新は、ゲームを更新するためのロジックを実装します：衝突チェック、入力への応答、オーディオの再生。 ここでは、ゲームの実行中にヘビの位置を更新し、ヘビと食物との衝突をチェックします。 ゲームが実行されているかどうかに関係なく、このメソッドが呼び出されるたびにすべてのジェスチャーがチェックされます。

 protected override void Update(GameTime gameTime) { //     if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed) this.Exit(); if (Mode == GameMode.Running) { snake.Update(); CheckCollision(); } CheckGestures(); base.Update(gameTime); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

衝突を確認する

食べ物とヘビの「頭」の位置は、対応するRectangleオブジェクトで計算されます。 その後、組み込みの交差メソッドを使用して、長方形の交差を決定できます。 この場合、ヘビによる食事が決定された場合、ポイント数を増やしてランダムな新しい位置に食物スプライトを作成します（ヘビに自分自身を更新して新しいセルを追加する必要があることも伝えます）。 ヘビの頭が画面を越えた場合、ゲームは終了したと見なされます。

 private void CheckCollision() { //       int snakeHeadX = (int)snake.snakeTiles[0].Position.X; int snakeHeadY = (int)snake.snakeTiles[0].Position.Y; Rectangle rectangle1 = new Rectangle(snakeHeadX, snakeHeadY, snake.snakeTiles[0].Width, snake.snakeTiles[0].Height); Rectangle rectangle2 = new Rectangle((int)food.Position.X, (int)food.Position.Y, food.Width, food.Height); //     if (rectangle1.Intersects(rectangle2)) { //   score += FOOD_POINTS; //     food.Position = RandPosition(); //     snake.newTile = true; } //     if (snakeHeadX < 0 || snakeHeadY < 0 || snakeHeadX + snake.snakeTiles[0].Width > GraphicsDevice.Viewport.Width || snakeHeadY + snake.snakeTiles[0].Height > GraphicsDevice.Viewport.Height) { Mode = GameMode.Complete; } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

以下の方法は、フードスプライトを新しいランダムな位置に移動するために使用されます。

 private Vector2 RandPosition() { //     Random random = new Random(); Vector2 position = new Vector2( GraphicsDevice.Viewport.TitleSafeArea.X + random.Next(GraphicsDevice.Viewport.TitleSafeArea.Width - 45) + 20, GraphicsDevice.Viewport.TitleSafeArea.Y + random.Next(GraphicsDevice.Viewport.TitleSafeArea.Height - 45) + 20); return position; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ジェスチャーチェック

ジェスチャーは、毎回Updateメソッドでチェックされます。 最初に、新しいジェスチャが使用可能かどうかを確認し、使用可能な場合は読み取ります。 Flickのようなジェスチャーが定義されている場合、Delta値も取得します。 その後、ヘビは適切な方向に移動します。 プレイヤーはヘビを反対方向に動かすことはできません（ゲームは終了します）。 タップジェスチャが検出されると、ゲームモードが変更されます（メニューから新しいゲームを開始するか、ゲームを再起動します）。

 private void CheckGestures() { //   ? while (TouchPanel.IsGestureAvailable) { //   GestureSample gesture = TouchPanel.ReadGesture(); // Flick  Tap? switch (gesture.GestureType) { case GestureType.Flick: //     ? Single x = gesture.Delta.X, y = gesture.Delta.Y; //     ? if (Math.Abs(x) > Math.Abs(y)) { // left or right if (x < 0) { if (snake.direction == 3 && snake.snakeTiles.Count() > 1) Mode = GameMode.Complete; else snake.direction = 1; //  } else { if (snake.direction == 1 && snake.snakeTiles.Count() > 1) Mode = GameMode.Complete; else snake.direction = 3; //  } } else { //   ? if (y < 0) { if (snake.direction == 4 && snake.snakeTiles.Count() > 1) Mode = GameMode.Complete; else snake.direction = 2; //  } else { if (snake.direction == 2 && snake.snakeTiles.Count() > 1) Mode = GameMode.Complete; else snake.direction = 4; //  } } break; case GestureType.Tap: //    Menu  Running if (Mode == GameMode.Menu) { Mode = GameMode.Running; } //    Complete  Running  else if (Mode == GameMode.Complete) { snake.Reset(); score = 0f; Mode = GameMode.Running; } break; } } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ディスプレイゲーム

Drawメソッドは、ゲームが自分自身を描くときに呼び出されます。 この例では、青色の背景のみが使用されています。 このメソッドは、ゲームモードをチェックし、対応する画面を描画します。 ゲームが最初に読み込まれると、「FreeSnake、タップして画面を開始」というテキストが表示されます。 ユーザーがゲームをプレイすると、ヘビ、ヘビの餌、ポイント数が表示されます。 得点と再プレイの申し出に関する情報は、ゲームの最後に表示されます。

 protected override void Draw(GameTime gameTime) { GraphicsDevice.Clear(Color.CornflowerBlue); //   spriteBatch.Begin(); if (Mode == GameMode.Menu) { string GameStart = "FreeSnake\nTap the Screen to Start"; Vector2 stringSize = segoe20.MeasureString(GameStart); spriteBatch.DrawString(segoe20, GameStart, new Vector2((GraphicsDevice.Viewport.Width - stringSize.X) / 2, (GraphicsDevice.Viewport.Height - stringSize.Y) / 2), Color.White); } else if (Mode == GameMode.Running) { //   snake.Draw(spriteBatch); //   food.Draw(spriteBatch); //    spriteBatch.DrawString(segoe20, "Score:"+score, scorePosition, Color.White); } else if (Mode == GameMode.Complete) { snake.Draw(spriteBatch); string GameOver = "Game Over\nScore : " + score +"\nTap the Screen to Restart"; Vector2 stringSize = segoe20.MeasureString(GameOver); spriteBatch.DrawString(segoe20, GameOver, new Vector2((GraphicsDevice.Viewport.Width - stringSize.X) / 2, (GraphicsDevice.Viewport.Height - stringSize.Y) / 2), Color.White); } //   spriteBatch.End(); base.Draw(gameTime); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

おわりに

この例では、Windows Phone用のジェスチャーゲームを作成するために必要な基本情報を示しました。



結果として得られるゲームのソースコードは、 ここにあります 。

そしてもう一つ

また、5月20日までに、コンテスト「 Best Applications Free Promotion 」のアプリケーションがNokiaおよびMicrosoftから受け取られることをお知らせします。 Windows Phone 7用のアプリケーションとゲームを送信して、Nokia Lumia 800スマートフォンを獲得するチャンスを獲得し、NokiaおよびMicrosoftプラットフォームでアプリケーションを無料で宣伝してください。