Introduction
Physics can be a complicated subject when developing our games, added to the construct limitations, it can make for terrible headaches.
That's why I created this tutorial.
A rope can be easy to make, just put an arbitrary number of different sprites and connect them with the Physics integrated behavior. But that is not very efficient nor reusable. As the book "Clean Code'' tells us, "Don't repeat yourself" (DRY).
To start with, we should try to use the least amount of objects possible, this tutorial uses 2, but with vanilla javascript you can try only with one (We cannot pass objects as arguments).
The use of loops is very important for DRY, we want our code readable. We can achieve this by using functions and other tools that the engine provides.
Let's start coding!
We will create these three objects, for our demonstration, we will call the objects where the cables connect "Machines" but this can be whatever you want.
All the objects must have the Physics behavior. We will deactivate the collisions between them later. The cables should have 2 Image Points, the Origin on the far left and the second one on the right, and the "Cable1 '' must have a "IsLast" instance variable, we will use this to move the cable around with our mouse.
For our purposes, we added a bool variable, so that we can only create one cable and then connect to the other "Machine". We wait until the player clicks on a "Machine" and then create our first piece of cable (Cable1) on it, adding a revolution point on it allows for rotation, but not translation.
We use a repeat loop to create as many pieces as we want, each loop creates one "Cable2" and then one "Cable1", each on the last sprite's ImagePoint1 and revolution points on it.
Then, after the loop is finished, we set the last created "Cable1"'s "isLast" variable to true.
Below that, we disable all the collisions for our cable, we place it inside the "On Left Click" condition so that different cables can interact with each other.
Adding an impulse to the last "Cable1" allows us to control it with our mouse.
And the final line, we create an else statement below our "isCabling" to disable the "isLast" of the "Cable1" so that it stays in place and connects to the other "Machine".
Done!
This is working! Now it's time to play with the numbers and make it a little bit fancier!
Hope you found this tutorial useful and entertaining!
You can follow us on:
Instagram
Twitter
Git-Hub
Youtube
Website