VisualScript：Move an object in 2D.

Explains how to move the most basic 2D node.

Make the image move when you press left, right, up, or down on the keyboard.

Advance preparation

Create a project and add Node2D / KinematicBody2D / Icon nodes.

１．Create Project

• Select "New Project"
• Enter an appropriate project name.
• Click Create Folder.
• Select "OpenGL ES 2.0".
• Select "Creat & Edit".

2.Add node

• Create 2D Scene.
• Add Child node(Kinematic Body 2D) to "Node 2D".
• Drag ＆ Drop "Icon.png" to 2D-Area.
• Drag ＆ Drop Icon-Node to KinematicBody2D.
• Select KinematicBody2D and set so that child nodes cannot be selected.
• Set the coordinates of both KinematicBody2D and Icon to (0,0).

3.Attach GDScript file.

• Select & Right-Click KinematicBody2D,and select "Attach Script".
• Check select "Language:GDSctipt",and enter path sctipt name.
• Select "create" button.

Check input map

Check the event name corresponding to the key input.

1.Select Project -> Project Settings -> Tab:Input Map

2.Check the event names corresponding to the Up, Down, Left, and Right of the keyboard. It was "ui_up","ui_down","ui_left","ui_right" in my environment.

Definition of required variables

Specify the variables required to move.
A variable for movement speed is required, so define it.

Member: Select + to create a variable and add one variable.
Name it "speed".

Right click and select "Edit Member".
Type is "int" and the value is "150".

Get keystrokes

There are two steps from now on, "Getting the state of the key" and "Specify the direction of the velocity parameter according to the got key input".

"Getting the state of the key" can be obtained with the action function.
Right-click in an empty space and enter action to create the "Action" block.

With the Action block selected, set the Action setting to "ui_right" from the Inspector window on the right.

Similarly, create Action blocks for "ui_left", "ui_down", and "ui_up".

The output of this Action function is called bool type, and either True or False is output.

Vector parameter settings

Since the bool type that has acquired the key input is difficult to use.
It is converted to the numerical type (Int type) of 1 (True) / 0 (False).

Use the Construct IntBool block to convert a bool type to an Int type. (To add it, right-click with Action and search by block name)
Add this for all actions and connect each with a line.

Next, calculate the direction of movement.
A variable that indicates the direction in two dimensions uses a type called Vector2.

Add an Expression block.
This is a block that can perform arbitrary mathematical transformations.

From the Expression inspector window, set the output type to Vector2, the number of inputs to 4, and the input variable type to Int type.
It is easy to understand if the name of each input is left / right.

Enter "Vector2 (right-left, down-up)" in the Expression.
This sets the parameters for the orientation of the 2D vector according to the key input.

After that, the output Vector2 expression is normalized to a vector of length 1 with the Vector2 normalized block.
Because , that if there is a simultaneous push of right and bottom, the length of the vector becomes √2 ≒ 1.414 ... and the moving speed becomes about 1.4 times.
To prevent this, normalize with a vector of length 1 and then apply speed.

Simple multiplication also uses Expression.
Create an Expression whose input is Vector2 and Int type.
If you want to use the defined variable, you can create a block to get the value of the variable by dragging and dropping from the variable of the member.

Move a node using vector parameters

Finally, put in the control to move the node.

Add the function move_and_slide that moves KinematicBody and connect the speed parameters as they are.
The ▽ on the upper left of the block is the place to set the timing to operate this block.

The process that changes from moment to moment is basically executed every frame.
The function that outputs the trigger (operation timing) for each frame is the process function.

This block can be added from the member: function.

Finally, connect the process block and the moce_and_slide block and finish.
When this is executed, the program should move the image by key input.