Refactor the demos to support screen resizing

Add BackgroudLayer and DemoInterface scenes that we can reuse across demos
Set the game to 2D and extend window modes

Part of #21

project/demos/Arrive/ArriveDemo.tscn

@@ -1,9 +1,9 @@
 [gd_scene load_steps=7 format=2]
 
 [ext_resource path="res://demos/Arrive/Arriver.gd" type="Script" id=1]
-[ext_resource path="res://assets/theme/gdquest.theme" type="Theme" id=2]
+[ext_resource path="res://demos/Utils/DemoInterface.tscn" type="PackedScene" id=2]
 [ext_resource path="res://demos/Arrive/ArriveDemo.gd" type="Script" id=3]
-[ext_resource path="res://assets/sprites/background.png" type="Texture" id=5]
+[ext_resource path="res://demos/Utils/BackgroudLayer.tscn" type="PackedScene" id=4]
 [ext_resource path="res://demos/Utils/CircleDraw.gd" type="Script" id=6]
 
 [sub_resource type="CircleShape2D" id=1]
@@ -12,12 +12,7 @@ radius = 16.0
 [node name="ArriveDemo" type="Node2D"]
 script = ExtResource( 3 )
 
-[node name="BackgroudLayer" type="CanvasLayer" parent="."]
+[node name="BackgroudLayer" parent="." instance=ExtResource( 4 )]
-layer = -1
-
-[node name="Background" type="Sprite" parent="BackgroudLayer"]
-texture = ExtResource( 5 )
-centered = false
 
 [node name="Arriver" type="KinematicBody2D" parent="."]
 show_behind_parent = true
@@ -31,29 +26,4 @@ inner_color = Color( 0.235294, 0.639216, 0.439216, 1 )
 outer_color = Color( 0.560784, 0.870588, 0.364706, 1 )
 stroke = 4.0
 
-[node name="GUI" type="PanelContainer" parent="."]
+[node name="DemoInterface" parent="." instance=ExtResource( 2 )]
-anchor_right = 1.0
-margin_right = 1024.0
-margin_bottom = 87.0
-rect_min_size = Vector2( 1024, 0 )
-theme = ExtResource( 2 )
-__meta__ = {
-"_edit_use_anchors_": false
-}
-
-[node name="MarginContainer" type="MarginContainer" parent="GUI"]
-margin_right = 1024.0
-margin_bottom = 87.0
-
-[node name="RichTextLabel" type="RichTextLabel" parent="GUI/MarginContainer"]
-margin_left = 16.0
-margin_top = 16.0
-margin_right = 1008.0
-margin_bottom = 71.0
-rect_min_size = Vector2( 0, 55 )
-bbcode_enabled = true
-bbcode_text = "Arrive Demo
-Mouse click to make the [color=lime]green \"Player\"[/color] move to the [color=fuchsia]purple target[/color]"
-text = "Arrive Demo
-Mouse click to make the green \"Player\" move to the purple target"
-scroll_active = false

project/demos/AvoidCollisions/AvoidCollisionsDemo.gd

@@ -1,4 +1,4 @@
-extends Node2D
+extends Node
 
 
 export(float, 0, 2000, 40) var linear_speed_max := 350.0 setget set_linear_speed_max

project/demos/AvoidCollisions/AvoidCollisionsDemo.tscn

@@ -3,19 +3,14 @@
 [ext_resource path="res://demos/AvoidCollisions/Spawner.gd" type="Script" id=1]
 [ext_resource path="res://demos/AvoidCollisions/AvoidCollisionsDemo.gd" type="Script" id=2]
 [ext_resource path="res://demos/AvoidCollisions/Avoider.tscn" type="PackedScene" id=3]
-[ext_resource path="res://assets/theme/gdquest.theme" type="Theme" id=4]
+[ext_resource path="res://demos/Utils/DemoInterface.tscn" type="PackedScene" id=4]
-[ext_resource path="res://assets/sprites/background.png" type="Texture" id=5]
+[ext_resource path="res://demos/Utils/BackgroudLayer.tscn" type="PackedScene" id=5]
 
-[node name="AvoidCollisionsDemo" type="Node2D"]
+[node name="AvoidCollisionsDemo" type="Node"]
 script = ExtResource( 2 )
 proximity_radius = 100.0
 
-[node name="BackgroudLayer" type="CanvasLayer" parent="."]
+[node name="BackgroudLayer" parent="." instance=ExtResource( 5 )]
-layer = -1
-
-[node name="Background" type="Sprite" parent="BackgroudLayer"]
-texture = ExtResource( 5 )
-centered = false
 
 [node name="Spawner" type="Node2D" parent="."]
 script = ExtResource( 1 )
@@ -23,27 +18,6 @@ avoider_template = ExtResource( 3 )
 inner_color = Color( 0.235294, 0.639216, 0.439216, 1 )
 outer_color = Color( 0.560784, 0.870588, 0.364706, 1 )
 
-[node name="GUI" type="PanelContainer" parent="."]
+[node name="DemoInterface" parent="." instance=ExtResource( 4 )]
-margin_right = 1024.0
+text_bbcode = "Avoid Collisions Demo
-margin_bottom = 14.0
-theme = ExtResource( 4 )
-__meta__ = {
-"_edit_use_anchors_": false
-}
-
-[node name="MarginContainer" type="MarginContainer" parent="GUI"]
-margin_right = 1024.0
-margin_bottom = 116.0
-
-[node name="RichTextLabel" type="RichTextLabel" parent="GUI/MarginContainer"]
-margin_left = 16.0
-margin_top = 16.0
-margin_right = 1008.0
-margin_bottom = 100.0
-rect_min_size = Vector2( 0, 84 )
-bbcode_enabled = true
-bbcode_text = "Avoid Collisions Demo
 Watch each agent try to keep traveling in a particular direction, but prioritize avoiding collisions with other agents."
-text = "Avoid Collisions Demo
-Watch each agent try to keep traveling in a particular direction, but prioritize avoiding collisions with other agents."
-scroll_active = false

project/demos/DemoPickerUI.gd

@@ -1,5 +1,5 @@
 class_name DemoPickerUI
-extends CenterContainer
+extends Control
 
 
 signal demo_requested

project/demos/DemoSelector.tscn

@@ -13,18 +13,15 @@ script = ExtResource( 6 )
 [node name="DemoPlayer" type="Node2D" parent="."]
 script = ExtResource( 5 )
 
-[node name="DemoPickerUI" type="CenterContainer" parent="."]
+[node name="DemoPickerUI" type="Control" parent="."]
 anchor_right = 1.0
 anchor_bottom = 1.0
 theme = ExtResource( 2 )
 script = ExtResource( 4 )
-__meta__ = {
-"_edit_use_anchors_": false
-}
 
 [node name="TextureRect" type="TextureRect" parent="DemoPickerUI"]
-margin_right = 1024.0
+anchor_right = 1.0
-margin_bottom = 600.0
+anchor_bottom = 1.0
 rect_min_size = Vector2( 1024, 600 )
 size_flags_horizontal = 3
 size_flags_vertical = 3
@@ -33,26 +30,35 @@ expand = true
 stretch_mode = 2
 
 [node name="VBoxContainer" type="VBoxContainer" parent="DemoPickerUI"]
-margin_left = 171.0
+anchor_left = 0.5
-margin_top = 261.0
+anchor_top = 0.5
-margin_right = 853.0
+anchor_right = 0.5
-margin_bottom = 338.0
+anchor_bottom = 0.5
+margin_left = -341.0
+margin_top = -290.0
+margin_right = 341.0
+margin_bottom = 290.0
 rect_min_size = Vector2( 682, 0 )
 size_flags_horizontal = 3
 size_flags_vertical = 3
+alignment = 1
+__meta__ = {
+"_edit_use_anchors_": false
+}
 
 [node name="ItemList" type="ItemList" parent="DemoPickerUI/VBoxContainer"]
+margin_top = 231.0
 margin_right = 682.0
-margin_bottom = 9.0
+margin_bottom = 240.0
 auto_height = true
 script = ExtResource( 1 )
 
 [node name="Button" type="Button" parent="DemoPickerUI/VBoxContainer"]
-margin_left = 241.0
+margin_left = 201.0
-margin_top = 17.0
+margin_top = 248.0
-margin_right = 441.0
+margin_right = 481.0
-margin_bottom = 77.0
+margin_bottom = 348.0
-rect_min_size = Vector2( 200, 60 )
+rect_min_size = Vector2( 280, 100 )
 size_flags_horizontal = 4
 size_flags_vertical = 13
 text = "Load scene"
@@ -61,11 +67,11 @@ text = "Load scene"
 visible = false
 anchor_top = 1.0
 anchor_bottom = 1.0
-margin_left = 40.0
+margin_left = 48.0
-margin_top = -92.0
+margin_top = -156.0
-margin_right = 200.0
+margin_right = 328.0
-margin_bottom = -32.0
+margin_bottom = -56.0
-rect_min_size = Vector2( 160, 60 )
+rect_min_size = Vector2( 280, 100 )
 size_flags_horizontal = 4
 size_flags_vertical = 13
 theme = ExtResource( 2 )

project/demos/Face/FaceDemo.gd

@@ -1,4 +1,4 @@
-extends Node2D
+extends Node
 
 
 export(int, 0, 359, 2) var angular_speed_max := 120 setget set_angular_speed_max

project/demos/Face/FaceDemo.tscn

@@ -3,8 +3,8 @@
 [ext_resource path="res://demos/Face/Turret.gd" type="Script" id=1]
 [ext_resource path="res://demos/Face/FaceDemo.gd" type="Script" id=2]
 [ext_resource path="res://demos/Face/Player.gd" type="Script" id=3]
-[ext_resource path="res://assets/theme/gdquest.theme" type="Theme" id=6]
+[ext_resource path="res://demos/Utils/DemoInterface.tscn" type="PackedScene" id=4]
-[ext_resource path="res://assets/sprites/background.png" type="Texture" id=7]
+[ext_resource path="res://demos/Utils/BackgroudLayer.tscn" type="PackedScene" id=5]
 [ext_resource path="res://demos/Utils/CircleDraw.gd" type="Script" id=8]
 
 [sub_resource type="CircleShape2D" id=1]
@@ -13,18 +13,10 @@ radius = 16.0
 [sub_resource type="CircleShape2D" id=2]
 radius = 32.0
 
-[node name="FaceDemo" type="Node2D"]
+[node name="FaceDemo" type="Node"]
 script = ExtResource( 2 )
-__meta__ = {
-"_editor_description_": "A demo showing the usage of the Face steering behavior."
-}
 
-[node name="BackgroudLayer" type="CanvasLayer" parent="."]
+[node name="BackgroudLayer" parent="." instance=ExtResource( 5 )]
-layer = -1
-
-[node name="Background" type="Sprite" parent="BackgroudLayer"]
-texture = ExtResource( 7 )
-centered = false
 
 [node name="Player" type="KinematicBody2D" parent="."]
 position = Vector2( 512, 450 )
@@ -48,26 +40,6 @@ inner_color = Color( 0.890196, 0.411765, 0.337255, 1 )
 outer_color = Color( 1, 0.709804, 0.439216, 1 )
 stroke = 8.0
 
-[node name="GUI" type="PanelContainer" parent="."]
+[node name="DemoInterface" parent="." instance=ExtResource( 4 )]
-margin_right = 1024.0
+text_bbcode = "Face Demo
-margin_bottom = 14.0
-theme = ExtResource( 6 )
-__meta__ = {
-"_edit_use_anchors_": false
-}
-
-[node name="MarginContainer" type="MarginContainer" parent="GUI"]
-margin_right = 1024.0
-margin_bottom = 87.0
-
-[node name="RichTextLabel" type="RichTextLabel" parent="GUI/MarginContainer"]
-margin_left = 16.0
-margin_top = 16.0
-margin_right = 1008.0
-margin_bottom = 71.0
-rect_min_size = Vector2( 0, 55 )
-bbcode_enabled = true
-bbcode_text = "Face Demo
 Move the [color=lime]green player[/color] around with WASD and notice the [color=#ffb570]orange turret[/color] orient itself"
-text = "Face Demo
-Move the green player around with WASD and notice the orange turret orient itself"

project/demos/FollowPath/FollowPathDemo.gd

@@ -1,4 +1,4 @@
-extends Node2D
+extends Node
 
 
 export(float, 0, 2000, 40) var linear_speed_max := 600.0 setget set_linear_speed_max

project/demos/FollowPath/FollowPathDemo.tscn

@@ -1,24 +1,19 @@
 [gd_scene load_steps=8 format=2]
 
 [ext_resource path="res://demos/FollowPath/Drawer.gd" type="Script" id=1]
+[ext_resource path="res://demos/Utils/DemoInterface.tscn" type="PackedScene" id=2]
 [ext_resource path="res://demos/FollowPath/PathFollower.gd" type="Script" id=3]
 [ext_resource path="res://demos/FollowPath/FollowPathDemo.gd" type="Script" id=4]
-[ext_resource path="res://assets/theme/gdquest.theme" type="Theme" id=5]
+[ext_resource path="res://demos/Utils/BackgroudLayer.tscn" type="PackedScene" id=5]
 [ext_resource path="res://demos/Utils/CircleDraw.gd" type="Script" id=6]
-[ext_resource path="res://assets/sprites/background.png" type="Texture" id=7]
 
 [sub_resource type="CircleShape2D" id=1]
 radius = 16.0
 
-[node name="FollowPathDemo" type="Node2D"]
+[node name="FollowPathDemo" type="Node"]
 script = ExtResource( 4 )
 
-[node name="BackgroudLayer" type="CanvasLayer" parent="."]
+[node name="BackgroudLayer" parent="." instance=ExtResource( 5 )]
-layer = -1
-
-[node name="Background" type="Sprite" parent="BackgroudLayer"]
-texture = ExtResource( 7 )
-centered = false
 
 [node name="Drawer" type="Node2D" parent="."]
 script = ExtResource( 1 )
@@ -34,27 +29,6 @@ inner_color = Color( 0.235294, 0.639216, 0.439216, 1 )
 outer_color = Color( 0.560784, 0.870588, 0.364706, 1 )
 stroke = 4.0
 
-[node name="GUI" type="PanelContainer" parent="."]
+[node name="DemoInterface" parent="." instance=ExtResource( 2 )]
-margin_right = 1024.0
+text_bbcode = "Follow Path Demo
-margin_bottom = 14.0
-theme = ExtResource( 5 )
-__meta__ = {
-"_edit_use_anchors_": false
-}
-
-[node name="MarginContainer" type="MarginContainer" parent="GUI"]
-margin_right = 1024.0
-margin_bottom = 116.0
-
-[node name="RichTextLabel" type="RichTextLabel" parent="GUI/MarginContainer"]
-margin_left = 16.0
-margin_top = 16.0
-margin_right = 1008.0
-margin_bottom = 100.0
-rect_min_size = Vector2( 0, 84 )
-bbcode_enabled = true
-bbcode_text = "Follow Path Demo
 Use the mouse to draw a path on screen and watch the [color=lime]green \"Agent\"[/color] follow it to the end."
-text = "Follow Path Demo
-Use the mouse to draw a path on screen and watch the green \"Agent\" follow it to the end."
-scroll_active = false

project/demos/GroupBehaviors/GroupBehaviorsDemo.gd

@@ -1,4 +1,4 @@
-extends Node2D
+extends Node
 
 
 onready var spawner := $Spawner

project/demos/GroupBehaviors/GroupBehaviorsDemo.tscn

@@ -3,47 +3,21 @@
 [ext_resource path="res://demos/GroupBehaviors/Member.tscn" type="PackedScene" id=1]
 [ext_resource path="res://demos/GroupBehaviors/Spawner.gd" type="Script" id=2]
 [ext_resource path="res://demos/GroupBehaviors/GroupBehaviorsDemo.gd" type="Script" id=3]
-[ext_resource path="res://assets/theme/gdquest.theme" type="Theme" id=4]
+[ext_resource path="res://demos/Utils/DemoInterface.tscn" type="PackedScene" id=4]
-[ext_resource path="res://assets/sprites/background.png" type="Texture" id=5]
+[ext_resource path="res://demos/Utils/BackgroudLayer.tscn" type="PackedScene" id=5]
 
-[node name="GroupBehaviorsDemo" type="Node2D"]
+[node name="GroupBehaviorsDemo" type="Node"]
 script = ExtResource( 3 )
 cohesion_strength = 0.2
 separation_strength = 4.5
 
-[node name="BackgroudLayer" type="CanvasLayer" parent="."]
+[node name="BackgroudLayer" parent="." instance=ExtResource( 5 )]
-layer = -1
-
-[node name="Background" type="Sprite" parent="BackgroudLayer"]
-texture = ExtResource( 5 )
-centered = false
 
 [node name="Spawner" type="Node2D" parent="."]
 position = Vector2( 512, 300 )
 script = ExtResource( 2 )
 member = ExtResource( 1 )
 
-[node name="GUI" type="PanelContainer" parent="."]
+[node name="DemoInterface" parent="." instance=ExtResource( 4 )]
-margin_right = 1024.0
+text_bbcode = "Group Behavior Demo
-margin_bottom = 14.0
-theme = ExtResource( 4 )
-__meta__ = {
-"_edit_use_anchors_": false
-}
-
-[node name="MarginContainer" type="MarginContainer" parent="GUI"]
-margin_right = 1024.0
-margin_bottom = 116.0
-
-[node name="RichTextLabel" type="RichTextLabel" parent="GUI/MarginContainer"]
-margin_left = 16.0
-margin_top = 16.0
-margin_right = 1008.0
-margin_bottom = 100.0
-rect_min_size = Vector2( 0, 84 )
-bbcode_enabled = true
-bbcode_text = "Group Behavior Demo
 Each of the \"Agents\" are both attempting to stay separated from each other but within reach of their nearest group's center of mass."
-text = "Group Behavior Demo
-Each of the \"Agents\" are both attempting to stay separated from each other but within reach of their nearest group's center of mass."
-scroll_active = false

project/demos/PursueSeek/PursueAndSeekDemo.gd

@@ -1,4 +1,4 @@
-extends Node2D
+extends Node
 
 
 export(float, 0, 2000, 40) var linear_speed_max := 120.0 setget set_linear_speed_max

project/demos/PursueSeek/PursueAndSeekDemo.tscn

@@ -4,25 +4,17 @@
 [ext_resource path="res://demos/PursueSeek/Player.gd" type="Script" id=2]
 [ext_resource path="res://demos/PursueSeek/BoundaryManager.gd" type="Script" id=3]
 [ext_resource path="res://demos/PursueSeek/PursueAndSeekDemo.gd" type="Script" id=4]
-[ext_resource path="res://assets/theme/gdquest.theme" type="Theme" id=5]
+[ext_resource path="res://demos/Utils/DemoInterface.tscn" type="PackedScene" id=5]
 [ext_resource path="res://demos/Utils/Line2DDraw.gd" type="Script" id=6]
-[ext_resource path="res://assets/sprites/background.png" type="Texture" id=7]
+[ext_resource path="res://demos/Utils/BackgroudLayer.tscn" type="PackedScene" id=7]
 
-[node name="PursueVSSeekDemo" type="Node2D"]
+[node name="PursueVSSeekDemo" type="Node"]
 script = ExtResource( 4 )
-__meta__ = {
-"_editor_description_": "Toy demo to demonstrate the use of the Pursue contrasted to the more naive Seek steering behavior."
-}
 linear_speed_max = 240.0
 linear_accel_max = 40.0
 predict_time = 1.1
 
-[node name="BackgroudLayer" type="CanvasLayer" parent="."]
+[node name="BackgroudLayer" parent="." instance=ExtResource( 7 )]
-layer = -1
-
-[node name="Background" type="Sprite" parent="BackgroudLayer"]
-texture = ExtResource( 7 )
-centered = false
 
 [node name="BoundaryManager" type="Node2D" parent="."]
 script = ExtResource( 3 )
@@ -83,29 +75,7 @@ antialiased = true
 script = ExtResource( 6 )
 inner_color = Color( 0.294118, 0.356863, 0.670588, 1 )
 
-[node name="GUI" type="PanelContainer" parent="."]
+[node name="DemoInterface" parent="." instance=ExtResource( 5 )]
-margin_right = 1024.0
+text_bbcode = "Pursue vs. Seek Demo
-margin_bottom = 14.0
-theme = ExtResource( 5 )
-__meta__ = {
-"_edit_use_anchors_": false
-}
-
-[node name="MarginContainer" type="MarginContainer" parent="GUI"]
-margin_right = 1024.0
-margin_bottom = 116.0
-
-[node name="RichTextLabel" type="RichTextLabel" parent="GUI/MarginContainer"]
-margin_left = 16.0
-margin_top = 16.0
-margin_right = 1008.0
-margin_bottom = 100.0
-rect_min_size = Vector2( 0, 84 )
-bbcode_enabled = true
-bbcode_text = "Pursue vs. Seek Demo
 Move the player around with WASD and notice the [color=#ffb570]orange Pursuer[/color] and the [color=aqua]blue Seeker[/color] follow
 the [color=lime]green \"Ship\"[/color] around"
-text = "Pursue vs. Seek Demo
-Move the player around with WASD and notice the orange Pursuer and the blue Seeker follow
-the green \"Ship\" around"
-scroll_active = false

project/demos/Quickstart/QuickStartDemo.tscn

@@ -4,16 +4,11 @@
 [ext_resource path="res://demos/Quickstart/Agent.gd" type="Script" id=2]
 [ext_resource path="res://demos/Quickstart/Player.gd" type="Script" id=3]
 [ext_resource path="res://demos/Quickstart/Bullet.tscn" type="PackedScene" id=4]
-[ext_resource path="res://assets/sprites/background.png" type="Texture" id=5]
+[ext_resource path="res://demos/Utils/BackgroudLayer.tscn" type="PackedScene" id=5]
 
-[node name="QuickStartDemo" type="Node2D"]
+[node name="QuickStartDemo" type="Node"]
 
-[node name="BackgroudLayer" type="CanvasLayer" parent="."]
+[node name="BackgroudLayer" parent="." instance=ExtResource( 5 )]
-layer = -1
-
-[node name="Background" type="Sprite" parent="BackgroudLayer"]
-texture = ExtResource( 5 )
-centered = false
 
 [node name="Player" type="KinematicBody2D" parent="." groups=[
 "Player",

project/demos/SeekFlee/SeekFleeDemo.gd

@@ -1,4 +1,4 @@
-extends Node2D
+extends Node
 # Access helper class for children to access window boundaries.
 
 

project/demos/SeekFlee/SeekFleeDemo.tscn

@@ -4,32 +4,24 @@
 [ext_resource path="res://demos/SeekFlee/Player.gd" type="Script" id=2]
 [ext_resource path="res://demos/SeekFlee/SeekFleeDemo.gd" type="Script" id=3]
 [ext_resource path="res://demos/SeekFlee/Spawner.gd" type="Script" id=4]
-[ext_resource path="res://assets/theme/gdquest.theme" type="Theme" id=5]
+[ext_resource path="res://demos/Utils/DemoInterface.tscn" type="PackedScene" id=5]
 [ext_resource path="res://demos/SeekFlee/Seeker.tscn" type="PackedScene" id=6]
 [ext_resource path="res://demos/Utils/CircleDraw.gd" type="Script" id=7]
-[ext_resource path="res://assets/sprites/background.png" type="Texture" id=8]
+[ext_resource path="res://demos/Utils/BackgroudLayer.tscn" type="PackedScene" id=8]
 
 [sub_resource type="CircleShape2D" id=1]
 radius = 32.0
 
 [sub_resource type="RectangleShape2D" id=2]
-extents = Vector2( 10, 300 )
+extents = Vector2( 10, 542 )
 
 [sub_resource type="RectangleShape2D" id=3]
-extents = Vector2( 512, 10 )
+extents = Vector2( 965.654, 10 )
 
-[node name="SeekFleeDemo" type="Node2D"]
+[node name="SeekFleeDemo" type="Node"]
 script = ExtResource( 3 )
-__meta__ = {
-"_editor_description_": "A toy demo to demonstrate the usage for the Seek and Flee steering behaviors."
-}
 
-[node name="BackgroudLayer" type="CanvasLayer" parent="."]
+[node name="BackgroudLayer" parent="." instance=ExtResource( 8 )]
-layer = -1
-
-[node name="Background" type="Sprite" parent="BackgroudLayer"]
-texture = ExtResource( 8 )
-centered = false
 
 [node name="Player" type="KinematicBody2D" parent="."]
 position = Vector2( 512, 300 )
@@ -50,6 +42,7 @@ collision_mask = 5
 script = ExtResource( 1 )
 
 [node name="CollisionShape2D" type="CollisionShape2D" parent="LeftBoundary"]
+position = Vector2( 0, 246 )
 shape = SubResource( 2 )
 
 [node name="RightBoundary" type="StaticBody2D" parent="."]
@@ -59,15 +52,17 @@ collision_mask = 5
 script = ExtResource( 1 )
 
 [node name="CollisionShape2D" type="CollisionShape2D" parent="RightBoundary"]
+position = Vector2( 898, 242 )
 shape = SubResource( 2 )
 
 [node name="TopBoundary" type="StaticBody2D" parent="."]
-position = Vector2( 512, 0 )
+position = Vector2( 512, 2.00002 )
 collision_layer = 2
 collision_mask = 5
 script = ExtResource( 1 )
 
 [node name="CollisionShape2D" type="CollisionShape2D" parent="TopBoundary"]
+position = Vector2( 472.348, 0 )
 shape = SubResource( 3 )
 
 [node name="BottomBoundary" type="StaticBody2D" parent="."]
@@ -77,32 +72,13 @@ collision_mask = 5
 script = ExtResource( 1 )
 
 [node name="CollisionShape2D" type="CollisionShape2D" parent="BottomBoundary"]
+position = Vector2( 436.348, 472.348 )
 shape = SubResource( 3 )
 
 [node name="Spawner" type="Node2D" parent="."]
 script = ExtResource( 4 )
 Entity = ExtResource( 6 )
 
-[node name="GUI" type="PanelContainer" parent="."]
+[node name="DemoInterface" parent="." instance=ExtResource( 5 )]
-margin_right = 1024.0
+text_bbcode = "Seek & Flee Demo
-margin_bottom = 116.0
-theme = ExtResource( 5 )
-__meta__ = {
-"_edit_use_anchors_": false
-}
-
-[node name="MarginContainer" type="MarginContainer" parent="GUI"]
-margin_right = 1024.0
-margin_bottom = 116.0
-
-[node name="RichTextLabel" type="RichTextLabel" parent="GUI/MarginContainer"]
-margin_left = 16.0
-margin_top = 16.0
-margin_right = 1008.0
-margin_bottom = 100.0
-rect_min_size = Vector2( 0, 84 )
-bbcode_enabled = true
-bbcode_text = "Seek & Flee Demo
 Move the [color=lime]green \"Player\"[/color] around with WASD and notice the [color=#ffb570]orange \"Enemies\"[/color] try to seek to or flee from the player."
-text = "Seek & Flee Demo
-Move the green \"Player\" around with WASD and notice the orange \"Enemies\" try to seek to or flee from the player."

project/demos/Utils/BackgroudLayer.tscn

@@ -0,0 +1,15 @@
+[gd_scene load_steps=2 format=2]
+
+[ext_resource path="res://assets/sprites/background.png" type="Texture" id=1]
+
+[node name="BackgroudLayer" type="CanvasLayer"]
+layer = -1
+
+[node name="Background" type="TextureRect" parent="."]
+anchor_right = 1.0
+anchor_bottom = 1.0
+mouse_filter = 2
+texture = ExtResource( 1 )
+__meta__ = {
+"_edit_use_anchors_": false
+}

project/demos/Utils/DemoInterface.gd

@@ -0,0 +1,15 @@
+tool
+extends PanelContainer
+
+
+export(String, MULTILINE) var text_bbcode := "" setget set_text_bbcode
+
+onready var rich_text_label: RichTextLabel = $MarginContainer/RichTextLabel
+
+
+func set_text_bbcode(value: String)-> void:
+	text_bbcode = value
+	if not rich_text_label:
+		yield(self, "ready")
+	rich_text_label.bbcode_text = text_bbcode
+	print(rich_text_label.text)

project/demos/Utils/DemoInterface.tscn

@@ -0,0 +1,37 @@
+[gd_scene load_steps=4 format=2]
+
+[ext_resource path="res://assets/theme/gdquest.theme" type="Theme" id=1]
+[ext_resource path="res://demos/Utils/DemoInterface.gd" type="Script" id=2]
+
+[sub_resource type="GDScript" id=1]
+script/source = "tool
+extends RichTextLabel
+
+"
+
+[node name="DemoInterface" type="PanelContainer"]
+anchor_right = 1.0
+margin_bottom = 87.0
+rect_min_size = Vector2( 1024, 0 )
+theme = ExtResource( 1 )
+script = ExtResource( 2 )
+__meta__ = {
+"_edit_use_anchors_": false
+}
+text_bbcode = "Replace this text for the demo."
+
+[node name="MarginContainer" type="MarginContainer" parent="."]
+margin_right = 1920.0
+margin_bottom = 87.0
+
+[node name="RichTextLabel" type="RichTextLabel" parent="MarginContainer"]
+margin_left = 16.0
+margin_top = 16.0
+margin_right = 1904.0
+margin_bottom = 71.0
+rect_min_size = Vector2( 0, 55 )
+bbcode_enabled = true
+bbcode_text = "Replace this text for the demo."
+text = "Replace this text for the demo."
+scroll_active = false
+script = SubResource( 1 )

project/project.godot

@@ -9,7 +9,7 @@
 config_version=4
 
 _global_script_classes=[ {
-"base": "CenterContainer",
+"base": "Control",
 "class": "DemoPickerUI",
 "language": "GDScript",
 "path": "res://demos/DemoPickerUI.gd"
@@ -200,7 +200,11 @@ config/icon="res://icon.png"
 
 [display]
 
+window/size/width=1920
+window/size/height=1080
 window/size/always_on_top=true
+window/stretch/mode="2d"
+window/stretch/aspect="expand"
 
 [input]