Latest revision as of 03:41, 15 June 2025

The Joystick and Button blocks add UI controls to the screen. They will display only when they are executed.

Several combinations can be used below.

In a game, there can be only up to 2 joysticks, 4 buttons, or when used in combination, 1 joystick and 2 buttons per frame. Going above this limit produces an error of "Too many controls!"

They were introduced in version 1.8.

Joystick

Button
Type	Script block
Collider	None
Folder	Control
Ports
Inputs	Before;
Outputs	Button; After;

Joystick
Type	Script block
Collider	None
Folder	Control
Ports
Inputs	Before;
Outputs	Joy Dir; After;

Adds joystick(s) to the screen. Unlike most of the blocks in Control tab, Joystick doesn't have any Execution output wires (aside from After, of course).

Notes

These are the following settings for the script block:

XZ: Outputs XZ vector values perpendicular to camera direction (while assuming that the screen is always facing straight to a certain axis).
Screen: Outputs XY vector values regardless of where the camera is facing.

If you use the XZ option, Joystick may not give the right outputs you need, because it only gives values perpendicular to the where the camera is facing. The values will seem normal if the camera is facing in Y-axis upwards or downwards, regardless of angle, but if it's facing sidewards or front and backwards it will only output X-axis value if you're looking at Z-axis and vice versa.

In this case you could instead use the Screen option which ignores where the camera is facing. This will help but also there's still one more problem to solve: it only outputs values upwards and sidewards now! This vector should now be rotated with Rotation input 90, 0, 0.

Button

Adds button(s) in the screen.

Notes

These are the settings for the following script block:

Button: displays the button as a circular button
Direction: displays the button as a directional arrow

Depending on the number of buttons set to Direction, they will display the following in left-to-right order:

1 button: ↑ .
2 buttons: ← , → .
3 buttons: ← , → , ↑ .
4 buttons: ← , → , ↓ , ↑ .

In total with the circular Button settings, UI is displayed in this manner:

1 button: right side.
2 buttons: both sides, with any Button set to Direction substituting the left first, unless a Joystick control exists, in which case the right will be substituted first.
3 buttons: similar to previous, but the slide to split the buttons depends on how many current Direction buttons are set: 2 and more will split the left, lesser will split the right. Regardless, directional button replacement occurs in left-to-right order.
4 buttons: spread equally, with directional buttons taking the place of first, second, fourth, and third column sequentially.

@@ Line 1: / Line 1: @@
-with these you can use a joystick and buttons to controls things in your games.
+The '''Joystick''' and '''Button''' blocks add UI controls to the screen.
+They will display only when they are executed.
-[[File:Joystick_And_Button.jpg]]
+Several combinations can be used below.
-You can use several combinations, as shown in the image bellow.
+{{Image|Joystick_and_Button_combos.png}}
-[[File:JOYBUTONEX.png]]
+In a game, there can be only up to 2 joysticks, 4 buttons, or when used in combination, 1 joystick and 2 buttons ''per frame''.
+Going above this limit produces an error of "Too many controls!"
-But there's a limit to keep in mind, imagine a joystick is worth 2 points, and buttons are 1 point, then the limit is that you can only use up to 4 points.
+They were introduced in [[Version History#fancade-1-8-9|version 1.8]].
-So you can only have:
-* 2 joysticks
-* 1 joystick and 2 buttons
-* 1 to 4 buttons
 = Joystick =
 {{Block
+|title=Joystick
 |image=Joystick.png
 |type=s
@@ Line 23: / Line 23: @@
 }}
-Adds joystick(s) in the screen. Unlike most of the blocks in Control tab, Joystick doesn't have any execution (yellow) output wire
+Adds joystick(s) to the screen. Unlike most of the blocks in Control tab, Joystick doesn't have any {{Port|e|Execution}} output wires (aside from {{Port|e|After}}, of course).
-[[File:joystickwire.png]]
+== Notes ==
-=== Output ===
-* Joy Dir: (Joystick Direction) Outputs joystick movement's direction.
-=== Settings ===
+These are the following settings for the script block:
-  * XZ - Outputs XZ vector values perpendicular to camera direction (While assuming that the screen is always facing straight to a certain axis)
+* '''XZ''': Outputs XZ vector values perpendicular to camera direction (while assuming that the screen is always facing straight to a certain axis).
-  * Screen - Outputs XY vector values regardless of where the camera is facing.
+* '''Screen''': Outputs XY vector values regardless of where the camera is facing.
-== Notes ==
+If you use the '''XZ''' option, Joystick may not give the right outputs you need, because it only gives values perpendicular to the where the camera is facing.
+The values will seem normal if the camera is facing in Y-axis upwards or downwards, regardless of angle, but if it's facing sidewards or front and backwards it will only output X-axis value if you're looking at Z-axis and vice versa.
-If you use the **XZ** option, Joystick may not give the right outputs you need, because it only gives values perpendicular to the where the camera is facing. The values will seem normal if the camera is facing in Y-axis upwards or downwards, regardless of angle, but if it's facing sidewards or front and backwards it will only output X-axis value if you're looking at Z-axis and vice versa.
+In this case you could instead use the '''Screen''' option which ignores where the camera is facing.
+This will help but also there's still one more problem to solve: it only outputs values upwards and sidewards now!
+This vector should now be [[rotate]]d with '''<font color="ffa500">Rotation</font>''' input <code>90, 0, 0</code>.
-In this case you could instead use the **Screen** option which ignores where the camera is facing. This will help but also there's still one more problem to solve: it only outputs values upwards and sidewards now! Well, the solution is actually pretty simple! Just use rotate vector with **<font color="ffa500">Rotation</font>** input [90, 0, 0].
+{{Image|Joystick_solution.jpg}}
-[[Uploads/Joystick_Solution.jpg]]
+= Button =
-***
-= Button =
 {{Block
+|title=Button
 |image=Button.png
 |type=s
@@ Line 57: / Line 55: @@
 Adds button(s) in the screen.
-=== Output ===
+== Notes ==
-* Button: Executes when the button display is pressed.
+These are the settings for the following script block:
+* '''Button''': displays the button as a circular button
+* '''Direction''': displays the button as a directional arrow
+Depending on the number of buttons set to '''Direction''', they will display the following in left-to-right order:
-=== Settings ===
+* '''1 button''': {{Arrow|8}}.
-  * Button - displays the button as a circular button
+* '''2 buttons''': {{Arrow|4}}, {{Arrow|6}}.
-  * Direction - displays the button as a directional arrow
+* '''3 buttons''': {{Arrow|4}}, {{Arrow|6}}, {{Arrow|8}}.
+* '''4 buttons''': {{Arrow|4}}, {{Arrow|6}}, {{Arrow|2}}, {{Arrow|8}}.
-Setting the display to "Direction" mode results in the following:
+In total with the circular '''Button''' settings, UI is displayed in this manner:
-* 1 button - one button is displayed as arrow pointing up
-[[Uploads/Up_Front.jpg]]
-* 2 buttons - two buttons are displayed as arrows facing left and right respectively.
-[[Uploads/2-Sides.jpg]]
-* 3 buttons - three buttons are displayed as arrows facing left, right and up respectively.
-[[Uploads/Side-Up.jpg]]
-* 4 buttons - four buttons are displayed as arrows facing left, right, down and up respectively.
-[[Uploads/All_four.jpg]]
+* '''1 button''': right side.
+* '''2 buttons''': both sides, with any Button set to Direction substituting the left first, unless a Joystick control exists, in which case the right will be substituted first.
+* '''3 buttons''': similar to previous, but the slide to split the buttons depends on how many current Direction buttons are set: 2 and more will split the left, lesser will split the right. Regardless, directional button replacement occurs in left-to-right order.
+* '''4 buttons''': spread equally, with directional buttons taking the place of first, second, fourth, and third column sequentially.
 [[Category:Blocks]]