Adds experimental drag and drop example

This is functional drag and drop mockup for toolset base.  Much taken from: https://github.com/exploregamedev/Godot-demos
This commit is contained in:
MacDugRPG 2023-04-16 16:08:11 -04:00
parent 3505214043
commit 6a657bc793
14 changed files with 409 additions and 0 deletions

View File

@ -0,0 +1,3 @@
source_md5="47313fa4c47a9963fddd764e1ec6e4a8"
dest_md5="26ea799ea0a3da9e753b3ebe822e0570"

View File

@ -0,0 +1,2 @@
# Intro to Godot drag and drop for Controls

View File

@ -0,0 +1,7 @@
[gd_resource type="Environment" load_steps=2 format=2]
[sub_resource type="ProceduralSky" id=1]
[resource]
background_mode = 2
background_sky = SubResource( 1 )

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

View File

@ -0,0 +1,35 @@
[remap]
importer="texture"
type="StreamTexture"
path="res://.import/icon.png-487276ed1e3a0c39cad0279d744ee560.stex"
metadata={
"vram_texture": false
}
[deps]
source_file="res://icon.png"
dest_files=[ "res://.import/icon.png-487276ed1e3a0c39cad0279d744ee560.stex" ]
[params]
compress/mode=0
compress/lossy_quality=0.7
compress/hdr_mode=0
compress/bptc_ldr=0
compress/normal_map=0
flags/repeat=0
flags/filter=true
flags/mipmaps=false
flags/anisotropic=false
flags/srgb=2
process/fix_alpha_border=true
process/premult_alpha=false
process/HDR_as_SRGB=false
process/invert_color=false
process/normal_map_invert_y=false
stream=false
size_limit=0
detect_3d=true
svg/scale=1.0

View File

@ -0,0 +1,37 @@
; Engine configuration file.
; It's best edited using the editor UI and not directly,
; since the parameters that go here are not all obvious.
;
; Format:
; [section] ; section goes between []
; param=value ; assign values to parameters
config_version=4
_global_script_classes=[ {
"base": "ColorRect",
"class": "Draggable",
"language": "GDScript",
"path": "res://toolset_test/draggable_final.gd"
} ]
_global_script_class_icons={
"Draggable": ""
}
[application]
config/name="Experiment_Drag_and_Drop"
run/main_scene="res://toolset_test/drag_and_drop_demo_final.tscn"
config/icon="res://icon.png"
[gui]
common/drop_mouse_on_gui_input_disabled=true
[physics]
common/enable_pause_aware_picking=true
[rendering]
environment/default_environment="res://default_env.tres"

View File

@ -0,0 +1,201 @@
[gd_scene load_steps=10 format=2]
[ext_resource path="res://Cabin-VariableFont_wdth,wght.ttf" type="DynamicFontData" id=1]
[ext_resource path="res://toolset_test/source_container.gd" type="Script" id=2]
[ext_resource path="res://toolset_test/target_container_final.gd" type="Script" id=3]
[sub_resource type="StyleBoxFlat" id=5]
bg_color = Color( 0, 0, 0, 1 )
[sub_resource type="DynamicFont" id=4]
size = 32
font_data = ExtResource( 1 )
[sub_resource type="StyleBoxFlat" id=7]
bg_color = Color( 0.760784, 0.760784, 0.760784, 1 )
[sub_resource type="StyleBoxFlat" id=6]
bg_color = Color( 1, 1, 1, 1 )
[sub_resource type="StyleBoxFlat" id=2]
[sub_resource type="StyleBoxFlat" id=3]
bg_color = Color( 1, 1, 1, 1 )
[node name="DragAndDropDemo" type="PanelContainer"]
anchor_right = 1.0
anchor_bottom = 1.0
[node name="VLayout" type="VBoxContainer" parent="."]
margin_left = 7.0
margin_top = 7.0
margin_right = 1017.0
margin_bottom = 593.0
__meta__ = {
"_edit_use_anchors_": false
}
[node name="DescriptionHeader" type="HBoxContainer" parent="VLayout"]
margin_right = 1010.0
margin_bottom = 50.0
rect_min_size = Vector2( 0, 50 )
__meta__ = {
"_edit_use_anchors_": false
}
[node name="M1H" type="Panel" parent="VLayout/DescriptionHeader"]
margin_right = 250.0
margin_bottom = 50.0
rect_min_size = Vector2( 250, 50 )
custom_styles/panel = SubResource( 5 )
[node name="Menu One" type="Label" parent="VLayout/DescriptionHeader/M1H"]
anchor_right = 1.0
anchor_bottom = 1.0
custom_fonts/font = SubResource( 4 )
text = "Menu 1"
align = 1
valign = 1
[node name="M2H" type="Panel" parent="VLayout/DescriptionHeader"]
margin_left = 254.0
margin_right = 502.0
margin_bottom = 50.0
size_flags_horizontal = 3
custom_styles/panel = SubResource( 5 )
[node name="MenuTwo" type="Label" parent="VLayout/DescriptionHeader/M2H"]
anchor_right = 1.0
anchor_bottom = 1.0
custom_fonts/font = SubResource( 4 )
text = "Menu 2"
align = 1
valign = 1
[node name="M3H" type="Panel" parent="VLayout/DescriptionHeader"]
margin_left = 506.0
margin_right = 756.0
margin_bottom = 50.0
rect_min_size = Vector2( 250, 0 )
custom_styles/panel = SubResource( 5 )
[node name="Menu3Label" type="Label" parent="VLayout/DescriptionHeader/M3H"]
anchor_right = 1.0
anchor_bottom = 1.0
custom_fonts/font = SubResource( 4 )
text = "Menu 3"
align = 1
valign = 1
[node name="M4H" type="Panel" parent="VLayout/DescriptionHeader"]
margin_left = 760.0
margin_right = 1010.0
margin_bottom = 50.0
rect_min_size = Vector2( 250, 0 )
custom_styles/panel = SubResource( 5 )
[node name="Menu4Label" type="Label" parent="VLayout/DescriptionHeader/M4H"]
anchor_right = 1.0
anchor_bottom = 1.0
custom_fonts/font = SubResource( 4 )
text = "Menu 4"
align = 1
valign = 1
[node name="ToolsOptions" type="HBoxContainer" parent="VLayout"]
margin_top = 54.0
margin_right = 1010.0
margin_bottom = 104.0
rect_min_size = Vector2( 0, 50 )
__meta__ = {
"_edit_use_anchors_": false
}
[node name="ToolsContainer" type="Panel" parent="VLayout/ToolsOptions"]
margin_right = 1010.0
margin_bottom = 50.0
rect_min_size = Vector2( 1010, 50 )
custom_styles/panel = SubResource( 7 )
script = ExtResource( 2 )
[node name="Padding" type="MarginContainer" parent="VLayout/ToolsOptions/ToolsContainer"]
margin_right = 1005.0
margin_bottom = 47.0
rect_min_size = Vector2( 1005, 0 )
[node name="Columns" type="HBoxContainer" parent="VLayout/ToolsOptions/ToolsContainer/Padding"]
margin_right = 1005.0
margin_bottom = 47.0
rect_min_size = Vector2( 1005, 0 )
[node name="DragAndDropColumns" type="HBoxContainer" parent="VLayout"]
margin_top = 108.0
margin_right = 1010.0
margin_bottom = 586.0
size_flags_vertical = 3
__meta__ = {
"_edit_use_anchors_": false
}
[node name="SourceContainer" type="Panel" parent="VLayout/DragAndDropColumns"]
margin_right = 175.0
margin_bottom = 478.0
rect_min_size = Vector2( 175, 0 )
custom_styles/panel = SubResource( 6 )
[node name="Padding" type="MarginContainer" parent="VLayout/DragAndDropColumns/SourceContainer"]
anchor_right = 1.0
anchor_bottom = 1.0
margin_right = -1.0
custom_constants/margin_right = 20
custom_constants/margin_top = 20
custom_constants/margin_left = 20
custom_constants/margin_bottom = 20
[node name="Rows" type="VBoxContainer" parent="VLayout/DragAndDropColumns/SourceContainer/Padding"]
margin_left = 20.0
margin_top = 20.0
margin_right = 154.0
margin_bottom = 458.0
custom_constants/separation = 15
__meta__ = {
"_edit_use_anchors_": false
}
[node name="CanvasContainer" type="Panel" parent="VLayout/DragAndDropColumns"]
margin_left = 179.0
margin_right = 831.0
margin_bottom = 478.0
size_flags_horizontal = 3
custom_styles/panel = SubResource( 2 )
script = ExtResource( 3 )
[node name="Padding" type="MarginContainer" parent="VLayout/DragAndDropColumns/CanvasContainer"]
anchor_right = 1.0
anchor_bottom = 1.0
margin_left = 1.0
margin_top = -5.0
margin_right = -2.0
margin_bottom = -1.0
mouse_filter = 1
custom_constants/margin_right = 20
custom_constants/margin_top = 20
custom_constants/margin_left = 20
custom_constants/margin_bottom = 20
[node name="Rows" type="VBoxContainer" parent="VLayout/DragAndDropColumns/CanvasContainer/Padding"]
margin_left = 20.0
margin_top = 20.0
margin_right = 629.0
margin_bottom = 462.0
custom_constants/separation = 15
__meta__ = {
"_edit_use_anchors_": false
}
[node name="DetailsContainer" type="Panel" parent="VLayout/DragAndDropColumns"]
margin_left = 835.0
margin_right = 1010.0
margin_bottom = 478.0
rect_min_size = Vector2( 175, 0 )
custom_styles/panel = SubResource( 3 )

View File

@ -0,0 +1,26 @@
[gd_scene load_steps=4 format=2]
[ext_resource path="res://Cabin-VariableFont_wdth,wght.ttf" type="DynamicFontData" id=1]
[ext_resource path="res://toolset_test/draggable_final.gd" type="Script" id=2]
[sub_resource type="DynamicFont" id=6]
size = 24
font_data = ExtResource( 1 )
[node name="Draggable" type="ColorRect"]
margin_right = 210.0
margin_bottom = 50.0
rect_min_size = Vector2( 210, 50 )
color = Color( 0.752941, 0.305882, 0.305882, 1 )
script = ExtResource( 2 )
[node name="Label" type="Label" parent="."]
anchor_right = 1.0
anchor_bottom = 1.0
custom_fonts/font = SubResource( 6 )
text = "Drag Me"
align = 1
valign = 1
__meta__ = {
"_edit_use_anchors_": false
}

View File

@ -0,0 +1,42 @@
extends ColorRect
class_name Draggable
var id: int
var label: String
# set this to true once we've been dropped on our target
var dropped_on_target: bool = false
func _ready() -> void:
add_to_group("DRAGGABLE")
$Label.text = label
func get_drag_data(_position: Vector2):
print("[Draggable] get_drag_data has run")
if not dropped_on_target:
set_drag_preview(_get_preview_control())
return self
func _on_item_dropped_on_target(draggable):
print("[Draggable] Signal item_dropped_on_target received")
if draggable.get("id") != id:
return
print("[Draggable] Iven been dropped, removing myself from source container")
queue_free()
func _get_preview_control() -> Control:
"""
The preview control must not be in the scene tree. You should not free the control, and
you should not keep a reference to the control beyond the duration of the drag.
It will be deleted automatically after the drag has ended.
"""
var preview = ColorRect.new()
preview.rect_size = rect_size
var preview_color = color
preview_color.a = .5
preview.color = preview_color
preview.set_rotation(.1) # in readians
return preview

View File

@ -0,0 +1,31 @@
extends Panel
onready var drop_target = get_node("/root/DragAndDropDemo/VLayout/DragAndDropColumns/CanvasContainer")
onready var draggable_scene: PackedScene = preload("res://toolset_test/draggable.tscn")
onready var draggable_container = $Padding/Columns
var dragables = [
{"id": 1, "label": "dialog"},
{"id": 2, "label": "object"},
{"id": 3, "label": "encounter"}
]
func _ready() -> void:
drop_target.connect("item_dropped_on_target", self, "_on_item_dropped_on_target")
_populate_dragables()
func _populate_dragables():
for dragable in dragables:
var drag_item = draggable_scene.instance()
drag_item.id = dragable["id"]
drag_item.label = dragable["label"]
draggable_container.add_child(drag_item)
func _on_item_dropped_on_target(dropped_item: Draggable) -> void:
for drag_item in draggable_container.get_children():
drag_item = (drag_item as Draggable)
if drag_item.id == dropped_item.id:
#draggable_container.remove_child(drag_item)
#drag_item.queue_free()
break

View File

@ -0,0 +1,24 @@
extends Panel
signal item_dropped_on_target(draggable)
var draggable: PackedScene = preload("res://toolset_test/draggable.tscn")
func can_drop_data(position: Vector2, data) -> bool:
var can_drop: bool = data is Node and data.is_in_group("DRAGGABLE")
print("[TargetContainer] can_drop_data has run, returning %s" % can_drop)
return can_drop
func drop_data(position: Vector2, data) -> void:
print("[TargetContainer] drop_data has run")
print("[TargetContainer] Emiting signal: item_dropped_on_target")
#DKM TEMP: here we'd open wizard or create new item.
var draggable_copy: ColorRect = draggable.instance()
draggable_copy.id = data.id
draggable_copy.label = data.label
draggable_copy.dropped_on_target = true # disable further dragging
$Padding/Rows.add_child(draggable_copy)
emit_signal("item_dropped_on_target", data)