More than 3 years have passed since last update.

【Godot】2Dゲームの描画順の制御方法

Godot

Last updated at 2021-02-14Posted at 2021-02-14

概要

この記事では、2Dゲーム作成時における描画順の制御方法について説明します。

z_index を使う方法

z_indexを使用するとお手軽に描画順を制御できます。
z_indexの値が大きいほど手前に描画され、z_indexの値が小さいほど奥に描画されます。

以下、簡単に検証用コードを書きます。

Spriteを作成

Spriteを作成し、"icon.png" をテクスチャに割り当てます。

そしてノード名を「Godot」に変更して、シーンとして保存します。

Mainシーンを作成

Godotくんを配置する Mainシーンを作成します。

2Dシーン(Node2D)を作成して名前を Main に変更します。

Godotくんを配置するスクリプトを作成

Mainシーンにスクリプトをアタッチして、以下のように記述します

Main.gd

extends Node2D

# Godotくん
var Godot = preload("res://Godot.tscn")

# 生成カウンタ
var idx = 0

func _process(delta: float) -> void:
    if Input.is_action_just_pressed("ui_accept"):
        # Godotくんを生成
        var gd = Godot.instance()

        # 16pxずつオフセットする
        gd.position = Vector2(idx*16, idx*16)

        # z_indexを設定
        gd.z_index = idx

        # シーンに追加する
        add_child(gd)

        # 生成カウンタを増やす
        idx += 1

Spaceキーを押すたびに、Godotくんを配置するスクリプトです。
実行すると、後に生成されるほど下に描画されることを確認します。

z_indexをマイナス方向に増やしてみる

z_indexをマイナス方向に増やすとどうなるかを見てみます。

Main.gd

extends Node2D

# Godotくん
var Godot = preload("res://Godot.tscn")

# 生成カウンタ
var idx = 0

func _process(delta: float) -> void:
    if Input.is_action_just_pressed("ui_accept"):
        # Godotくんを生成
        var gd = Godot.instance()

        # 16pxずつオフセットする
        gd.position = Vector2(idx*16, idx*16)

        # z_indexを設定
        gd.z_index = -idx # ※マイナスを設定

        # シーンに追加する
        add_child(gd)

        # 生成カウンタを増やす
        idx += 1