Web Class: How to Detect Touch Input for Mobile

Web Class: How to Detect Touch Input for Mobile

You can access the full course here: Mobile Game Development for Beginners

Transcript

Hey everyone, in this lesson, we are going to be setting it up so we can actually touch stuff on the screen. We’ll be detecting touch inputs, and then we’ll be shooting a ray cast towards what we touched and interacting with that object in some way. What we’re gonna be doing with the interaction is actually changing the color of whatever we touched to a random new color.

So what we’re gonna do now is go to our Scripts folder, I’m gonna right click here, I’m gonna create a new C# script called ColorChanger. And what I’m gonna do is also just attach this to our main camera here. And then we can open up the script inside of Visual Studio.

Okay, so to begin, we are going to actually just have one function, and that one function is going to be the update function, which gets called every single frame of the game. And this is actually the only function that we’re gonna be needing and using in this script. So, inside of the update function, what do we wanna do?

So the first thing I’m going to do in the update function is check are we touching the screen? So we can go if input to access the actual input class of Unity – which has many things such as keyboard inputs, mouse inputs, and, of course, touch inputs.

So it will go if input .touchCount if this touchCount is greater than zero, so if there are more than zero touches on the screen and the input.touches, now touch input.touches is a array of all the different touches that are currently on the screen, so to access the first or if there is only one touch on the screen, we can just access the zero element, the first element of the array. If that touch.phase, now there’s also a phase for a touch. And there are multiple different phases such as began, moved, stationary, released.

So if this touch phase equals equals, TouchPhase.Began, so, if there is more than one touch on the screen, and that touch has just begun, if this is the frame that this touch has just touched the screen, then what we’re going to do is create a ray cast from where we touched it on the screen first of all. So it will create a new ray here, and it’s gonna be equal to our Camera.main.ScreenPointToRay. And the point on the screen we want to create a ray cast from is going to be the Input.touches, the first touch .position. So this is gonna create a ray cast on the screen from where we touched, and it’s gonna be shooting at whatever we are pointing at.

Since we are gonna be hitting an object and we need to know information about that object, we also gonna create a RaycastHit object here, which is gonna store all the info of whatever we hit. And finally down here we can shoot the ray cast by going if Physics.Raycast we can enter in our ray. And then we wanna send this out to the hit of pretty much whatever we hit, we wanna send it to hit.

And so if we shoot that Raycast, what we wanna first check of all is, did we hit something? So, if hit.collider doesn’t equal null, if we did hit something, then what we want to do is change this object mesh renderer color. So I’m gonna create a color variable here, I’m just gonna call this our newColor. And this is just gonna be equal to a new Color and we’ll just give it a random red, green and blue values.

So I’ll just give it a Random.Range between 0.0 and 1.0 because this Color class here, it takes in its RGB and A values not as zero to 255 as it would be in the editor, it’s actually between zero and one. So we’ll do that. Then actually, I’ll just copy this Random.Range here and paste this for the green and blue values. And for the alpha, I’m just gonna set this to one and then I’ll flexor.

So now we have a new random color. That can really be anything on the color wheel and what we wanna do now is set this to the object we hit, we wanna set it to its mesh renderer. And for that, we can just go hit.collider.GetComponent, we wanna get the MeshRenderer component, which is pretty much the component that renders the mesh, applies the material and so on. And with this, we wanna just access the material variable, and access the color of that material and set this to be our new color. So great, that’ll all work.

But since we’re in the editor and not actually on a mobile device, we won’t actually be able to test this out. So what we can do is actually also down here, create a different version that will actually work on the desktop work inside the Unity editor. And for this, we’re just gonna be checking for mouse inputs.

So here we’ll just go if Input.GetMouseButtonDown. If the mouse button was zero, which is the left mouse button, so on the frame that we push our left mouse button down. We pretty much wanna do exactly the same as we done up here so I’ll just copy this, paste it in here and I just wanna change Input.touches to be Input.mousePosition all like so and something else you can do in Unity is make it so that only certain code is actually ran or actually is actually compiled depending on the platform that you’re playing it on.

So what we can do is actually just above this if statement here for the mouse inputs, we can go hashtag if and then a space, we can go UNITY_EDITOR and then after this if statement here we can just go #endif. Now what this does is basically makes it so everything between this hashtag if and this #endif will only be compiled so the game will only recognize this if we are in the platform of Unity editor. So once we build this to our mobile device, this code here weren’t even be looked, it won’t even exist really in the final game. It won’t be recognized. And this is a great way if you do have something like this because mouse inputs can also be detected on touch inputs. So this would be quite conflicting if this was included inside of the mobile build.

All right, so that script ready to go, we can go back to the editor, wait for that to compile, wait for our last to go, we can press play. And when we select a object, we should be able to change its color. So I’ll click on the ball here. And as you can see it changed. We can click on this over here, we get to click on a bunch of different things. And the color will change. So you can press play.

And actually what I’m gonna do is move the camera a bit closer since it is kind of far at the moment. So I’ll just move it down like so. And yeah, there we go.

So in the next lesson, we are gonna be testing this out on our device. We’ll be first of all building this to an Android device. And then the lesson after that will be for all you iOS users. We’ll be going over how to build this to iOS, how to set it up through Xcode and have it on your device. So I’ll see you all in the next lesson.

Interested in continuing? Check out the full Mobile Game Development for Beginners course, which is part of our Unity Game Development Mini-Degree.