Add basic UI

export_presets.cfg

@@ -0,0 +1,39 @@
+[preset.0]
+
+name="Linux"
+platform="Linux"
+runnable=true
+advanced_options=false
+dedicated_server=false
+custom_features=""
+export_filter="all_resources"
+include_filter=""
+exclude_filter=""
+export_path="./First Game.x86_64"
+encryption_include_filters=""
+encryption_exclude_filters=""
+encrypt_pck=false
+encrypt_directory=false
+script_export_mode=2
+
+[preset.0.options]
+
+custom_template/debug=""
+custom_template/release=""
+debug/export_console_wrapper=1
+binary_format/embed_pck=true
+texture_format/s3tc_bptc=true
+texture_format/etc2_astc=false
+binary_format/architecture="x86_64"
+ssh_remote_deploy/enabled=false
+ssh_remote_deploy/host="user@host_ip"
+ssh_remote_deploy/port="22"
+ssh_remote_deploy/extra_args_ssh=""
+ssh_remote_deploy/extra_args_scp=""
+ssh_remote_deploy/run_script="#!/usr/bin/env bash
+export DISPLAY=:0
+unzip -o -q \"{temp_dir}/{archive_name}\" -d \"{temp_dir}\"
+\"{temp_dir}/{exe_name}\" {cmd_args}"
+ssh_remote_deploy/cleanup_script="#!/usr/bin/env bash
+kill $(pgrep -x -f \"{temp_dir}/{exe_name} {cmd_args}\")
+rm -rf \"{temp_dir}\""

scenes/game.tscn

@@ -1,7 +1,8 @@
-[gd_scene load_steps=25 format=3 uid="uid://btwyjtp0llujx"]
+[gd_scene load_steps=26 format=3 uid="uid://btwyjtp0llujx"]
 
 [ext_resource type="PackedScene" uid="uid://bctm7arnf6byt" path="res://scenes/player.tscn" id="1_g0rus"]
 [ext_resource type="Script" path="res://scripts/game_manager.gd" id="1_haiif"]
+[ext_resource type="PackedScene" uid="uid://ckij5rkss4ds2" path="res://scenes/ui.tscn" id="1_mtcl6"]
 [ext_resource type="Script" path="res://scripts/player.gd" id="2_5m8be"]
 [ext_resource type="Texture2D" uid="uid://d0q2g65ahgok" path="res://assets/sprites/world_tileset.png" id="3_glujw"]
 [ext_resource type="PackedScene" uid="uid://dy2cgj5ibb8tx" path="res://scenes/platform.tscn" id="4_pr3de"]
@@ -316,6 +317,11 @@ text = "You collected X coins."
 horizontal_alignment = 1
 autowrap_mode = 2
 
+[node name="CanvasLayer" type="CanvasLayer" parent="."]
+
+[node name="UI" parent="CanvasLayer" instance=ExtResource("1_mtcl6")]
+unique_name_in_owner = true
+
 [node name="TileMap" type="TileMap" parent="."]
 position = Vector2(28, 45)
 tile_set = SubResource("TileSet_yic8f")

scenes/ui.tscn

@@ -0,0 +1,160 @@
+[gd_scene load_steps=11 format=3 uid="uid://ckij5rkss4ds2"]
+
+[ext_resource type="Script" path="res://scripts/ui.gd" id="1_ootcf"]
+[ext_resource type="FontFile" uid="uid://c53kogtyjwsss" path="res://assets/fonts/PixelOperator8-Bold.ttf" id="1_qrd6w"]
+[ext_resource type="Texture2D" uid="uid://bped01tsjeycn" path="res://assets/sprites/coin.png" id="2_ybo8g"]
+[ext_resource type="FontFile" uid="uid://dbjl1e6kdxpl6" path="res://assets/fonts/PixelOperator8.ttf" id="3_7c0yq"]
+[ext_resource type="Texture2D" uid="uid://b8cmjj8vq3r8d" path="res://assets/sprites/knight.png" id="3_rypq5"]
+
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_uwkun"]
+bg_color = Color(0.124085, 0.661174, 0.816135, 1)
+border_width_left = 4
+border_width_top = 4
+border_width_right = 4
+border_width_bottom = 4
+border_color = Color(0, 0, 0, 1)
+corner_radius_top_left = 8
+corner_radius_top_right = 8
+corner_radius_bottom_right = 8
+corner_radius_bottom_left = 8
+shadow_size = 13
+shadow_offset = Vector2(0, 4.2)
+
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_8y3hb"]
+bg_color = Color(0.197273, 0.557602, 0.40846, 1)
+border_width_left = 2
+border_width_top = 2
+border_width_right = 2
+border_width_bottom = 2
+border_color = Color(0.00184107, 0.00184107, 0.00184107, 1)
+corner_radius_top_left = 18
+corner_radius_top_right = 18
+corner_radius_bottom_right = 18
+corner_radius_bottom_left = 18
+
+[sub_resource type="AtlasTexture" id="AtlasTexture_b1xc8"]
+atlas = ExtResource("3_rypq5")
+region = Rect2(8, 8, 15, 21)
+
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_3l4nn"]
+corner_radius_top_left = 6
+corner_radius_top_right = 6
+corner_radius_bottom_right = 6
+corner_radius_bottom_left = 6
+
+[sub_resource type="AtlasTexture" id="AtlasTexture_hl771"]
+atlas = ExtResource("2_ybo8g")
+region = Rect2(0, 0, 16, 16)
+
+[node name="UI" type="Control"]
+layout_mode = 3
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+script = ExtResource("1_ootcf")
+
+[node name="PlayerInfoBox" type="Panel" parent="."]
+layout_mode = 0
+offset_left = 24.0
+offset_top = 17.0
+offset_right = 374.0
+offset_bottom = 119.0
+theme_override_styles/panel = SubResource("StyleBoxFlat_uwkun")
+
+[node name="UsernameText" type="Label" parent="PlayerInfoBox"]
+layout_mode = 1
+offset_left = 100.0
+offset_top = 17.0
+offset_right = 238.0
+offset_bottom = 50.0
+theme_override_fonts/font = ExtResource("1_qrd6w")
+theme_override_font_sizes/font_size = 12
+text = "ItsDrike"
+vertical_alignment = 1
+
+[node name="AvatarFrame" type="Panel" parent="PlayerInfoBox"]
+layout_mode = 1
+anchors_preset = 4
+anchor_top = 0.5
+anchor_bottom = 0.5
+offset_left = 24.0
+offset_top = -39.5
+offset_right = 84.0
+offset_bottom = 30.5
+grow_vertical = 2
+theme_override_styles/panel = SubResource("StyleBoxFlat_8y3hb")
+
+[node name="Avatar" type="TextureRect" parent="PlayerInfoBox/AvatarFrame"]
+layout_mode = 1
+anchors_preset = 8
+anchor_left = 0.5
+anchor_top = 0.5
+anchor_right = 0.5
+anchor_bottom = 0.5
+offset_left = -22.0
+offset_top = -31.0
+offset_right = 22.0
+offset_bottom = 33.0
+grow_horizontal = 2
+grow_vertical = 2
+texture = SubResource("AtlasTexture_b1xc8")
+expand_mode = 5
+
+[node name="CoinFrame" type="Panel" parent="PlayerInfoBox"]
+layout_mode = 1
+anchors_preset = 1
+anchor_left = 1.0
+anchor_right = 1.0
+offset_left = -112.0
+offset_top = 14.0
+offset_right = -18.0
+offset_bottom = 44.0
+grow_horizontal = 0
+theme_override_styles/panel = SubResource("StyleBoxFlat_3l4nn")
+
+[node name="CoinIcon" type="TextureRect" parent="PlayerInfoBox/CoinFrame"]
+layout_mode = 1
+anchors_preset = 4
+anchor_top = 0.5
+anchor_bottom = 0.5
+offset_left = 4.0
+offset_top = -16.5
+offset_right = 36.0
+offset_bottom = 15.5
+grow_vertical = 2
+texture = SubResource("AtlasTexture_hl771")
+expand_mode = 1
+
+[node name="CoinAmountText" type="Label" parent="PlayerInfoBox/CoinFrame"]
+layout_mode = 1
+anchors_preset = 6
+anchor_left = 1.0
+anchor_top = 0.5
+anchor_right = 1.0
+anchor_bottom = 0.5
+offset_left = -54.0
+offset_top = -10.5
+offset_bottom = 12.5
+grow_horizontal = 0
+grow_vertical = 2
+theme_override_fonts/font = ExtResource("3_7c0yq")
+theme_override_font_sizes/font_size = 12
+text = "?"
+vertical_alignment = 1
+
+[node name="ExperienceProgress" type="ProgressBar" parent="PlayerInfoBox"]
+layout_mode = 1
+anchors_preset = 12
+anchor_top = 1.0
+anchor_right = 1.0
+anchor_bottom = 1.0
+offset_left = 100.0
+offset_top = -51.0
+offset_right = -18.0
+offset_bottom = -24.0
+grow_horizontal = 2
+grow_vertical = 0
+theme_override_fonts/font = ExtResource("3_7c0yq")
+value = 25.0

scripts/game_manager.gd

@@ -1,9 +1,12 @@
 extends Node
 
 @onready var score_label: Label = $ScoreLabel
+@onready var ui: UI = %UI
+
 
 var score: int = 0
 
 func add_score_point():
 	score += 1
 	score_label.text = "You collected " + str(score) + " coins."
+	ui.coins = score

scripts/ui.gd

@@ -0,0 +1,23 @@
+extends Control
+class_name UI
+
+@export var username: String = "ItsDrike"
+@export var max_coins: int = 40
+@export var coins: int:
+	set = set_coins
+
+@onready var coin_amount_text: Label = $PlayerInfoBox/CoinFrame/CoinAmountText
+@onready var experience_progress: ProgressBar = $PlayerInfoBox/ExperienceProgress
+@onready var username_text: Label = $PlayerInfoBox/UsernameText
+
+
+
+func _ready() -> void:
+	experience_progress.max_value = max_coins
+	username_text.text = username
+	set_coins(0)
+
+func set_coins(value: int) -> void:
+	coins = value
+	coin_amount_text.text = str(value)
+	experience_progress.value = coins