Added joysticks

Main.tscn

@@ -1,8 +1,9 @@
-[gd_scene load_steps=4 format=3 uid="uid://c7bwo3h0leip4"]
+[gd_scene load_steps=5 format=3 uid="uid://c7bwo3h0leip4"]
 
 [ext_resource type="Script" uid="uid://bu2nrvyk2k8ib" path="res://controller/controller.gd" id="1_uu6xs"]
 [ext_resource type="PackedScene" uid="uid://bkw6xqubudrtw" path="res://controller/button/controller_button.tscn" id="2_uu6xs"]
 [ext_resource type="PackedScene" uid="uid://c1dixxyohl131" path="res://controller/trigger/trigger_button.tscn" id="3_r0du0"]
+[ext_resource type="PackedScene" uid="uid://dmbbgdsoioadd" path="res://controller/joystick/joystick.tscn" id="4_cm0pq"]
 
 [node name="Main" type="Control"]
 layout_mode = 3
@@ -201,3 +202,34 @@ offset_right = -236.0
 offset_bottom = -133.0
 input_axis = 4
 label = "L2"
+
+[node name="LeftJoystick" parent="." instance=ExtResource("4_cm0pq")]
+layout_mode = 1
+anchors_preset = 7
+anchor_left = 0.5
+anchor_top = 1.0
+anchor_right = 0.5
+anchor_bottom = 1.0
+offset_left = -320.0
+offset_top = -293.0
+offset_right = -64.0
+offset_bottom = -37.0
+grow_horizontal = 2
+grow_vertical = 0
+axis_y = 1
+
+[node name="RightJoystick" parent="." instance=ExtResource("4_cm0pq")]
+layout_mode = 1
+anchors_preset = 7
+anchor_left = 0.5
+anchor_top = 1.0
+anchor_right = 0.5
+anchor_bottom = 1.0
+offset_left = 64.0
+offset_top = -293.0
+offset_right = 320.0
+offset_bottom = -37.0
+grow_horizontal = 2
+grow_vertical = 0
+axis_x = 2
+axis_y = 3

controller/joystick/joystick.gd

@@ -0,0 +1,42 @@
+extends Panel
+
+const DRIFT_DEADZONE := 0.03;
+const REST_DEADZONE := 0.05;
+const DEFAULT_COLOR := Color(0x2a2a2aff)
+const ACTIVE_COLOR := Color(0x4a8e53ff)
+const ERROR_COLOR := Color(0xbe2037ff)
+
+@onready var pos: Panel = $Pos
+@onready var label_node: RichTextLabel = $Label
+@onready var box_theme: StyleBoxFlat = preload("uid://bgb7rlf1chjnd") as StyleBoxFlat
+
+@export var axis_x: JoyAxis
+@export var axis_y: JoyAxis
+
+var _dot_style: StyleBoxFlat
+
+func _ready() -> void:
+	self._dot_style = box_theme.duplicate()
+	self.pos.add_theme_stylebox_override("panel", self._dot_style)
+	self._dot_style.bg_color = DEFAULT_COLOR
+
+func _process(_delta: float) -> void:
+	var x := Input.get_joy_axis(0, self.axis_x)
+	var y := Input.get_joy_axis(0, self.axis_y)
+
+	self.pos.position.x = (x * 128.0) + 104.0
+	self.pos.position.y = (y * 128.0) + 104.0
+
+	var is_moving := x > REST_DEADZONE || y > REST_DEADZONE \
+		|| x < -REST_DEADZONE || y < -REST_DEADZONE
+	var is_drifting := x >= DRIFT_DEADZONE || y >= DRIFT_DEADZONE \
+		|| x <= -DRIFT_DEADZONE || y <= -DRIFT_DEADZONE
+
+	if is_moving:
+		self._dot_style.bg_color = ACTIVE_COLOR
+	elif is_drifting:
+		self._dot_style.bg_color = ERROR_COLOR
+	else:
+		self._dot_style.bg_color = DEFAULT_COLOR
+
+	self.label_node.text = "x:%0.2f y:%0.2f" % [x, y]

controller/joystick/joystick.gd.uid

@@ -0,0 +1 @@
+uid://d0uk2qtgrsvhg

controller/joystick/joystick.tscn

@@ -0,0 +1,56 @@
+[gd_scene load_steps=3 format=3 uid="uid://dmbbgdsoioadd"]
+
+[ext_resource type="Script" uid="uid://d0uk2qtgrsvhg" path="res://controller/joystick/joystick.gd" id="1_vr4b3"]
+
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_2jarx"]
+bg_color = Color(0.6, 0.6, 0.6, 0)
+draw_center = false
+border_width_left = 10
+border_width_top = 10
+border_width_right = 10
+border_width_bottom = 10
+border_color = Color(0.16470589, 0.16470589, 0.16470589, 1)
+corner_radius_top_left = 100
+corner_radius_top_right = 100
+corner_radius_bottom_right = 100
+corner_radius_bottom_left = 100
+corner_detail = 16
+
+[node name="JoystickArea" type="Panel"]
+offset_right = 256.0
+offset_bottom = 256.0
+pivot_offset = Vector2(128, 128)
+theme_override_styles/panel = SubResource("StyleBoxFlat_2jarx")
+script = ExtResource("1_vr4b3")
+
+[node name="Pos" type="Panel" parent="."]
+layout_mode = 1
+anchors_preset = 8
+anchor_left = 0.5
+anchor_top = 0.5
+anchor_right = 0.5
+anchor_bottom = 0.5
+offset_left = -24.0
+offset_top = -24.0
+offset_right = 24.0
+offset_bottom = 24.0
+grow_horizontal = 2
+grow_vertical = 2
+pivot_offset = Vector2(24, 24)
+
+[node name="Label" type="RichTextLabel" parent="."]
+layout_mode = 1
+anchors_preset = 7
+anchor_left = 0.5
+anchor_top = 1.0
+anchor_right = 0.5
+anchor_bottom = 1.0
+offset_left = -120.0
+offset_top = -40.0
+offset_right = 120.0
+grow_horizontal = 2
+grow_vertical = 0
+theme_override_font_sizes/normal_font_size = 24
+autowrap_mode = 0
+horizontal_alignment = 1
+vertical_alignment = 1

controller/joystick/joystick_theme.tres

@@ -0,0 +1,8 @@
+[gd_resource type="StyleBoxFlat" format=3 uid="uid://bgb7rlf1chjnd"]
+
+[resource]
+bg_color = Color(0.16470589, 0.16470589, 0.16470589, 1)
+corner_radius_top_left = 100
+corner_radius_top_right = 100
+corner_radius_bottom_right = 100
+corner_radius_bottom_left = 100

controller/trigger/trigger_button.tscn

@@ -4,6 +4,7 @@
 
 [sub_resource type="StyleBoxFlat" id="StyleBoxFlat_lt7ru"]
 bg_color = Color(0.6, 0.6, 0.6, 0)
+draw_center = false
 border_width_left = 5
 border_width_top = 5
 border_width_right = 5