★プレイヤーキャラクター 方向設定★


続いて、方向設定を行います。

今のキャラクターは後ろを向いたまま移動しています。

しかし、元画像は↓ですから上下左右の4方向の画像は用意されています。

同じ向きの画像が2つずつ用意されていますが、今回は左側の方だけ使います。


表示されるキャラクターの方向を決めているのは「転送元のY座標」です。

現在の「Player.cpp」の「Draw関数」を見ると↓のようになっています。

void Player::Draw(Engine *pEngine)
{
    SetRect(&m_sour, 0, 0, WIDTH, HEIGHT);

    SetRect(&m_dest, 
        m_x, 
        m_y, 
        m_x + WIDTH,
        m_y + HEIGHT);
    
    pEngine->Blt(&m_dest, TEXTURE_CHARACTER, &m_sour);
}

赤字にした箇所が「転送元のY座標」に関係する箇所です。

上座標が「0」、下座標が「32(定数HEIGHT)」になっているため、後ろ向きの画像が転送されています。

この座標を変更すれば、どの方向の画像でも転送出来るはずです。

とりあえず試してみます。

void Player::Draw(Engine *pEngine)
{
    SetRect(&m_sour, 0, 64, WIDTH, 64 + HEIGHT);

    SetRect(&m_dest, 
        m_x, 
        m_y, 
        m_x + WIDTH,
        m_y + HEIGHT);
    
    pEngine->Blt(&m_dest, TEXTURE_CHARACTER, &m_sour);
}

キャラクターの画像サイズは「32×32ピクセル」です。

正面(下)を向いた絵を表示したいので、上座標を「64」、下座標を「64+高さ(32)」に変更しました。

実行してください。

<実行結果 クライアント領域のみ>

キャラクターがこっちを向いていれば成功です。


さて、画像を見ると上下左右の絵に対する座標は分かりますよね。

画像上座標
上向き0
右向き32
下向き64
左向き96

これを使って向きを変えてみます。


方向用変数の準備


まずは方向を格納する変数を用意しましょう。

「Player.h」を開き、privateメンバ変数と列挙体を追加します。

長くなってきましたので、Playerクラスの一部を表示します。

private:

    const int WIDTH;
    const int HEIGHT;

    const int SPEED_NORMAL;
    const int SPEED_HIGH;

    int m_x;
    int m_y;

    int m_speed;

    enum {
        UP = 0,
        RIGHT = 32,
        DOWN = 64,
        LEFT = 96,
    };

    int m_direction;

    RECT m_sour;
    RECT m_dest;

方向を表す列挙体に上下左右の座標を設定しました。


「Player.cpp」を開き、「Initialize関数」で初期値を設定します。

void Player::Initialize()
{
    m_x = 0;
    m_y = 0;

    m_speed = SPEED_NORMAL;

    m_direction = DOWN;
}

正面(下)を初期値として設定しました。


変数を使って描画するため、「Player.cpp」の「Draw関数」を変更します。

void Player::Draw(Engine *pEngine)
{
    SetRect(&m_sour,
        0,
        m_direction,
        WIDTH,
        m_direction + HEIGHT);

    SetRect(&m_dest, 
        m_x, 
        m_y, 
        m_x + WIDTH,
        m_y + HEIGHT);
    
    pEngine->Blt(&m_dest, TEXTURE_CHARACTER, &m_sour);
}

分かりやすくするため改行しました。

変数「m_direction」に「転送元のY座標」が入っていますので、それを使って描画するように変更しました。


最後に、「Move関数」を次のように変更しましょう。

void Player::Move(Engine *pEngine)
{
    if (pEngine->GetKeyState(DIK_UP)) {

        m_direction = UP;

        m_y -= m_speed;
    }

    if (pEngine->GetKeyState(DIK_RIGHT)) {

        m_direction = RIGHT;

        m_x += m_speed;
    }

    if (pEngine->GetKeyState(DIK_DOWN)) {

        m_direction = DOWN;

        m_y += m_speed;
    }

    if (pEngine->GetKeyState(DIK_LEFT)) {

        m_direction = LEFT;

        m_x -= m_speed;
    }
}

カーソルキーを押す度に、その方向にあった定数を代入するようにしました。


それでは実行してみましょう。

<実行結果 クライアント領域のみ>

上下左右に移動する際に、その方向を向くようになればOKです。

※斜めの画像はありませんので、斜めには向きません。


プログラムの改良


これで完成!と行きたい所ですが、改良の余地が残っています。

方向を表す列挙体を確認してください。

enum {
    UP = 0,
    RIGHT = 32,
    DOWN = 64,
    LEFT = 96,
};

この数値は「転送元のY座標」を表していますが、キャラクターの高さが「32ピクセル」だからこのような数値になっています。

キャラクターの高さに変更が発生した場合、この列挙体も変更しなければなりません。

仕様変更などを考えると、ある程度汎用性を考えてプログラムを組むべきです。

これまでにやってきた事を踏まえると、

画像上座標
上向き0 * 32
右向き1 * 32
下向き2 * 32
左向き3 * 32

このように式を変化させるのは難しく無いと思います。


「Player.h」を開き、列挙体を変更します。

enum {
    UP,
    RIGHT,
    DOWN,
    LEFT,
};

続いて「Player.cpp」を開き、「Draw関数」を変更します。

void Player::Draw(Engine *pEngine)
{
    SetRect(&m_sour,
        0,
        m_direction * HEIGHT,
        WIDTH,
        m_direction * HEIGHT + HEIGHT);

    SetRect(&m_dest, 
        m_x, 
        m_y, 
        m_x + WIDTH,
        m_y + HEIGHT);
    
    pEngine->Blt(&m_dest, TEXTURE_CHARACTER, &m_sour);
}

実行してみましょう。

※特に見た目に変更はありませんので、実行画像は割愛します。


これで画像サイズが変わっても最低限の変更で済むようになりました。

次回は、キャラクターをアニメーションさせてみましょう。


次へ

戻る

目次へ