Time to make thing game actually playable on mobile.
After making a build that would load on the phone to see if all the UI was the right size/place it was time to start making all those controls work for real.
Here we are going to be cheating, well just a little. We can use the asset store to get a free package from Unity called Standard Assets, after logging into unity and adding them to our assets, we can then import them to our project!
After it’s finished importing you should see a new folder in the assets folder.
After expanding the folder you will see a lot more folders, the one we want is called “CrossPlatformInput”, open that folder up then Prefab. We want the MobileSingleStickControl.
Now we can drag it into the hierarchy. You should now see some buttons on the screen.
Currently, they won’t be doing much atm. We can change that pretty shortly though. If you want, here you can change out the images for the buttons and if you need more than 1 button (which we do) you can just duplicate the jump button.
Now that we have the buttons in place, let’s make them do something.
First, we are going to click on the new A and B buttons and change their names on the script, this is important.
Scripting time!
Open up the player script, Let’s start with the attack/A button. Head down to the update method where we check for if the player hits the left mouse button.
Here we are going to use the cross platform controller instead of unity’s input.
Although for this we will need to add “using UnityStandardAssets. CrossPlatformInput;”
Now we can type CrossPlatformInputManager.GetButtonDown(“A_Button”), this has to be the same spelling as what you put on the button before.
Now we should be able to test out that button, to see if it’s working.
Now for the movement and jump buttons. Back on the player script, go to the movement method, we are looking for where we use the Input again.
For where we get the Horizontal axis, we can do a straight swap from input to cross platform input manager (wowy that’s a long name to type out over and over, CPIM it is from here!)
We can test this one out before doing the jump. It is good to test when things are changed. Since changing too many things and then having everything not working is a lot harder to work out what is wrong compared to change 1 thing, test 1 thing.
Now for the jump. The only difference between the A and B button codes is just where it looks for the name of the button, the “A_Button” part.
and testing time! My first test didn’t work since the names of the B button and code were different, that’s how important those names were. B_button vs B_Button, after changing them it was all working properly.
For testing on the computer, I would recommend having the jump work with either space or the B button. We can do this with add an Or to the if statement which is done by adding || which is normally just above the enter key on your keyboard.
Now when we are testing we can jump while moving which makes it a lot easier to get across those jumps!
But with that, we have added in some mobile controls. Next is to test it out on your phone, one thing you may find though is the controls are smaller/bigger than you are expecting.
Extra:
Fix for Buttons being too small/big on phone but fine on the computer.
If you click on the MobileStickController we first dragged into the scene, you will see it’s basically a canvas.
Since it’s a canvas, we can use a nice little component that will help out so much. The canvas Scaler.
Add one to the controller and change it from Constant pixel size to Scale with screen size. Next set the Reference Resolution to 1920 x 1080, you can change it to favor matching the height if you want, I find it works out better. And done all fixed!
Let’s try this again… And with that, we have a working mobile input for our game while still being able to test it out on the computer. Thanks for staying this long and I’ll see you in the next one!
