移動方向によって表示する画像を変える

この章では、テクスチャ表示における様々なテクニックのうち、移動方向によって表示する画像を変える方法を紹介する。

この章で使用するプログラムおよび画像ファイル

プログラムおよび画像ファイルダウンロードしてプロジェクトを作成し、正常に動くことを確認すること。

現在のプログラムについて

このプログラムは、ゲーム画面で自キャラが表示され、上下左右に動くだけである。ただし、自キャラに使用しているビットマップファイルは次のようになっている。

見てわかるとおり、自キャラの画像を「静止」「左向き」「右向き」「上向き」「下向き」それぞれ５枚ずつ用意した。

テクスチャの一部分を描画しなければならないが、とりあえず一番左上の「静止１」を基本画像としてポリゴンに貼り付けている。よって、自キャラ用のポリゴン情報初期化関数をGame.cppに用意している。 

//----------------------------------------------------------------------------------------
// 関数名　：　MyCharaInitVertex()　
// 機能概要：　自キャラ用の頂点データを格納する
//----------------------------------------------------------------------------------------
static void MyCharaInitVertex(LPTLVERTEX v, float x1, float y1, float x2, float y2)
{
    //頂点配列をゼロクリア
    ZeroMemory(v, sizeof(TLVERTX));
    //---頂点Ａ１のデータ定義
    v[0].x      =  x1;                         // 頂点Ｘ座標
    v[0].y      =  y1;                         // 頂点Ｙ座標
    v[0].z      =  0.0f;                       // 頂点Ｚ座標
    v[0].rhw    =  1.0f;                       // ２Ｄを扱うときの値
    v[0].tu     =  0.0f;                       // テクスチャのＸ座標
    v[0].tv     =  0.0f;                       // テクスチャのＹ座標
    v[0].color  =  D3DCOLOR_XRGB(255,255,255); // 頂点色
    //---頂点Ａ２のデータ定義
    v[1].x      =  x2;
    v[1].y      =  y1;
    v[1].z      =  0.0f;
    v[1].rhw    =  1.0f;
    v[1].tu     =  0.2f;
    v[1].tv     =  0.0f;
    v[1].color  =  D3DCOLOR_XRGB(255,255,255);
    //---頂点Ａ３のデータ定義
    v[2].x      =  x2;
    v[2].y      =  y2;
    v[2].z      =  0.0f;
    v[2].rhw    =  1.0f;
    v[2].tu     =  0.2f;
    v[2].tv     =  0.2f;
    v[2].color  =  D3DCOLOR_XRGB(255,255,255);
    //---頂点Ａ４のデータ定義
    v[3].x      =  x1;
    v[3].y      =  y2;
    v[3].z      =  0.0f;
    v[3].rhw    =  1.0f;
    v[3].tu     =  0.0f;
    v[3].tv     =  0.2f;
    v[3].color  =  D3DCOLOR_XRGB(255,255,255);
}

《POINT》

考え方

このプログラムを修正し、移動方向によって表示する画像を変える方法を考える。

このビットマップは、縦に「静止」「右」「左」「上」「下」とならんでいる。よって、ポリゴン情報のtvの値を0.2ずつ変化させれば、画像が切り替わることがわかる。
例えばv[0]を基準に考えた場合、tvの値は移動方向によって次のように変化する。

移動方向tvの値
移動せず（静止）0.0
右0.2
左0.4
上0.6
下0.8

静止を０、右を１、・・・、下を４と考えると、v[0]のtvの値は次の式で求めることができる。 

v[0].tv = 向き番号（０〜４）* 0.2;

４つの頂点それぞれのtvの値を、入力した方向によって変化させれば、表示画像が入力した方向によって変化することがわかる。

実際のプログラム

用意したプログラムを修正し、入力した方向によって表示画像を変化させる。Game.cppを次のように修正する。

1.入力された方向によって、各頂点のtvを変化させる関数を追加

４つの頂点情報のtvを変化させるため、関数化したほうがよい。以下の関数を追加する。プロトタイプ宣言も行うこと。 

//----------------------------------------------------------------------------------------
// 関数名　：　ChangeImage()　
// 機能概要：　方向によって転送する画像を切り替える
//----------------------------------------------------------------------------------------
static void ChangeImage(LPTLVERTEX v, int heightNo)
{
    float tv;

    tv = (float)heightNo * 0.2f;

    v[0].tv = tv;
    v[1].tv = tv;
    v[2].tv = tv + (float)0.2;
    v[3].tv = tv + (float)0.2;
}

《POINT》

2.ChangeImage関数を呼び出す処理を追加

押されたキーからChangeImage関数に渡す値を決定し、呼び出す処理を追加する。 

//-----------------------------------------------------------------------------
// 関数名　：　MyCharaMove()
// 機能概要：　自機移動
//-----------------------------------------------------------------------------
static void MyCharaMove(void)
{
    int InKey = 0;

    //--------------------------------------------------- 移動処理
    // 自キャラ
    if (KeyTbl[VK_LEFT] & 0x80)  Move(MyChara.Vertex, -MyChara.MoveX, 0), InKey = 2;
    if (KeyTbl[VK_UP] & 0x80)    Move(MyChara.Vertex, 0, -MyChara.MoveY), InKey = 3;
    if (KeyTbl[VK_RIGHT] & 0x80) Move(MyChara.Vertex, MyChara.MoveX, 0), InKey = 1;
    if (KeyTbl[VK_DOWN] & 0x80)  Move(MyChara.Vertex, 0, MyChara.MoveY), InKey = 4;
    MoveCheck(gl_rcScreen, MyChara.Vertex);  // 指定範囲を超えないようにする
    ChangeImage(MyChara.Vertex, InKey);

}

《POINT》

※以上の修正を行い、ゲーム画面で自キャラが移動方向によって画像が変わることを確認する。


NEXT（テクスチャ・アニメーション）