平行移動で背景をスクロールする方法
この記事では、Unityで平行移動によって背景をスクロールする方法について説明します。
手順
TranslationRepeaterコンポーネントを作る
まず、平行移動を繰り返すコンポーネント( TranslationRepeaterコンポーネント )を作成します。
MonoBehaviourクラスを継承する
MonoBehaviourクラスを継承したクラスを作ります。
using UnityEngine;
public sealed class TranslationRepeater : MonoBehaviour
{
}メンバ変数を宣言する
関数の実装に必要となるメンバ変数を宣言します。このとき宣言する変数には、Inspectorウィンドウから値の設定を可能にするため、SerializeField属性を付与します。
[SerializeField]
private float start_position = 0.0f;
[SerializeField]
private float end_position = 0.0f;
[SerializeField]
private float m_speed = 0.0f;Update関数を定義する
オブジェクトを繰り返し平行移動させるため、Update関数を定義します。これでTranslationRepeaterコンポーネントは完成です。
private void Update()
{
transform.Translate( new Vector3( m_speed, 0.0f, 0.0f ) );
var position = transform.localPosition;
if ( position.x > end_position ) return;
position.x = start_position;
transform.localPosition = position;
}UIの領域を設定する
次に、UIの領域を設定します。
Canvasオブジェクトを作成する
Unityのメニューから「GameObject」 > 「UI」 > 「Canvas」を選択し、Canvasオブジェクトを作成します。
UIの領域を設定する
Canvas ScalerコンポーネントのUI Scale Modeを「Scale With Screen Size」に変更し、Reference Resolutionに基準とするサイズを設定します( ここでは1280×720を設定 )。
平行移動する機能を持つ背景を作る
最後に、繰り返し平行移動する機能を持つ背景を作ります。
Imageオブジェクトを2つ作成する
Unityのメニューから「GameObject」 > 「UI」 > 「Image」を選択し、Imageオブジェクトを2つ作成します。
サイズを画面より若干大きく設定して、横に並べる
Rect Transformコンポーネントでサイズを画面より若干大きく設定し、横に並べます( ここでは幅と高さを1290×730、X座標を0と1280に設定 )。
スプライトを設定する
ImageコンポーネントのSource Imageに背景のスプライトを設定します( スプライトの作成が事前に必要。また、2つ作成したImageオブジェクトの両方に設定する )。
マテリアルを設定する
ImageコンポーネントのMaterialに「Sprites-Default」を設定します。
TranslationRepeaterコンポーネントを追加し、値を設定する
Imageオブジェクトに( 先ほど作成した )TranslationRepeaterコンポーネントを追加します。そして、Inspectorウィンドウの各値( 「開始位置( X座標 )」「終了位置」「速度」 )を設定します。
以上で背景のスクロールは完成です。