Get Started - harpwood/Easy-Virtual-Joystick-for-GameMaker-LTS-2022 GitHub Wiki

To quickly and easily start using the Easy Virtual Joystick with just a few lines of code, follow these steps:

  1. Create a new project and import the script.

  2. Create a new object named o_vj_controller and add it to the room.

  3. Add a Create event in 'vj_controller' object and add the following line of code:

    // Create event
    vj_left = new virtual_joystick();
    
  4. Add a Step event in 'vj_controller' object and add the following line of code:

    // Step event
    vj_left.step();
    
  5. Add a Draw GUI event in 'vj_controller' object and add the following line of code:

    // Draw GUI event
    vj_left.draw_gui();
    
  6. Add a Clean up event in 'vj_controller' object and add the following line of code:

    // Clean up event
    delete vj_left;
    

Run the game using F5. The virtual joystick should appear at the bottom left corner of the game window. Congratulations! You have successfully created your first joystick using this extension.

To continue, let's create an object for the player and name it o_player. We will be programming the o_player object to move in a similar manner to a top-down shooter game. To do this, we will need a sprite for the player, which you can use the one provided here:

You can find it in the assets folder of this repo, or just right click the sprite above and select the "Save Image as..." option from the drop down menu. Once you have the image, import it into your project, and be sure to set the origin as "Middle Centre". After that, assign the sprite to the o_player object. Then, follow these steps:

  1. Put the o_player object into the room.

  2. Add a Create event in the o_player object and add the following lines of code:

    // Create event
    last_direction = 0;
    last_angle = 0;
    max_speed = 6;
    
  3. Add a Step event in the 'o_player' object and add the following lines of code:

    // set a local _speed variable to zero
    var _speed = 0;
    
    // Use the last direction if there is no input from the virtual joystick
    var _direction = last_direction;
    var _angle = last_angle;
    
    	// Get the processed input from the virtual joystick
    	with o_vj_controller
    	{
    		// The virtual joystick gives values between 0.0 and 1.0, so we multiply by the max_speed variable
    		_speed = vj_left.speed * other.max_speed;
    		
    		// If the direction from the virtual joystick is undefined, keep the last direction
    		_direction = vj_left.direction == undefined ? _direction : vj_left.direction;
    		
    		// If the angle from the virtual joystick is undefined, keep the last angle
    		_angle = vj_left.direction == undefined ? _angle : vj_left.direction;
    		
    	}
    		
    /// Apply the speed, direction, and angle to the player object
    speed = _speed;
    direction = _direction;
    image_angle = _angle;
    
    // Save the last direction and angle for the next step
    last_direction = direction;
    last_angle = _angle;
    

We used the virtual joystick's internal public variables speed and direction output values to control the player's movement. We used the virtual joystick's internal public variables speed and direction output values to control the player's movement. However, if you're developing a game in a specific genre, like a platformer, or using the joystick with other solutions or your own implementation, you may want to access the axis_h and axis_v variables instead of using the speed and direction output values. These variables provide the horizontal and vertical inputs in isolation for each axis, giving you more control over your implementation. This approach is particularly useful for developers who want maximum control over their game.

Now, run the game again. You should be able to control the player with the virtual joystick!

To continue with this example, we need to add a second joystick to the right side of the screen. But before we do that, let's take a closer look at the virtual_joystick script we've been using to move our player. Understanding this script will help us better implement our second joystick.

Previous : Home Next : The virtual_joystick constructor