如何通过滑块控制Shader色调参数以修改精灵颜色？

问题背景 #

现有一个灰度化Shader，通过color uniform参数给灰度图上色，已实现随机颜色按钮功能，现在想通过滑块控制色调，编写了HueClass但出现报错：Invalid get index '2' (on base:GDscript)。

现有Shader代码 #

shader_type canvas_item;
uniform vec4 color : source_color;
void fragment(){
    vec4 pixelColor = texture(TEXTURE, UV);
    float brightness = (0.7 * pixelColor.r + 0.7 * pixelColor.g + 0.70 * pixelColor.b);
    vec4 greyScale = vec4(brightness, brightness, brightness, pixelColor.a);
    COLOR = greyScale * color;
}

随机颜色按钮代码 #

func _on_button_pressed():
    material.set_shader_parameter("color", Color(randf(), randf(), randf(), 1.0))

出错的色调控制代码 #

class HueClass:
    var red = Color(0.7607843137, 0.0823529412, 0.0823529412, 1.0); // 仅定义了红色

var ShaderParam = preload("res://...")

func _on_hue_value_changed(value):
    HueClass[value]
    if value == 0:
        ShaderParam.set_shader_parameter("color",HueClass.red)
    print(value)

错误原因 #

1. 错误的类访问方式：HueClass是类定义，不是数组或字典，不能用HueClass[value]这种索引方式访问。即使要访问类成员，也需要先实例化类，但你只定义了red一个成员，当滑块值不为0时根本没有对应变量。
2. 滑块值与变量不匹配：滑块返回的value是数字（比如2），但你的HueClass里没有名为2的成员，所以触发索引错误。

解决方案 #

方案1：用数组存储预设颜色（适合固定色调） #

直接用数组存储需要的彩虹色，索引对应滑块值：

1. 替换HueClass为颜色数组：

# 索引对应滑块值，按需添加更多颜色
var hue_colors = [
    Color(0.760784, 0.082353, 0.082353, 1.0), # 红色（滑块值0）
    Color(0.960784, 0.65098, 0.082353, 1.0), # 橙色（滑块值1）
    Color(0.960784, 0.960784, 0.082353, 1.0), # 黄色（滑块值2）
    Color(0.082353, 0.960784, 0.082353, 1.0), # 绿色（滑块值3）
    Color(0.082353, 0.65098, 0.960784, 1.0), # 蓝色（滑块值4）
    Color(0.65098, 0.082353, 0.960784, 1.0), # 紫色（滑块值5）
]

2. 设置滑块参数：最小值0，最大值设为hue_colors.size() - 1，步长1。
3. 修改滑块回调函数：

# 提前获取精灵的材质（替换$Sprite为你的精灵节点路径）
var sprite_material = $Sprite.get_material_override()

func _on_hue_value_changed(value):
    # 确保value在数组索引范围内
    if value >= 0 and value < hue_colors.size():
        sprite_material.set_shader_parameter("color", hue_colors[value])
    print(value)

方案2：通过HSV动态生成颜色（灵活覆盖全色调） #

不需要手动定义颜色，用Color.from_hsv方法直接通过滑块值生成对应色调：

1. 设置滑块参数：最小值0，最大值1，步长0.01（实现平滑过渡）。
2. 修改滑块回调函数：

var sprite_material = $Sprite.get_material_override()

func _on_hue_value_changed(value):
    # value为0-1的Hue值，饱和度(1.0)、亮度(0.4)可按需调整，alpha=1
    var target_color = Color.from_hsv(value, 1.0, 0.4, 1.0)
    sprite_material.set_shader_parameter("color", target_color)

内容的提问来源于stack exchange，提问作者StinkyGuyJeff