节点容器未启动

转载

小咪咪 2024-10-22 13:24:20

文章标签 节点容器未启动 godot gdscript 环形阵列自定义容器 文章分类 云原生云计算

概述

今天（2024年4月13日）在群里收到群友的提问，它想实现子节点的环形排布，当然按他的说法，它实际想要实现的是一个自动环形排列子控件的自定义容器。

节点容器未启动_自定义容器

好在我之前有自定义容器的经验，也马上想到可以用向量旋转获取圆上的定位。

实现2D节点环形阵列

在实现环形阵列容器之前，我首先测试了2D节点的子节点环形阵列。
创建如下场景：

节点容器未启动_环形阵列_02

以一个Node2D为根节点，添加6个Sprite2D，并赋予不同的图片，这里我以以前编写骰子组件使用的骰子6面图片+问号图片举例
将根节点尽量移动到视口矩形的中心，对所有Sprite2D进行了适当的等比缩放

根节点添加代码如下：

extends Node2D

var r:= 100.0   # 圆半径


func _ready() -> void:
  var step = get_child_count()   # 阵列的元素数目
	var t = Transform2D().translated(Vector2.RIGHT * r)   # 初始向量
	var ang = TAU/step             # 间隔角度
	
	for i in range(step):
		t = t.rotated(ang)   # 旋转向量
		get_child(i).transform = t * get_child(i).transform

上面代码中：

用根节点的一级子节点数目作为阵列的步骤数step，并计算出每次要旋转的角度ang
构造了一个变换t，它实际上是将某个点的位置向右移动到Vector2.RIGHT * r距离。
然后for循环遍历step次，每次对变换t施加旋转ang的操作
然后将当前变换实施到对应顺序的子节点上。

完成后的效果：

节点容器未启动_环形阵列_03

环形阵列容器

如果要应用于Control节点，则用上述方法则可能无法实现想要的结果。而且Control节点一般不需要旋转，只需要将矩形中心位移到相应的圆上就行。

所以这里我们自定义一个环形阵列容器CircleArrayContainer，用来自动化的环形排列其一级子控件。

完整代码如下：

@tool
extends Container
class_name CircleArrayContainer   # 环形阵列容器

var r:= 100.0:  # 圆半径
	set(val):
		r = val
		queue_sort()

func _init() -> void:
	# 容器尺寸发生变化时
	connect("resized",func():
		set("r",get_rect().size.y/2.0)  # 修改半径为1/2的高
	)

func _notification(what):
	var center = get_rect().get_center() # 容器中心点
	var a = Vector2.RIGHT * r
	match what:
		NOTIFICATION_SORT_CHILDREN:
			var step = get_child_count()   # 阵列的元素数目
			var ang = TAU/step             # 间隔角度
			for i in range(step):
				var b = a.rotated(ang * i)   # 旋转向量
				get_child(i).position = center + b - get_child(i).size/2.0

效果：

节点容器未启动_godot_04