6.GodotCanvasItem、Node2D及自定义节点

原创最新推荐文章于 2026-04-08 10:35:43 发布 2.6k 阅读 AI写同款

收录于

Godot引擎学习

ChoSeitaku

码龄5年墨衍会员 · AI 创作全网分发

3452粉丝557篇原创

关注

Godot4节点树右键菜单添加自定义选项至此原理就讲完了，浪费了两天时间，提高了查看源码的能力。阅读详情

AI摘要

本文详细介绍了Godot游戏引擎中的CanvasItem节点，它继承了Node的功能，用于2D图形绘制。讲解了节点的可视性、Modulate和self_modulate、LightMask与Light2D配合、Material和Shader等概念，以及如何通过自定义节点和脚本来扩展和重写节点功能。,

CanvasItem节点

![[Pasted image 20240415213917.png]]

CanvasItem节点，CanvasItem -> Node，所以CanvasItem继承了Node的所有功能
Canvas是画布的意思，所以CanvasItem代表了就是可以被绘制的节点，可以设置可视化界面和材质的颜色
所有的2D节点和GUI节点都继承于CanvasItem节点
CanvasItem是按树的树的深度优先遍历顺序绘制的
可以通过设置CanvasItem的Show Behind Parent来改变最终渲染到屏幕上的画面顺序

Visible

设置精灵节点的可视化
![[Pasted image 20240415214419.png]]

目前有两个精灵节点
子节点在父节点的上方
![[Pasted image 20240415214503.png]]

选中子节点，打开Show_behind_parent
![[Pasted image 20240415214526.png]]

modulate

附加在CanvasItem上的一个贴图
![[Pasted image 20240415214606.png]]

![[Pasted image 20240415214840.png]]

modulate改变颜色，就相当于给物体额外添加了一个颜色，相当于光线，额外的颜色附加在物体表面
![[Pasted image 20240415214855.png]]

self_modulate

仅仅给自己改变物体的颜色贴图
![[Pasted image 20240415215103.png]]

如果是Modulate，给父节点改变颜色，子节点也会跟着改变颜色
如果使用self_modulate，给父节点改变颜色，仅仅是父节点会改变颜色

light_mask

![[Pasted image 20240415215415.png]]

和Light2D节点配合使用
![[Pasted image 20240415215759.png]]

添加一个Light2D节点，PointLight2D
导入一张png图片添加到Texture里
![[Pasted image 20240415215912.png]]

![[Pasted image 20240415215956.png]]

可以看到添加到PointLight2D的图片被投影到Sprite节点里
![[Pasted image 20240415220708.png]]

在Light2D属性Range里可以改变层级
![[Pasted image 20240415220937.png]]

切换到2的话，就发现光线投影不到物体上了
![[Pasted image 20240415221434.png]]

material

![[Pasted image 20240415222133.png]]

Material 材质，物体的质地，指色彩，纹理，光滑度，透明度，反射率，折射率，发光度。实际就是Shader
Texture 贴图，附加到物体表面的贴图
Shader 着色器，使用代码来渲染图形的技术，可以控制GPU运算图像效果的一段代码

![[Pasted image 20240415222436.png]]

新建一个material
通过改变模式，图片也会发生改变
material材质，改变物体表面的属性的一种贴图，和modulate有点类似
material是一种更复杂的材质

use_parent_material

![[Pasted image 20240415222644.png]]

如果勾选，所有子节点都是使用这个材质，让子节点也使用父节点的material，是一种继承

Ordering

z_index
![[Pasted image 20240415223252.png]]

z_index更大的话，显示会在更前面
![[Pasted image 20240415223745.png]]

原本在底下的精灵节点，将index改为1，比另一张0的大，变为显示i在上面
这个z_index是三维方向的，场景对于屏幕方向有一个z轴，z越大往屏幕越近，显示在最上面

当这两个节点称为父子关系时
![[Pasted image 20240415224049.png]]

这个z_as_relative是默认启用的
如果父节点的z_index值是1
那么子节点z_index虽然显示是0
但是因为z_as_relative是勾选上的，就相当于是0+1，其实也是1，和平常的父子节点显示没有区别，子节点在父节点上面，因为就是相对的一个关系
如果不想弄成相对位置，就把z_as_relative勾掉，这样父节点就到了子节点上面了

Node2D节点

Node2D节点，Node2d -> CanvasItem -> Node

Node2D节点继承于CanvasItem节点，CanvasItem节点继承于Node节点，所以Node2D节点包括了CanvasItem节点和Node节点的所有功能

![[Pasted image 20240415223145.png]]

Transform ，Node2d节点的基本属性，在后面的脚本编程中，Transform属性是最常用的
表示：

Position 位置
Rotation 旋转
Scale 缩放

自定义节点

当发现现有的节点无法支持新的需求的时候，有两种方法去解决，自定义节点或者自定义脚本，核心都是脚本
创建GdScrip脚本，叫MyNode，继承Node2D节点，并自定义节点的icon

@icon("res://icon.svg")

extends Node2D

class_name MyNode

func _ready():
	print("my custom node")
	pass

编写脚本，定义变量，编写代码

@export var a: int = 1
@export var b: String

保存，如果不保存无法看到我们创建到的节点，这一点需要特别注意
添加刚刚创建的自定义节点

![[Pasted image 20240415224831.png]]

有两个变量a和b就是刚才脚本里定义的变量
![[Pasted image 20240415224950.png]]

输出my custom node

![[Pasted image 20240415225103.png]]

class_name 表示自定义节点的名称
@icon 表示使用的icon
7、8行是定义的两个变量，并让这两个变量导出，可以在外部编辑器使用
11行代码，输出变量
3行，继承Node2D节点

节点继承

通过继承现有节点，来改变已有节点的功能
无论是自定义节点还是节点继承，核心都通过脚本控制达到自己想要的效果
MyNode节点继承自Node2D节点，项目中看到就是这个节点多了两个变量，Node2D的某些功能被拓展了

将MyNode脚本修改
![[Pasted image 20240415225844.png]]

改为继承Sprite2D节点，让region_enabled默认等于true
region_enabled是在Sprite节点中定义的
继承了Sprite过后，就可以重写Sprite的功能

如何通过脚本去改变节点的功能

新建一个my_script节点
![[Pasted image 20240415230219.png]]

同样修改脚本
![[Pasted image 20240415230248.png]]

然后将这个脚本挂载到Sprite节点的脚本属性上
就改变了Script的现有功能

标签

#游戏引擎 #godot

Godot后期处理概述：一组着色器和一个自定义相机节点，可轻松将后期处理轮廓集成到您的游戏中。适用于2D和3D游戏 Godot发布流程大纲这是Godot Engine的附加组件，其中包括两个着色器和一个自定义相机节点，可轻松在2D和3D游戏中使用基于后处理的轮廓（尽管它们通常在3D游戏中使用较多）。这些是我用来在我自己的Godot游戏中获得大部分轮廓的相同着色器和相同方法： Windward Rush ，您可以在下面看到（并在Twitter上进行更新： : ）。为什么要使用后处理轮廓？我经常看到的建议在Godot中绘制轮廓的方法通常是以下方式的一种变化：在材质上添加额外的绘制通道，以纯色的正面剔除来绘制对象的稍大版本。这在很多情况下都有效，并且在Godot中非常容易实现，但是有一些限制。首先，这取决于所使用的模型及其法线的设置方式，可能会导致伪影，例如下图中所示的伪影，其中轮廓线不接触。有时，可以通过使用MeshInstance节点中的“ Create Outline Mesh.. 立即下载