« DeskTopLive.xnaやります
ミニDTL.xna “ゲームはイチニチ30分まで！” 第2回 »

ミニDTL.xna “ゲームはイチニチ30分まで！” 第1回

by key

前回の記事でお知らせしましたが、DeskTopLive.xnaというイベントをやります。

“XNA”という環境でゲームを作っている人たちがすごいテクとかライブプログラミングとか披露するので、我々はそれを眺めて興奮しながらお酒でも飲みましょうという場です。ゲームが好きなら難しいこと分からなくても大丈夫。

とはいえ、XNAのことは全然分からない。できたら少し予習していきたいという方もいるのでは。というか僕がほとんどそうなので、主催者としてまずい。

ので、急遽思いつきました。今日から毎日30分、XNAを調べながら触ってtwitcamで垂れ流します。まさにDeskTopLive。

生放送が終わったら、内容をまとめてこのブログに書きます。

今回の内容は以下の通り。

18:08 ～ Visual C# 2008 Expressをインストール

Googleで”Visual Studio Express”と検索して、Visual Studio Express Editionのページを開いてインストーラを実行。緑色のバナーが目的のVisual C#です。

18:13 ～ XNA Game Studio 3.1をインストール

同じく”XNA”で検索して、XNA デベロッパー センターを開いて日本語XNA Game Studio 3.1インストーラを実行。こっちは10分ぐらい時間がかかりますので気長に待ちましょう。

18:23 Windowsゲームプロジェクト作成

Visual C#を開いて新しいプロジェクトからWindows Game (3.1)を選び、名前をつけて作成。F5でデバッグ開始すると、初期状態の青い画面が実行されます。

18:29 ペイントで適当な絵を描いてpngで保存

こんな絵を描きました。ファイル名はsyobo.pngとしました。

syobo.png

syobo.png

18:31 画像をプロジェクトに追加して、読み込み・描画処理を追加

ソリューションエクスプローラのContentを右クリックして「追加→既存の項目」、上記の画像を選びます。

メンバー変数を宣言してるあたり（public Game1の前あたり）に、この画像を格納する変数を追加。

  1. Texture2D syobo;

LoadContentメソッドの中に、この画像をロードする処理を追加。

  1. syobo = Content.Load<Texture2D>("syobo");

Drawメソッドの中に、この画像を表示する処理を追加。

  1. spriteBatch.Begin();
  2. spriteBatch.Draw(syobo, new Vector2D(), Color.White);
  3. spriteBatch.End();

F5で実行してみると、左上に画像が出てきます。

18:35 Updateメソッド中で画像を動かすようにしてみる

さっきのsyobo変数の下に、画像の座標を保持するsyoboPos変数を追加。

  1. Texture2D syobo;
  2. Vector2 syoboPos;

Initializeメソッドの中で、座標を初期化。

  1. syoboPos = new Vector2();

Updateメソッドの中で、座標を更新。

  1. syoboPos.X = (float)Math.Cos(gameTime.TotalGameTime.TotalSeconds) * 100 + 200;
  2. syoboPos.Y = (float)Math.Sin(gameTime.TotalGameTime.TotalSeconds) * 100 + 200;

gameTimeには、ゲームが開始してからの時間や、前フレームからの経過時間が格納されています。
Cos、Sinを使うことで円運動になりますね。

Drawメソッドの中で、この座標を使って画像を表示するように。

  1. spriteBatch.Begin();
  2. spriteBatch.Draw(syobo, syoboPos, Color.White);
  3. spriteBatch.End();

こんな感じでした。

環境のインストールで時間をほとんど使ってしまったので、画像を出して動かす部分を駆け足で実装しましたが、次回からはもっとまったり進行で行きたいと思います。（というか、これ以上の事は調べながらじゃないと無理）

あとtwitcamを使うのが初めてだったので、かなり画面が見にくかったと思います。

次回からは、もっと低解像度のデスクトップを使って分かりやすくすすめますー。ご期待ください。

タグ: , , ,

この投稿は 2009 年 8 月 19 日 水曜日 7:54 PM に XNA, dev カテゴリーに公開されました。 この投稿へのコメントは RSS 2.0 フィードで購読することができます。 コメントを残すか、ご自分のサイトからトラックバックすることができます。

コメント / トラックバック 2 件

  1. XNA Today » ミニDTL.xnaが始まりました より:
    2009 年 8 月 19 日 9:35 PM

    [...] ミニDTL.xna “ゲームはイチニチ30分まで！” 第1回 [...]

  2. pekolog» ブログアーカイブ » ミニDTL.xna “ゲームはイチニチ30分まで！” 第2回 より:
    2009 年 8 月 21 日 3:02 AM

    [...] その後外出したので記事が遅くなってしまいましたが、昨日に引き続きミニDTL.xnaをやりました。 [...]

コメントをどうぞ