画面スクロールを実装しよう

unity_chan_logo

概要

最終更新日:2020/02/21

画面スクロールの実装方法について書いた記事です。
この記事は以下の内容を知りたい方に向けて書いています。
  • 画面スクロールとは何か知りたい
  • キャラクターの移動に合わせてステージをスクロールさせたい

サンプル

サンプルはここからダウンロードできます。
環境については以下の内容となっています。

開発環境
VSのバージョン VisualStudio 2019
DirectXのバージョン DirectX9
説明 左右キーを押すことでキャラクターが動き、画面がスクロールします。
説明で使っているコードはCamra.cppに書いてあります。


画面スクロールとは

画面スクロールとは2Dゲームなどでキャラクターが
画面スクロールとは2Dのアクションゲームなどでキャラクターの移動に合わせて、
ギミックや敵、背景など、画面全体がスクロールする手法です。

実装ポイント

画面スクロールの実装は以下のポイントを抑えて行います。
  • 更新対象を決める
  • ステージから出ないようにする

更新対象を決める

画面スクロールを行う場合は、カメラが追尾する対象を決めて、
毎フレーム対象の座標でカメラ座標の更新を行います。
対象のほとんどがプレイヤーになると思いますが、マップ機能などで、
ワールド画面全体を眺める仕様などもあるので、
対象を切り替えやすくしておいた方が、汎用的に使用できます。

ステージから出ないようにする

カメラで表示する範囲はステージの中だけにする必要があります。
その為、追尾対象がステージの端に移動したとしても、
表示範囲がステージからはみ出ないようします。

2d_game_0023

上の図はステージの範囲を考えずにカメラを移動した結果です。
ステージの絵が途切れてしまい、何も表示されていない画面が見えてしまいます。
このようにならないようにするための判定方法が以下の通りです。

// 左 or 上の判定
if (カメラ座標 - (横 or 縦のサイズ / 2) <= 0)
{
	// 左 or 上に表示範囲がはみ出ている
}

// 右 or 下の判定
if (カメラ座標 + (横 or 縦のサイズ / 2) >= ステージサイズ)
{
	// 右 or 下に表示範囲がはみ出ている
}

判定はカメラ座標から表示範囲の上下左右のX座標とY座標を割り出し、
それらの値が画面外になっていないかを判定します。

実装

画面スクロールの実装は基本的にスクリーン座標変換を実装していることが前提です。
この処理が実装出来ていたら、あとはカメラの更新関数を用意して
毎フレーム実行すれば完了します。

まず、追尾対象を決める方法ですが、サンプルではカメラ更新関数の引数で
対象の座標を取得して、それを最新のカメラ座標として代入しています。

void UpdateCamera(Vec2 pos)
{
	g_CameraPos = pos;
}

次にステージの範囲の内外判定は更新した座標で条件チェックを行います。


// X軸のステージの内外判定
if (g_CameraPos.X - window_half.X <= 0.0f)
{
	g_CameraPos.X = window_half.X;
}
else if (g_CameraPos.X + window_half.X >= FIELD_WIDTH)
{
	g_CameraPos.X = FIELD_WIDTH - window_half.X;
}

// Y軸のステージの内外判定
if (g_CameraPos.Y - window_half.Y <= 0.0f)
{
	g_CameraPos.Y = window_half.Y;
}
else if (g_CameraPos.Y + window_half.Y >= FIELD_HEIGHT)
{
	g_CameraPos.Y = FIELD_HEIGHT - window_half.Y;
}

画面外に出ていると判定された場合は、範囲内に収まるギリギリの値を代入します。
あとは、この更新関数で用意したカメラ座標を座標変換関数で使用するだけで、
画面スクロールは完成します。