Selector de color

El selector completo conectado a una vista previa en vivo, al valor hex y a una fila de muestras guardadas.

El editor de arriba está ejecutando este proyecto. Cambia una línea y se recarga.

Clases de Godot usadas

ColorPickerColorRect

El código

scripts/main.gd
extends Node

var preview: ColorRect
var readout: Label
var swatches: HBoxContainer


func _ready() -> void:
	var row: HBoxContainer = _root()

	var picker: ColorPicker = ColorPicker.new()
	picker.color = Color('#8da5f3')
	picker.color_changed.connect(_on_color)
	row.add_child(picker)

	var column: VBoxContainer = VBoxContainer.new()
	column.add_theme_constant_override('separation', 16)
	column.size_flags_horizontal = Control.SIZE_EXPAND_FILL
	row.add_child(column)

	preview = ColorRect.new()
	preview.color = picker.color
	preview.custom_minimum_size = Vector2(0, 220)
	preview.size_flags_vertical = Control.SIZE_EXPAND_FILL
	column.add_child(preview)

	readout = Label.new()
	readout.add_theme_font_size_override('font_size', 22)
	column.add_child(readout)

	var keep: Button = Button.new()
	keep.text = 'keep this one'
	keep.pressed.connect(func(): _add_swatch(preview.color))
	column.add_child(keep)

	swatches = HBoxContainer.new()
	swatches.add_theme_constant_override('separation', 8)
	column.add_child(swatches)

	_on_color(picker.color)


func _on_color(color: Color) -> void:
	preview.color = color
	readout.text = '#%s   rgb %d %d %d' % [color.to_html(false), int(color.r * 255), int(color.g * 255), int(color.b * 255)]


func _add_swatch(color: Color) -> void:
	var swatch: ColorRect = ColorRect.new()
	swatch.color = color
	swatch.custom_minimum_size = Vector2(44, 44)
	swatches.add_child(swatch)


func _root() -> HBoxContainer:
	var background: ColorRect = ColorRect.new()
	background.color = Color('#12141a')
	add_child(background)
	background.set_anchors_and_offsets_preset(Control.PRESET_FULL_RECT)

	var margin: MarginContainer = MarginContainer.new()

	for side in ['margin_left', 'margin_right', 'margin_top', 'margin_bottom']:
		margin.add_theme_constant_override(side, 48)

	add_child(margin)
	margin.set_anchors_and_offsets_preset(Control.PRESET_FULL_RECT)

	var row: HBoxContainer = HBoxContainer.new()
	row.add_theme_constant_override('separation', 32)
	margin.add_child(row)

	return row

Más ejemplos de Interfaz