ぱふの自由帳

ぱふの技術ブログ。メインはUnity。最近はUnity1Weekの放送してます。良ければフォローお願いします、、

背景をループさせる方法 -その1-

はじめに

背景をループさせる方法について備忘録も兼ねて書いていきます。その1と書いてるのは他にも方法があるので後々書く予定だからです…φ(。_。*)

方法紹介

MaterialとQuadを用いて背景のループ処理を行います。
どこかで見たことあるような方法ですね…。実はUnityの公式にもある2Dシューティングのチュートリアルで使われている方法です。以下にリンクを貼っておきます。

Tutorial - 2D Shooting Game 第06回 背景を作る

「ならチュートリアルのリンク貼って終わりでいいじゃないか」という声が聞こえてきそうですが、このチュートリアルでは「Material をアタッチしよう」としか書いていないのです。いざ真似しようとすると Material の作り方が初心者の方には分からないのです。…私もそうでした(;´Д`A

スクロールさせていく

テクスチャの設定

Unityにインポートした画像の設定として Texture Type を Default[※1] に、Wrap Mode を Repeat に変更してください。ここでエラーが出る場合は画像サイズが2の累乗にすると解消すると思います。

※1…Spriteでも問題ありませんでした。申し訳ありません。

f:id:PafuOfDuck:20170523162505p:plain

マテリアルの作成

Project -> Materialを選択し、Material を作ります。次に、Material の Shader をunlit -> Transparentに設定します。

f:id:PafuOfDuck:20170523163232p:plain

最後に Select と書いてあるボタンを押せば画像が選択できるので、先程作成したテクスチャを選択します。

スクリプト作成

背景のスクロールを行う Background.cs の作成をします。チュートリアルものと全く同じものです。

Background.cs

using UnityEngine;

public class Background : MonoBehaviour
{
    // スクロールするスピード
    public float speed = 0.1f;

    void Update ()
    {
        // 時間によってYの値が0から1に変化していく。1になったら0に戻り、繰り返す。
        float y = Mathf.Repeat (Time.time * speed, 1);

        // Yの値がずれていくオフセットを作成
        Vector2 offset = new Vector2 (0, y);

        // マテリアルにオフセットを設定する
        GetComponent<Renderer>().sharedMaterial.SetTextureOffset ("_MainTex", offset);
    }
}

組み合わせる

ここまで用意すると後は組み合わせるだけです。GameObject -> 3D Object -> Quadから Quad を作成します。この Quad に作成した Material をドラッグ&ドロップして設定します。また、Quad に Background.cs も忘れずにアタッチしておきましょう。

ここまで行うと以下のようになっているはずです。

f:id:PafuOfDuck:20170523164744p:plain

後は再生してみましょう。ループしながら動き出すはずです。(*‘-’)b

おわり

以上で説明は終了です。gifか何かで動かした方が見易いですよね…
やり方わからないので近いうちに調べておきます。(・ω・。≡。・ω・)キョロキョロ

初心者の方や熟練者の方を問わずTwitterのフォローお待ちしています…(`・ω・´) Let’s Unity !