In this tutorial we will be creating a weapon that is attached to our character. We would learn also to set up a character that is able to jump and move freely along with his weapon. This weapon would able to shoot cannon balls that explodes upon collision.
Also, we would be able to control our weapon's rotation and power using some of hyperpad UIs. Because we will be using gravity and physics objects, our project's global view will be set up as side view.
Adding the Environment
Before we start let's get all the assets that we will need for our game from the hyperPad Shop. The asset packages that we will use in this tutorial are 'Platform Starter Pack' and 'Puzzle Pack'.
The first thing that we will do is to add a simple platform, our blue alien character, and some crates that we can use as firing targets. Make sure that our character and all the crates are set up as physics objects, and the wall and our platform be set up as wall objects.
Setting up our Character
We will add some behaviors that we can use to control our character in our game. Refer to the diagram below for the behaviors that we will add. To control our character's movements, we will be using the joystick and jump button behaviors.
An idle animation is played initially, a walk animation is played whenever we move our joystick, and a jump animation is played whenever we press our jump button. Notice that we turn off our jump button behavior immediately after the event. This ensures that our character can only jump one at a time. After that, we turn it back on again on the event that our character stopped falling along with the idle animation being played back again.
After adding the specified behaviors, two new UIs were automatically added to our scene. We can now move our character around using the joystick and the jump button.
Setting up our weapon
In this tutorial, we will have our weapon to be permanently attached at the back of our character. First, we will add the object to visualize our weapon.
We will use the green pipe object from the 'Puzzle Pack package' that we've downloaded as our weapon. Let's add it to our scene and set up its transform properties. Refer to the diagram below for its appropriate scale and anchor point. It's order value should be less than what we have with our character to bring it at the back.
After setting up its transform properties, let's move our weapon at the back of our character. I'd prefer to use the grid lines to snap it perfectly at our desired position.
Although its a pipe, we will use it to visualize our canon ball firing weapon.
Next, we will add the behaviors that will allow it to be attached to our character.
A timer behavior will allow a loop that is executed on every physics update. One physics update is exactly 1/60 Hz of our game's physics refresh rate, which is equivalent to 0.016667 seconds. For every update, we will get the position our character and then move our object according to its x and y values with a movement duration of zero.
Let's try it out, and we will see that the cannon is now firmly attached to our character.
Weapon rotation control
The next thing is to add our control for the rotation of our weapon. For this, we will add another joystick that will have some functional behaviors. Previously, we've added our joystick for movement by adding a 'Joystick Controlled' behavior, but now, we will add it manually.
Make sure you are in the same layer with our first joystick, press the bottle icon then select the joy stick option.
Once we've added our joystick object, let's position it slightly above our movement joystick, then modify its color that will suit its function.
Next, let's add the behaviors for our joystick. A joystick analog behavior was automatically added to our newly created joystick, we will just need a rotate to angle behavior for this one. Press the 'Change Manually' property of that behavior, then supply the joystick analog angle value to its rotation value.
Try it out and we will see that our weapon is rotating accordingly with our joystick analog position. Notice that our weapon is rotating based on its anchor point that we've set up before.
Creating our cannon ball
Now that we have our player and weapon control, we will now make our weapon shoot some cannon balls and have its own explosion particles.
Let's add a 'ball object' to our scene from the 'Puzzle Pack' package. This will serve as our cannon ball object.
Modify its properties accordingly with our diagram above and make sure that it has a round collision shape.
Upon collision, these cannon balls will emit some explosion particles. To create this particles, we first go to our assets folder, then press the 'Create Effects' category, then select the 'Particles' option. On this menu we will select the 'Explosion' particles from the top selections. We will use that default explosion particles for our cannon ball. Hit save and we should be able to see our new asset inside the 'Particles Folder' of our Assets Folder.
Next, we will add the behaviors for our cannon ball. We will set up that the object will be destroyed upon collision on any object, then execute the start particles behavior. We will supply explosion particles that we've previously created on this behavior. This cannon ball should also ignore collisions on our character and his weapon.
Firing power control
The last thing that we need to do is to add the capability of our weapon to fire cannon balls. We will also create a power bar that will determine the firing power of our weapon. And then, we will add a firing button that will enable the spawning and firing of our cannon balls.
Let's first add the power bar for our weapon firing power by creating a 'Health bar'. We do this like how we manually did it for our 'weapon rotation joystick', by pressing the 'bottle icon' at the bottom panel of our scene editing menu.
We've set it up so that the height is longer than its width. We also paint it with colors that define its usage. We also want it so that the power bar rises from bottom up to the top.
Next is we add our firing button. Just look for the button asset object inside the 'UI Folder' of our Assets Folder. Place it beside our 'jump button' and below our 'power bar', and paint with a definable color.
After that, we will now add the behaviors for our firing button.
Once the user touches the button, we will set the percentage of our power bar to zero.
While the button is being pressed, the power bar's power will continually rise by one per frame. We first get its current progress, add it with 1 value, then set that value to its percentage.
Upon releasing the firing button, we now then spawn our cannon ball almost at the tip of the cannon. Object B Anchor of the spawn object behavior should be set at the middle and slightly on top. Make sure that the recycle toggle is on to save memory space.
After that, we must wait for the next physics update for us to be able to apply force on our newly created cannon ball.
After the next physics update, we should now be able to apply directional force on our spawned object.
We will use the rotation of our cannon to get its normalized direction. Normalized x direction is a math function cosine with an input value of the cannon rotation value. Y direction is a math function sine with the same input value.
After getting the normalized direction, we will need a force multiplier that is based on the percentage of our power bar. We first get the percentage value of the power bar, then multiply its value by 5. We slightly increased its power to match the appropriate force needed for our cannon.
We then supply the x and y force, and force multiplier to our Apply Force behavior, which is directed on our spawned object.
Test it out and you should be able to spawn cannon balls by pressing our firing button.
Congratulations! You made a simple plat-former game with a player controlled weapon on hyperpad. Play it out and blast those crates away!