【Unity】2D キャラクターの表示描画順を制御する

前書き
キャラクターの描画順を変更する方法
Sorting Layer を変更する
1. 設定方法
Order in Layer を調整する
Z座標を変更する
SortingGroup を使用する
1. 設定方法
  1. SortingGroup を使わない場合
  2. SortingGroup を使う場合
まとめ

前書き

久しぶりにUnityを触ると、以前できていたことを忘れてしまうことがよくあります。今回は、そんな「ちょっとしたこと」を思い出す手助けになればと思い、記事を書きました。

今回のテーマはキャラクターの表示順についてです。例えば、キャラクターを重ねたときに一番上に表示する方法、障害物の後ろにキャラクターを配置する方法など、描画順を制御する方法を紹介していきます。

なお、本記事では2D（SpriteRenderer）に限定した話となりますので、その点はご了承ください。

キャラクターの描画順を変更する方法

キャラクターの描画順を制御する方法はいくつかあります。基本的には以下のような方法で調整可能です。

Sorting Layer を変更：レイヤーごとに描画の優先度を管理する
Order in Layer を調整：同じレイヤー内での描画順を細かく指定する
Z座標を変更：キャラクターの奥行きで描画順を決定する
SortingGroup を使用：子オブジェクトの描画順をグループ化して制御する

ちなみにTopDownEngineのキャラクターはSorting Layerを使って表示することが多いです。

ではそれぞれの設定方法について説明していこうと思います。

Sorting Layer を変更する

Sorting Layer は大まかな描画グループを決めるもので、異なる Sorting Layer のオブジェクト同士は Order in Layer より優先して描画されます。

設定方法

Edit → Project Settings → Tags and Layers → Sorting Layers で新しいレイヤーを追加
SpriteRenderer の Sorting Layer を設定

Order in Layer を調整する

同じ Sorting Layer 内での描画順を細かく設定するためのパラメータです。値が大きいほど手前に表示されます。

Z座標を変更する

transform.position.z を変えると、3Dの描画順序に基づいてスプライトの前後関係が決まります。

SortingGroup を使用する

最後に紹介するSortingGroupを使用する方法ですが、SpriteRendererが複数ある場合に有効な使い方になります。最初に紹介しましたがTopDownEngineのデフォルトキャラクターではこのコンポーネントを使って作成しています。

設定方法

GameObject に SortingGroup コンポーネントを追加
Sorting Layer や Order in Layer を設定
子オブジェクトは SortingGroup の基準で描画順が決まる

通常、SpriteRenderer を持つオブジェクトは親子関係があっても、それぞれ独立して描画順が決まるため、親より子が前に描画されるとは限りません。
しかし、SortingGroup を使うと子オブジェクトは SortingGroup を持つ親の基準に従って描画されるようになります。そのため、子オブジェクトのSorting LayerやOrder in LayerはSorting Groupの中での相対的な順序として扱われるようになります。

どういうことかといいますと

SortingGroup を使わない場合

通常、SpriteRenderer を持つオブジェクトは親子関係があってもそれぞれ独立して描画順が決まるため、親より子が前に描画されるとは限りません。

例えば、プレイヤー (Player) に体・帽子・剣の3つのスプライトがあるとします。

Enemy (Sorting Order 4)
Player の体 (Sorting Order 0)
Player の帽子 (Sorting Order 5)
Player の剣 (Sorting Order 6)

この場合、敵 (Sorting Order 4) が体の前に描画されるが、帽子や剣より後ろに描画される可能性があり、違和感が生じます。

SortingGroup を使う場合

Player に SortingGroup を追加して Sorting Order を 5 にすると、プレイヤー全体が 1 つのグループとして扱われるようになります。

Enemy (Sorting Order 4)
Player (SortingGroup: Sorting Order 5)
├── Body (Sorting Order 0)
├── Hat (Sorting Order 5)
├── Sword (Sorting Order 6)

この場合、プレイヤー全体が敵の前に描画され、パーツの順番もグループ内で統一されます。

複数のSpriteRendererを使用してキャラクターを作成する場合はSorting Groupを使用するのが簡単かなと思います。