Improvements to Animation Tags

src/Classes/Project.gd

@@ -579,7 +579,7 @@ func animation_tags_changed(value : Array) -> void:
 		child.queue_free()
 
 	for tag in animation_tags:
-		var tag_base_size = Global.animation_timeline.cel_size + 3
+		var tag_base_size = Global.animation_timeline.cel_size + 4
 		var tag_c : Container = animation_tag_node.instance()
 		Global.tag_container.add_child(tag_c)
 		tag_c.tag = tag
@@ -589,9 +589,10 @@ func animation_tags_changed(value : Array) -> void:
 		tag_c.get_node("Label").modulate = tag.color
 		tag_c.get_node("Line2D").default_color = tag.color
 
-		tag_c.rect_position.x = (tag.from - 1) * tag_base_size + tag.from
+		tag_c.rect_position.x = (tag.from - 1) * tag_base_size + 1 # Added 1 to answer to get starting position of next cel
 		var tag_size : int = tag.to - tag.from
-		tag_c.rect_min_size.x = (tag_size + 1) * tag_base_size
+		tag_c.rect_min_size.x = (tag_size + 1) * tag_base_size - 4 # We dont need the 4 pixels at the end of last cel
+		tag_c.rect_position.y = 1 # To make top line of tag visible
 		tag_c.get_node("Line2D").points[2] = Vector2(tag_c.rect_min_size.x, 0)
 		tag_c.get_node("Line2D").points[3] = Vector2(tag_c.rect_min_size.x, 32)
 

src/UI/Timeline/AnimationTimeline.gd

@@ -56,12 +56,12 @@ func cel_size_changed(value : int) -> void:
 		frame_id.rect_size.x = cel_size
 
 	for tag_c in Global.tag_container.get_children():
-		var tag_base_size = cel_size + 3
+		var tag_base_size = cel_size + 4
 		var tag : AnimationTag = tag_c.tag
-		tag_c.rect_position.x = (tag.from - 1) * tag_base_size + tag.from
+		tag_c.rect_position.x = (tag.from - 1) * tag_base_size + 1 # Added 1 to answer to get starting position of next cel
 		var tag_size : int = tag.to - tag.from
-		tag_c.rect_min_size.x = (tag_size + 1) * tag_base_size
-		tag_c.rect_size.x = (tag_size + 1) * tag_base_size
+		tag_c.rect_min_size.x = (tag_size + 1) * tag_base_size - 4 # We dont need the 4 pixels at the end of last cel
+		tag_c.rect_size.x = (tag_size + 1) * tag_base_size - 4 # We dont need the 4 pixels at the end of last cel
 		tag_c.get_node("Line2D").points[2] = Vector2(tag_c.rect_min_size.x, 0)
 		tag_c.get_node("Line2D").points[3] = Vector2(tag_c.rect_min_size.x, 32)
 

src/UI/Timeline/AnimationTimeline.tscn

@@ -158,9 +158,7 @@ margin_bottom = 25.0
 size_flags_vertical = 0
 custom_constants/separation = 9
 
-[node name="AddLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=[
-"UIButtons",
-]]
+[node name="AddLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=["UIButtons"]]
 margin_right = 22.0
 margin_bottom = 22.0
 rect_min_size = Vector2( 22, 22 )
@@ -184,9 +182,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="RemoveLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=[
-"UIButtons",
-]]
+[node name="RemoveLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=["UIButtons"]]
 margin_left = 31.0
 margin_right = 53.0
 margin_bottom = 22.0
@@ -212,9 +208,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="MoveUpLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=[
-"UIButtons",
-]]
+[node name="MoveUpLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=["UIButtons"]]
 margin_left = 62.0
 margin_right = 84.0
 margin_bottom = 22.0
@@ -240,9 +234,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="MoveDownLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=[
-"UIButtons",
-]]
+[node name="MoveDownLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=["UIButtons"]]
 margin_left = 93.0
 margin_right = 115.0
 margin_bottom = 22.0
@@ -268,9 +260,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="CloneLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=[
-"UIButtons",
-]]
+[node name="CloneLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=["UIButtons"]]
 margin_left = 124.0
 margin_right = 146.0
 margin_bottom = 22.0
@@ -295,9 +285,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="MergeDownLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=[
-"UIButtons",
-]]
+[node name="MergeDownLayer" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/LayerButtonPanelContainer/LayerButtons" groups=["UIButtons"]]
 margin_left = 155.0
 margin_right = 177.0
 margin_bottom = 22.0
@@ -348,9 +336,7 @@ alignment = 2
 margin_right = 140.0
 margin_bottom = 24.0
 
-[node name="AddFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=[
-"UIButtons",
-]]
+[node name="AddFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=["UIButtons"]]
 margin_top = 2.0
 margin_right = 20.0
 margin_bottom = 22.0
@@ -375,9 +361,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="DeleteFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=[
-"UIButtons",
-]]
+[node name="DeleteFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=["UIButtons"]]
 margin_left = 24.0
 margin_top = 2.0
 margin_right = 44.0
@@ -405,9 +389,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="CopyFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=[
-"UIButtons",
-]]
+[node name="CopyFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=["UIButtons"]]
 margin_left = 48.0
 margin_top = 2.0
 margin_right = 68.0
@@ -433,9 +415,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="FrameTagButton" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=[
-"UIButtons",
-]]
+[node name="FrameTagButton" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=["UIButtons"]]
 margin_left = 72.0
 margin_top = 2.0
 margin_right = 92.0
@@ -461,9 +441,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="MoveLeft" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=[
-"UIButtons",
-]]
+[node name="MoveLeft" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=["UIButtons"]]
 margin_left = 96.0
 margin_top = 2.0
 margin_right = 116.0
@@ -490,9 +468,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="MoveRight" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=[
-"UIButtons",
-]]
+[node name="MoveRight" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/FrameButtons" groups=["UIButtons"]]
 margin_left = 120.0
 margin_top = 2.0
 margin_right = 140.0
@@ -523,9 +499,7 @@ margin_left = 180.0
 margin_right = 320.0
 margin_bottom = 24.0
 
-[node name="FirstFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=[
-"UIButtons",
-]]
+[node name="FirstFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=["UIButtons"]]
 margin_top = 2.0
 margin_right = 20.0
 margin_bottom = 22.0
@@ -551,9 +525,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="PreviousFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=[
-"UIButtons",
-]]
+[node name="PreviousFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=["UIButtons"]]
 margin_left = 24.0
 margin_top = 2.0
 margin_right = 44.0
@@ -580,9 +552,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="PlayBackwards" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=[
-"UIButtons",
-]]
+[node name="PlayBackwards" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=["UIButtons"]]
 margin_left = 48.0
 margin_top = 2.0
 margin_right = 68.0
@@ -610,9 +580,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="PlayForward" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=[
-"UIButtons",
-]]
+[node name="PlayForward" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=["UIButtons"]]
 margin_left = 72.0
 margin_top = 2.0
 margin_right = 92.0
@@ -641,9 +609,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="NextFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=[
-"UIButtons",
-]]
+[node name="NextFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=["UIButtons"]]
 margin_left = 96.0
 margin_top = 2.0
 margin_right = 116.0
@@ -670,9 +636,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="LastFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=[
-"UIButtons",
-]]
+[node name="LastFrame" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/PlaybackButtons" groups=["UIButtons"]]
 margin_left = 120.0
 margin_top = 2.0
 margin_right = 140.0
@@ -704,9 +668,7 @@ margin_left = 360.0
 margin_right = 498.0
 margin_bottom = 24.0
 
-[node name="OnionSkinningSettings" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/LoopButtons" groups=[
-"UIButtons",
-]]
+[node name="OnionSkinningSettings" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/LoopButtons" groups=["UIButtons"]]
 margin_top = 2.0
 margin_right = 12.0
 margin_bottom = 22.0
@@ -732,9 +694,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="OnionSkinning" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/LoopButtons" groups=[
-"UIButtons",
-]]
+[node name="OnionSkinning" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/LoopButtons" groups=["UIButtons"]]
 margin_left = 16.0
 margin_top = 2.0
 margin_right = 36.0
@@ -761,9 +721,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="LoopAnim" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/LoopButtons" groups=[
-"UIButtons",
-]]
+[node name="LoopAnim" type="Button" parent="MarginContainer/AnimationContainer/TimelineContainer/TimelineButtons/PanelContainer/AnimationButtons/LoopButtons" groups=["UIButtons"]]
 margin_left = 40.0
 margin_top = 2.0
 margin_right = 60.0
@@ -859,6 +817,7 @@ margin_left = 219.0
 margin_right = 902.0
 margin_bottom = 32.0
 rect_min_size = Vector2( 0, 32 )
+mouse_filter = 2
 size_flags_horizontal = 3
 theme = SubResource( 20 )
 scroll_vertical_enabled = false

src/UI/Timeline/FrameTagDialog.gd

@@ -65,6 +65,7 @@ func _on_AddTag_pressed() -> void:
 	current_tag_id = Global.current_project.animation_tags.size()
 	options_dialog.get_node("GridContainer/FromSpinBox").value = Global.current_project.current_frame + 1
 	options_dialog.get_node("GridContainer/ToSpinBox").value = Global.current_project.current_frame + 1
+	options_dialog.get_node("GridContainer/ColorPickerButton").color = Color(randf(),randf(),randf())
 
 
 func _on_EditButton_pressed(_tag_id : int) -> void: