【Unity】SpriteRendererとは?2D画像を描画するためのコンポーネント

SpriteRendererとは? Unity

こんにちは、ともくんのゲーム作り部屋にようこそ!

このページでは、

「UnityのGetComponentってなに?」

「GetComponentを使うとどんなことができるの?」

というお悩みの方に向けた内容となっています。

Unityで2Dの画像をゲーム内に配置すると、自動的にSpriteRendererというコンポーネントが付きます。

このSpriteRendererは、Unityで2D画像のデータを表示させるために必要なコンポーネントになっています。

そして、SpriteRendererコンポーネントを使うことで、画像の色を変えたり反転させるといったことができるようになります。

そこで、このページでは、UnityのSpriteRendererコンポーネントについて、どんなコンポーネントなのか、特徴や設定項目、使い方までをまとめていきます。

この記事を書いた人

ゲーム作りを学び始めた一児のパパです。
このブログは、子供から「ゲームを作ってみたい!」と言われ、非プログラマーでゲーム作りをしたことない僕が、ゲーム作りの本を読んで独学でゲーム開発を学んでいるブログです。
同じように初めてゲーム作りをしている方と一緒に学んでいけるようなブログに出来たらいいなと思っています。
また、「このコードはおかしい」とか「もっと良い書き方があるよ!」などあれば、どんどん指摘して頂けると助かります。

SpriteRendererとは?

まずは、SpriteRendererコンポーネントがどういったものなのかを紹介していきます。

2D画像を表示させるためのコンポーネント

SpriteRendererは、冒頭でも解説した通りで2D画像を表示させるためのコンポーネントです。

もう少し具体的に言うと、Unityでは2D画像をSpriteという形式で読み込んでおり、このSpriteのデータをSpriteRendererコンポーネントを使って描写しています。

例えば、Unity内に画像を取り込んでゲーム内に配置してみると、自動的にこのSpriteRendererコンポーネントが付与されることで、何もしなくてもゲーム画面に画像が描写されます。

しかし、このSpriteRendererコンポーネントを削除してみると、画像のオブジェクトはそのままなのに、ゲーム画面の方にはその画像が表示されなくなります。

このように、SpriteRendererコンポーネントは、2D画像をゲーム内に描写させるという役割を持っています。

スプライトの色や材質・画像の反転などを決めている

SpriteRendererコンポーネントは、2D画像をどのように描写させるかを制御することもできます。

例えば、オブジェクトのを変更して描写させたり、画像を反転させて表示させるなどといったことを制御することができます。

また、これらの設定は、インスペクターウィンドウからだけでなくスクリプト上から行うこともできます。

例えば、プレイヤーがオブジェクトに触れたらそのオブジェクトの色を変更するといった場合には、このSpriteRendererコンポーネントを取得してあげて、オブジェクトの色を変更することで処理を作ることができます。

SpriteRendererの使い方

ここからは、SpriteRendererの使い方について紹介していきます。

SpriteRendererの設定項目

SpriteRendererコンポーネントには、9つの設定項目があります。

Sprite:どのスプライトを描写するかを決める

Spriteは、どのスプライトデータを描写させるかを決める変数です。

項目の右側で、使用可能なスプライトのアセットを選択することができます。

2D画像を配置した場合、そのスプライトデータが自動的に入っていて、ゲームの途中で画像を切り替えたい時などに、このSpriteの項目を変更します。

Color:スプライトの画像の色を決める

Colorは、スプライトの画像に色を付けることができる変数です。

項目をクリックすると、以下のようなカラーピッカーが開き、色を直接選択したり、RGBA値で色を指定することができます。

例えば、四角形のオブジェクトを追加していた場合、SpriteRendererのカラーを指定することで、オブジェクトの色が変更されます。

Flip:スプライトを反転させる

Flipは、スプライトデータを反転させてゲーム内に描写することができます。

Flipの横にあるXにチェックを入れるとX軸に沿って反転、Yにチェックを入れるとY軸に沿って反転します。

Draw Mode:スプライトの大きさの変え方を決める

Draw Modeは、スプライトの大きさを変える際にどのように変えて描写するかを決める項目です。

このDraw Modeの項目には、

  • Simple:大きさを変えると全方向に引き伸ばされる
  • Sliced:端はそのままで中のスプライトだけが引き伸ばされる
  • Tiled:動きはSlicedと同じで中身が繰り返して表示される

という3つのモードがあります。

例えば、Tiledを使うことで以下のように描写することができます。

Mask Interaction:特定の部分を非表示にして描写

Mask Interactionは、SpriteMasksと一緒に使うことで、特定の部分を非表示にすることができます。

このMask Interactionは、

  • None:SpriteMasksを使わずに描写する
  • Visible Inside Mask:SpriteMasksが覆っている部分だけが描写される
  • Visible Outside Mask:SpriteMasksが覆っていない部分だけが描写される

と、3つの設定項目があります。

Sprite Sort Point:カメラとスプライトの距離を計測する位置

Sprite Sort Pointは、カメラとスプライトの距離を計算する際に、スプライトのどの位置から計算するかを設定している項目です。

デフォルトでは、スプライトの中心であるCenterが設定されていますが、特定の位置に変える場合はPivotにして設定することができます。

なお、この設定はカメラがOrthographic Projectionモードになっている時、カメラとの距離が近いスプライトが手前に描写され、遠くなればなるほど奥に描写されるという仕様になっていて、その際のスプライトの位置を決めている項目です。

Material:スプライトの材質を決める

Materialは、スプライトのマテリアルを決めている項目です。

マテリアルは材質のことで、スプライトの見た目を変えることができます。

Sorting Layer:スプライトの描画順をレイヤーで決める

Sorting Layerは、スプライトの描画順をレイヤーで決める項目です。

Sorting Layerを使うことで、スプライトをレイヤーごとのカテゴリに分けて、レイヤーの描画される順番を設定することができます。

Order In Layer:同じレイヤー内で描画順を決める

Order In Layerは、上のSorting Layerの同じレイヤーの中で描画される順番を決める項目です。

このOrder In Layerの数字が大きければ大きいほど、そのスプライトが手前に表示されることになります。

なお、スプライトの描画順については、以下のページでも詳しく解説しています。

SpriteRendererをスクリプトから設定・変更できる

SpriteRendererコンポーネントは、インスペクターウィンドウから設定することもできますが、スクリプトから設定することもできます。

また、スクリプトから設定することで、ゲームの途中でスプライトの描写のされ方を変更することができます。

例えば、ゲーム内でオブジェクトをクリックすると、そのオブジェクトの色が変わるという処理を作りたいとします。

using UnityEngine;

public class Test : MonoBehaviour
{
    SpriteRenderer spriteRenderer;  // 変数を作成する

    void Start()
    {
        spriteRenderer = GetComponent<SpriteRenderer>();    // SpriteRendererのコンポーネントを取得する
    }

    void Update()
    {
        if (Input.GetMouseButtonDown(0))
        {
            spriteRenderer.color = Color.red;   // 赤色に変更する
        }
    }
}

9行目でGetComponentメソッドを使い、SpriteRendererコンポーネントを取得しています。

このGetComponentは、コンポーネントの機能を使ったり変更したりする際に、コンポーネントを取得することができるメソッドです。

そして、マウスクリックした際の処理を書いている16行目で、SpriteRendererコンポーネントのcolor変数に、別の色を指定してあげます。

これでゲームを実行してみると、

マウスをクリックすると、オブジェクトの色が変わっているのが分かります。

このように、SpriteRendererコンポーネントをスクリプトから変更したりすることができます。

まとめ

このページでは、Unityで使うことができるSpriteRendererコンポーネントについて、どんな仕様や特徴があるのか、また使い方や設定項目についてまとめていきましたが、いかがでしたでしょうか?

SpriteRendererコンポーネントは、画像データであるスプライトをゲーム内に描写させるためのコンポーネントで、どのように描写させるかを決める役割もあります。

SpriteRendererの設定項目として、スプライトのを決めたり、反転させたり、描画順を設定するなどのことができます。

また、スクリプトからSpriteRendererにアクセスすることで、ゲーム内の処理に合わせてスプライトの描画を変えることができます。

最後までお読みいただきまして、ありがとうございました!

コメント