連載 .NET＆Windows Vistaへ広がるDirectXの世界 第4回 XNA Game Studio Expressを触ってみよう！ NyaRuRu Microsoft MVP Windows - DirectX（Jan 2004 - Dec 2006） 2006/11/01

Page1 Page2 Page3 Page4

2. XNA Game Studio Expressベータ版を使ってみよう

　XNA Game Studio Expressベータ版をインストールすると、VC# Expressのプロジェクト・テンプレートに、新しいテンプレートが追加されている。

XNAインストール後のプロジェクト・テンプレート

次の3つが追加されている。 ・「Windows Game (XNA)」……ゲーム・アプリケーションのひな型。 ・「Windows Game Library (XNA)」……ゲーム・コンポーネントのひな型。 ・「Spacewar Starter Kit」……サンプル・ゲーム。

　また、ヘルプも項目が増えていることに気付くだろう。

XNA Game Studio Expressベータ版をインストールすると追加されるヘルプ

MDX時代には、ドキュメントが少なすぎるといわれ続けていたが、XNAでは非常に丁寧なドキュメントが最初から付属している。ざっとすべての文章に目を通した後で、“Your First XNA Game”からトライしてみるとよいだろう。

　ドキュメントの“Your First XNA Game”で紹介されている手順のうち、画像を表示する部分までを簡単に眺めてみよう。まず、プロジェクト・テンプレートから「Windows Game (XNA)」を選択する。

　今回は、ドキュメントの“Your First XNA Game”で紹介されている手順を若干変更し、アルファ・チャンネルを使用した画像を表示してみることにする。今回用意したのは次の画像だ。この画像をPNG形式のままブラウザから保存してもらうと、この記事の手順を再現できるはずである。

テスト画像（XNA.png）

透明部分と影にアルファ・チャンネルが使用されている。

　ファイルの追加はソリューション・エクスプローラに画像をドラッグ・アンド・ドロップするだけだ。ファイルが追加できたら、実行時に出力ディレクトリにコピーされるように設定を変更しておく。

［出力ディレクトリにコピー］の設定

ソリューション・エクスプローラで、実行時に出力ディレクトリにコピーされるように設定する。

先ほど追加した「XNA.png」を選択する。 　 プロパティ・ウィンドウで、［出力ディレクトリにコピー］を「常にコピーする」に変更する。

　これで画像の準備はOKである。もちろん、自分で好きな画像を用意してもらっても構わない。

　次に、先ほど追加した画像を表示するためのコードを追加する。ソリューション・エクスプローラで「Game1.cs」という項目を右クリックしてコンテキスト・メニューを表示し、そこから［コードの表示］を選ぶことでメイン（＝ゲーム本体）のソース・コードが表示される。

　初期状態のソース・コードは50行ほどで、ほぼ1画面に収まる程度の非常に簡潔なものになっている。XNAのアプリケーション・モデルは、ゲーム本体を表すクラス（本稿では「Game1」クラス）をGameクラス（Microsoft.Xna.Framework名前空間）から派生させ、メソッドをオーバーライドしたり、イベントを追加したりして、差分をプログラミングしていくという方針を取っている。

　本稿では、このソース・コードに対して、以下のようなコードを追加する。コードの意味については説明欄を参照してほしい。

/// <summary> /// This is the main type for your game /// </summary> partial class Game1 : Microsoft.Xna.Framework.Game {   Texture2D myTexture;     // 描画に使用するテクスチャ   SpriteBatch spriteBatch; // スプライト   protected override void OnStarting()   {     base.OnStarting();     graphics.GraphicsDevice.DeviceReset       += new EventHandler(GraphicsDevice_DeviceReset);     LoadResources();   }   void GraphicsDevice_DeviceReset(object sender, EventArgs e)   {     LoadResources();   }   void LoadResources()   {     // 現在のベータ版ではContent Pipelineが提供されていないため     // ファイル名を直接指定しているが、     // 最終的にはもっと簡潔に書けるようになる     myTexture = Texture2D.FromFile(graphics.GraphicsDevice, "XNA.png");     spriteBatch = new SpriteBatch(graphics.GraphicsDevice);   }   ……中略……

ひな型のソース・コードに対して追加するコード

プロジェクトの新規作成で生成されたひな型のコードに対して、太字部分のコードを追加してほしい。ここでは、OnStartingメソッドをオーバーライドすることで、ゲーム開始時に「XNA.png」画像を読み込むようにしている。またそれと同時に、描画デバイスがリセットされたときに発生するDeviceResetイベントのハンドラを登録し、そのDeviceResetイベント・ハンドラ内で再度「XNA.png」画像を読み込み直すようにしている。

　最後に、ひな型としてあらかじめ追加されているDrawメソッド内部で、上記のコードで読み込んだ「XNA.png」画像を描画すればよい。具体的には以下の行（太字部分）を追加すれば完成だ。

protected override void Draw() {   if (!graphics.EnsureDevice())   {     return;   }   graphics.GraphicsDevice.Clear(Color.CornflowerBlue);   graphics.GraphicsDevice.BeginScene();   // TODO: Add your drawing code here   // オプションでアルファ・ブレンディングを有効にしている   spriteBatch.Begin(SpriteBlendMode.AlphaBlend);   spriteBatch.Draw(myTexture, new Vector2(0.0f, 0.0f), Color.White);   spriteBatch.End();   // Let the GameComponents draw   DrawComponents();   graphics.GraphicsDevice.EndScene();   graphics.GraphicsDevice.Present(); }

Drawメソッドに追記するコード

太字部分を追加する。このコードは、アルファ・ブレンディングにより「XNA.png」画像を描画している。“Your First XNA Game”で紹介されている方法とは異なり、spriteBatch.Beginのところでアルファ・ブレンディングを有効にしている点に注意。

　以上のコードを実行して、下の画像が表示されれば成功だ。

サンプル・プログラムの実行結果

「XNA.png」画像をアルファ・ブレンディングで描画している。

　無事に画像が表示できたら、キーボードやコントローラによって移動させてみたり、もっとたくさんの画像を表示させてみたりと、いろいろ試してみるとよいだろう。これにはドキュメントの“Programming Guide”が参考になる。また、Web上には、すでにさまざまなサンプル・コードがアップロードされている。それらを参考に、皆さんもXNAの世界に飛び込んでいってみてほしい。

INDEX
	.NET＆Windows Vistaへ広がるDirectXの世界
	第4回 XNA Game Studio Expressを触ってみよう！
	1．XNA Game Studio Expressベータ版のインストール
	2．【コラム】DirectX SDKのインストールとデバッグへの応用
	3．XNA Game Studio Expressベータ版を使ってみよう
	4．【コラム】VC# Expressで出力アセンブリのプラットフォームを設定する

　

「.NET＆Windows Vistaへ広がるDirectXの世界」

＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）