Handle up to 24 joypad buttons in the Joypads demo

misc/joypads/joypad_diagram.tscn

@@ -125,6 +125,13 @@ flip_h = true
 region_enabled = true
 region_rect = Rect2( 50, 0, 14, 54 )
 
+[node name="16" type="Sprite" parent="Buttons"]
+position = Vector2( 4, 64 )
+scale = Vector2( 0.9, 0.9 )
+texture = ExtResource( 2 )
+region_enabled = true
+region_rect = Rect2( 0, 0, 45, 45 )
+
 [node name="Axes" type="Node2D" parent="."]
 
 [node name="0-" type="Sprite" parent="Axes"]

misc/joypads/joypads.gd

@@ -23,6 +23,8 @@ onready var joypad_number = $DeviceInfo/JoyNumber
 func _ready():
 	set_physics_process(true)
 	Input.connect("joy_connection_changed", self, "_on_joy_connection_changed")
+	# Guide button, not supported <= 3.2.3, so manually hide to account for that case.
+	joypad_buttons.get_child(16).hide()
 
 
 func _process(_delta):
@@ -52,13 +54,15 @@ func _process(_delta):
 				joypad_axes.get_node(str(axis) + "-").show()
 
 	# Loop through the buttons and highlight the ones that are pressed.
-	for btn in range(JOY_BUTTON_0, JOY_BUTTON_MAX):
+	for btn in range(JOY_BUTTON_0, int(min(JOY_BUTTON_MAX, 24))):
 		if Input.is_joy_button_pressed(joy_num, btn):
-			button_grid.get_node(str(btn)).add_color_override("font_color", Color.white)
-			joypad_buttons.get_node(str(btn)).show()
+			button_grid.get_child(btn).add_color_override("font_color", Color.white)
+			if btn < 17:
+				joypad_buttons.get_child(btn).show()
 		else:
-			button_grid.get_node(str(btn)).add_color_override("font_color", Color(0.2, 0.1, 0.3, 1))
-			joypad_buttons.get_node(str(btn)).hide()
+			button_grid.get_child(btn).add_color_override("font_color", Color(0.2, 0.1, 0.3, 1))
+			if btn < 17:
+				joypad_buttons.get_child(btn).hide()
 
 
 # Called whenever a joypad has been connected or disconnected.

misc/joypads/joypads.tscn

@@ -19,7 +19,7 @@ __meta__ = {
 }
 
 [node name="JoypadDiagram" parent="." instance=ExtResource( 2 )]
-position = Vector2( 415, 180 )
+position = Vector2( 415, 170 )
 scale = Vector2( 0.5, 0.5 )
 
 [node name="DeviceInfo" type="HBoxContainer" parent="."]
@@ -569,7 +569,7 @@ anchor_top = 1.0
 anchor_right = 1.0
 anchor_bottom = 1.0
 margin_left = -250.0
-margin_top = -140.0
+margin_top = -150.0
 __meta__ = {
 "_edit_use_anchors_": false
 }
@@ -588,7 +588,7 @@ __meta__ = {
 [node name="ButtonGrid" type="GridContainer" parent="Buttons"]
 margin_top = 24.0
 margin_right = 250.0
-margin_bottom = 68.0
+margin_bottom = 92.0
 rect_min_size = Vector2( 200, 0 )
 columns = 8
 __meta__ = {
@@ -601,6 +601,7 @@ margin_bottom = 20.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "0"
 align = 1
 valign = 1
@@ -615,6 +616,7 @@ margin_bottom = 20.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "1"
 align = 1
 valign = 1
@@ -629,6 +631,7 @@ margin_bottom = 20.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "2"
 align = 1
 valign = 1
@@ -643,6 +646,7 @@ margin_bottom = 20.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "3"
 align = 1
 valign = 1
@@ -657,6 +661,7 @@ margin_bottom = 20.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "4"
 align = 1
 valign = 1
@@ -671,6 +676,7 @@ margin_bottom = 20.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "5"
 align = 1
 valign = 1
@@ -685,6 +691,7 @@ margin_bottom = 20.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "6"
 align = 1
 valign = 1
@@ -699,6 +706,7 @@ margin_bottom = 20.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "7"
 align = 1
 valign = 1
@@ -713,6 +721,7 @@ margin_bottom = 44.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "8"
 align = 1
 valign = 1
@@ -728,6 +737,7 @@ margin_bottom = 44.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "9"
 align = 1
 valign = 1
@@ -743,6 +753,7 @@ margin_bottom = 44.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "10"
 align = 1
 valign = 1
@@ -758,6 +769,7 @@ margin_bottom = 44.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "11"
 align = 1
 valign = 1
@@ -773,6 +785,7 @@ margin_bottom = 44.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "12"
 align = 1
 valign = 1
@@ -788,6 +801,7 @@ margin_bottom = 44.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "13"
 align = 1
 valign = 1
@@ -803,6 +817,7 @@ margin_bottom = 44.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "14"
 align = 1
 valign = 1
@@ -818,6 +833,7 @@ margin_bottom = 44.0
 rect_min_size = Vector2( 0, 20 )
 size_flags_horizontal = 3
 size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
 text = "15"
 align = 1
 valign = 1
@@ -825,6 +841,133 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
+[node name="16" type="Label" parent="Buttons/ButtonGrid"]
+margin_top = 48.0
+margin_right = 27.0
+margin_bottom = 68.0
+rect_min_size = Vector2( 0, 20 )
+size_flags_horizontal = 3
+size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
+text = "16"
+align = 1
+valign = 1
+__meta__ = {
+"_edit_use_anchors_": false
+}
+
+[node name="17" type="Label" parent="Buttons/ButtonGrid"]
+margin_left = 31.0
+margin_top = 48.0
+margin_right = 58.0
+margin_bottom = 68.0
+rect_min_size = Vector2( 0, 20 )
+size_flags_horizontal = 3
+size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
+text = "17"
+align = 1
+valign = 1
+__meta__ = {
+"_edit_use_anchors_": false
+}
+
+[node name="18" type="Label" parent="Buttons/ButtonGrid"]
+margin_left = 62.0
+margin_top = 48.0
+margin_right = 89.0
+margin_bottom = 68.0
+rect_min_size = Vector2( 0, 20 )
+size_flags_horizontal = 3
+size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
+text = "18"
+align = 1
+valign = 1
+__meta__ = {
+"_edit_use_anchors_": false
+}
+
+[node name="19" type="Label" parent="Buttons/ButtonGrid"]
+margin_left = 93.0
+margin_top = 48.0
+margin_right = 120.0
+margin_bottom = 68.0
+rect_min_size = Vector2( 0, 20 )
+size_flags_horizontal = 3
+size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
+text = "19"
+align = 1
+valign = 1
+__meta__ = {
+"_edit_use_anchors_": false
+}
+
+[node name="20" type="Label" parent="Buttons/ButtonGrid"]
+margin_left = 124.0
+margin_top = 48.0
+margin_right = 151.0
+margin_bottom = 68.0
+rect_min_size = Vector2( 0, 20 )
+size_flags_horizontal = 3
+size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
+text = "20"
+align = 1
+valign = 1
+__meta__ = {
+"_edit_use_anchors_": false
+}
+
+[node name="21" type="Label" parent="Buttons/ButtonGrid"]
+margin_left = 155.0
+margin_top = 48.0
+margin_right = 182.0
+margin_bottom = 68.0
+rect_min_size = Vector2( 0, 20 )
+size_flags_horizontal = 3
+size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
+text = "21"
+align = 1
+valign = 1
+__meta__ = {
+"_edit_use_anchors_": false
+}
+
+[node name="22" type="Label" parent="Buttons/ButtonGrid"]
+margin_left = 186.0
+margin_top = 48.0
+margin_right = 213.0
+margin_bottom = 68.0
+rect_min_size = Vector2( 0, 20 )
+size_flags_horizontal = 3
+size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
+text = "22"
+align = 1
+valign = 1
+__meta__ = {
+"_edit_use_anchors_": false
+}
+
+[node name="23" type="Label" parent="Buttons/ButtonGrid"]
+margin_left = 217.0
+margin_top = 48.0
+margin_right = 244.0
+margin_bottom = 68.0
+rect_min_size = Vector2( 0, 20 )
+size_flags_horizontal = 3
+size_flags_vertical = 1
+custom_colors/font_color = Color( 0.2, 0.1, 0.3, 1 )
+text = "23"
+align = 1
+valign = 1
+__meta__ = {
+"_edit_use_anchors_": false
+}
+
 [node name="Vibration" type="VBoxContainer" parent="."]
 anchor_top = 1.0
 anchor_bottom = 1.0