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