複数の解像度に対応する(黒帯を追加する)

確認済のバージョン: 5.5

-

難易度: 初級

使用するプロジェクト

この回はゲーム制作編第12回終了時点のプロジェクトを使用します。もし第12回終了時点のプロジェクトが手元にない場合はイントロダクション - このチュートリアルを始める前にのプロジェクトをダウンロードしてデモとして用意されている _Completed-Assetsフォルダのアセットを使用してください。

プロジェクトファイルをダウンロード

1.1 ゲームビューの画面サイズ変更

まずFile → Project Settings...PlatformをAndroidまたはiOSに変更しましょう。今回はAndroidへ変更を行います。

次にゲームビューの画面サイズを16:10 Landscape (16:10)にしましょう。


図1.1のように青色の背景が見えていたら正常です。

カメラの見える範囲が広くなった状態
図1.1: カメラの見える範囲が広くなった状態

1.2 黒帯の追加

黒帯のテクスチャをインポート

今回は画面サイズの変更によって発生した「余白」を黒帯で隠すようにします。

黒帯で使用するテクスチャのダウンロード

今回は4x4の黒のテクスチャを使用します。

黒のテクスチャをダウンロード (右クリックして保存)

ダウンロードしたblackScreen.pngのテクスチャをSpritesフォルダ下にインポートします。

Pixels To Unitsを4にします。

黒帯の設置

完成図
図1.2: 完成図

blackScreenをシーンビューへドラッグ&ドロップします。

作成されたblackScreenゲームオブジェクトのTransformを図1.3の値に変更します。


図1.3: Positionが( 5, 0, 0 )Scaleが( 2, 6, 1 )

右側のblackScreenが設置できたので今度は左側を設置していきます。ヒエラルキービューのblackScreenゲームオブジェクトを右クリックしてDuplicateを選択して複製します。

複製したblackScreenゲームオブジェクトのTransformを図1.4の値に変更します。


図1.4: Positionが( -5, 0, 0 )Scaleが( 2, 6, 1 )

これで黒帯の設置が終わりました。

黒帯のソーティングレイヤーを設定する

黒帯の設置は出来ましたが、このままではプレイヤーの表示が図1.5のように黒帯の上に表示されてしまいます。

わかりづらいがプレイヤーの半分が黒帯の上に表示されている
図1.5: わかりづらいがプレイヤーの半分が黒帯の上に表示されている

どちらかのblackScreenゲームオブジェクトを選択してSorting LayerからAdd Sorting Layer...を選択しましょう。

そしてBlackScreenレイヤーを追加します。順番は必ず一番下にしてください。

それぞれのblackScreenゲームオブジェクトのSorting LayerをBlackScreenに変更します。

これでプレイヤーが黒帯の下に隠れるようになりました。

1.3 プレイヤーの移動制限

ゲーム制作編 第09回ではプレイヤーの移動制限をViewPortによって行いました。ですが今回は余計な部分を黒帯で表示しているので移動は黒帯の部分まで行えてしまいます。

そこで今回は背景が表示されている範囲のみを移動できるようにします。

StartメソッドでBackgroundコンポーネントの取得とMoveメソッドの中身を修正していきます。

Player.cs

Code snippet

using UnityEngine;
using System.Collections;

public class Player : MonoBehaviour
{
    // Spaceshipコンポーネント
    Spaceship spaceship;

    // Backgroundコンポーネント
    Background background;

    IEnumerator Start ()
    {
        // Spaceshipコンポーネントを取得
        spaceship = GetComponent<Spaceship> ();

        // Backgroundコンポーネントを取得。3つのうちどれか1つを取得する
        background = FindObjectOfType<Background> ();

        while (true) {

            // 弾をプレイヤーと同じ位置/角度で作成
            spaceship.Shot (transform);

            // ショット音を鳴らす
            audio.Play ();

            // shotDelay秒待つ
            yield return new WaitForSeconds (spaceship.shotDelay);
        }
    }

    void Update ()
    {
        // 右・左
        float x = Input.GetAxisRaw ("Horizontal");

        // 上・下
        float y = Input.GetAxisRaw ("Vertical");

        // 移動する向きを求める
        Vector2 direction = new Vector2 (x, y).normalized;

        // 移動の制限
        Move (direction);

    }

    // 機体の移動
    void Move (Vector3 direction)
    {
        // 背景のスケール
        Vector2 scale = background.transform.localScale;

        // 背景のスケールから取得
        Vector2 min = scale * -0.5f;

        // 背景のスケールから取得
        Vector2 max = scale * 0.5f;

        // プレイヤーの座標を取得
        Vector3 pos = transform.position;

        // 移動量を加える
        pos += direction * spaceship.speed * Time.deltaTime;

        // プレイヤーの位置が画面内に収まるように制限をかける
        pos.x = Mathf.Clamp (pos.x, min.x, max.x);
        pos.y = Mathf.Clamp (pos.y, min.y, max.y);

        // 制限をかけた値をプレイヤーの位置とする
        transform.position = pos;
    }

    // ぶつかった瞬間に呼び出される
    void OnTriggerEnter2D (Collider2D c)
    {
        // レイヤー名を取得
        string layerName = LayerMask.LayerToName (c.gameObject.layer);

        // レイヤー名がBullet (Enemy)の時は弾を削除
        if (layerName == "Bullet (Enemy)") {
            // 弾の削除
            Destroy (c.gameObject);
        }

        // レイヤー名がBullet (Enemy)またはEnemyの場合は爆発
        if (layerName == "Bullet (Enemy)" || layerName == "Enemy") {
            // Managerコンポーネントをシーン内から探して取得し、GameOverメソッドを呼び出す
            FindObjectOfType<Manager> ().GameOver ();

            // 爆発する
            spaceship.Explosion ();

            // プレイヤーを削除
            Destroy (gameObject);
        }
    }
}

これでプレイヤーは背景内のみ移動できるようになりました。