Touch Movement Joystick Using the New Input System | Unity Tutorial

Подписаться 22 тыс.

Просмотров 31 тыс.

50% 1

This week you can learn how to add a Touch Movement Joystick to control your player using the New Input System. We'll specifically look at how to do that with a NavMeshAgent, but the same concept can be applied to Rigidbody movement or a CharacterController. In this tutorial you'll learn the full end to end process of Joystick Creation, Canvas Setup, & Code, along with some of the "gotchas" I learned when implementing my own mobile game so you don't have to run into the same struggles!
The Enhanced Touch API raises events onFingerDown, onFingerMove, and onFingerUp events to us when the user touches, moves, or lets go of the screen. It keeps track of which finger is doing what, so we can track each finger separately.
💸 Ongoing sales 💸
⚫ See all active asset sales on the Asset Store: assetstore.unity.com/?on_sale...
⚫ Save 25% off your first Asset Store Order: prf.hn/click/camref:1101l9QvC...
⚫ Save up to 50% on NEW Assets: assetstore.unity.com/?new_sal...
👨‍💻As always, the full project code is available on GitHub: github.com/llamacademy/mobile... for you to play around with.
📚 Resources
⚫ Enhanced Touch: docs.unity3d.com/Packages/com...
⚫ Unity Manual for Touch Input: docs.unity3d.com/Packages/com...
❤ Believe in LlamAcademy's mission and have received value from the videos? Become a Patreon Supporter or RU-vid Member:
⚫ Patreon: / llamacademy
⚫ RU-vid Member: / @llamacademy or click the Join button on any video
📱 Let's stay connected
RU-vid: / llamacademy
Patreon: / llamacademy
Facebook: / llamacademyofficial
Twitter: / thellamacademy
TikTok: / llamacademy
Instagram: / llamacademy
----
Most tutorials come from knowledge gained making survival.llama.software Llama Survival - a top-down zombie survival shooter for Android and iOS.
I also have some Unity Assets (affiliate link): assetstore.unity.com/publishe...
Some links may be affiliate links, which at no additional cost to you, gives me a small portion of the purchase.
#unitytutorial #tutorialtuesday #gamedev #tutorial #unity #llamacademy #gamedevelopment
Chapters:
00:00 Adding Touch Input Support - High Level Overview
02:32 Creating your Joystick & Canvas Setup
04:18 Quick Scene Overview & Enable Virtual Touch
05:12 References & FloatingJoystick.cs Review - PlayerTouchMovement.cs
06:44 Enable Touch Support & Add/Remove Event Listeners - PlayerTouchMovement.cs
07:30 HandleFingerDown - PlayerTouchMovement.cs
09:46 HandleFIngerMove - PlayerTouchMovement.cs
11:10 HandleLoseFinger - PlayerTouchMovement.cs
11:44 Actually Moving the Player - PlayerTouchMovement.cs
13:32 Demo & Thoughts on Player Rotation

Опубликовано:

14 июл 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 96

@matanyamin1 Год назад

Sir, I want to thank you so much for this tutorial, personally this fixed me a lot of problems I had with my Inputs. Great tutorial, great explanation, Thanks!

@bigofbig4884 Год назад

Thanks for tutorial, that was really Meat On Bone♥ . Hope You The Best.

@TheMaykson Год назад

Thank you for this!

@runrajrun Год назад

Thanks dude! This helped a ton! :D

@LlamAcademy Год назад

Awesome 😎! Happy to hear

@benseekings2552 Год назад

Thanks for the tutorial! I'm planning on swapping my mobile controls to the input system and this is just what I need. Would be good for a future video to integrate mobile controller support as well - perhaps with a basic menu to switch between both? Anyway keep up the good work.

@LlamAcademy Год назад

Thanks! I hadn’t thought about that even though I have that implemented in my game 😅. I will add that to the list

@biki_02 Год назад

Bro.you are amazing.Very well explained.thank you.

@LlamAcademy Год назад

🙏 Thank you!

@Ashkan-yf8eu 11 месяцев назад

Thank you!❤

@Nick-rq4gy Год назад

Thank you so much

@SAAVYentertainment 21 день назад

Thank you so much is very straight to the point (y) I'ive been looking to how to map one key (E) to a screen button, its very simple but there is no documentation or something about it Thank you

@ozzie7034 Год назад

Thank you!

@LlamAcademy Год назад

You’re welcome 🙌!

@MarekNijaki Год назад

Awesome tut! Could you make follow up with handling touches for camera itself. Eg like in Fallout Shelter game(base management mode), where you can pan camera, zoom in and out, smooth it movement, move based on swipe speed etc?

@LlamAcademy Год назад

Sure, I had some future topics planned for the camera handling, so I'll add this as one of the options to look at in the future! Thanks for the idea

@TheDurpaDurpa Год назад

Thank you for this! just subscribed. This is almost exactly what i was looking for. One question though, i would like the exact same touch and move functionality but without the joystick being visible. Would it be possible to simply remove everything related to the joystick and having the player move in the same way no matter where i press on the screen? if not then maybe i could simply hide it in the inspector? i am building a hyper casual game. Now i have to binge watch all your content during the weekend 😂

@LlamAcademy Год назад

What you’re describing might be kind of weird controls, but yes, you could just not render the joystick (don’t have to set the objects active) and you should be able to get it working

@mecadiego113 Год назад

Amazing video and thank you for the tutorial! Any advice on how can I implement the joystick aiming (rotation) you tease at the end of the video. I'm having issues with that, because when I rotate the player's rigidbody, the movement (using the movement joystick) doesn't follow the forward direction

@LlamAcademy Год назад

I’m using the same concept there, just applying the force based on the current velocity and the current forward of the player. The transform has localRotation and forward properties. You can use to apply force based on these values to smoothly accelerate and decelerate

@monkeymonkey69696 Месяц назад

"Hey chris here from mom academy " youtube Subtitle (Nice Video btw ;))

@LlamAcademy Месяц назад

🤣 here to help you make your motherhood dream become a reality

@sumnererhard8865 Год назад

Excellent video! Curious if this joystick will work in a scene with UI elements built with UI toolkit? For example if you had a pause button on the top left of your screen that was using the UI toolkit, how would you handle distinguishing between a Joystick input vs pressing the pause button?

@LlamAcademy Год назад

Great question. I think the easiest way to handle that would be on click of your Pause button, to disable input handling from the Joystick and to hide the Joystick. Then you don't necessarily have to worry about the co-mingling between the two.

@ChubachubaDH 8 месяцев назад

For some reason, there doesn't seem to be a definition for RectTransform in the floating joystick script

@inkofthedragon Год назад

Can you please do a quick rapid fire compliation of just "who me?" clips! 🤣 Thanks in advance!

@LlamAcademy Год назад

😁 that might be a fun end of year video!

@XadegamerOfficial Год назад

I would like to see camera for a third person mobile controller. Thanks for the helpful tutorials

@LlamAcademy Год назад

Sure! I had some future topics planned for the camera handling such as what you saw on the Llama Survival clips here!

@XadegamerOfficial Год назад

@@LlamAcademy being trying to use this technique to make a camera control for third person controller but not getting a good result like Oceanhorn, COD mobile or even Apex mobile. If you can make a tutorial to cover any of this, I will really appreciate it.

@mrcyruscrap 10 месяцев назад

Hi! Great tutorial! I was even able to figure out how to scale the joystick to fit different screen sizes. I have one question. My project is for PC and for android at the same time. I have input actions and control schemes: a joystick and a keyboard with a mouse. How do I make the interactions with the joystick bind to these input actions? Perhaps I need to somehow turn off the "keyboard with mouse" control scheme when I use this joystick?

@LlamAcademy 10 месяцев назад

I’m not totally sure 🤔 I think you are right about the enabling/disabling input action maps but back when I implemented my mobile + pc game I was using the old input system and just had different scripts that enabled / disabled themselves based on the platform

@OliMakesGames 11 месяцев назад

Great tutorial! Just one thing - when I add a button to the area where the joystick is active, the joystick still jumps to that position - even though I just want to press the button. I even tried to add an event trigger to the button (pointer down) to disable the function, but it seems the Enhaned Touch gets called first so it still jumps to that position! Is there a way to "layer" the joystick so it does not jump to the button presses or is "below" the button?

@LlamAcademy 11 месяцев назад

First, I would consider if you really want to have very many buttons on the half of the screen with the joystick. Most of the time (in my opinion) that results in it being harder to play the game. If you really need them, you have a few options. Probably the easiest one is if you do a GraphicsRaycaster.Raycast from onFingerDown and see if you've touched one of your buttons. If you did, just disregard the event. If not, then proceed with the logic here.

@arnabmondal3032 Год назад

hey mate I was wondering if there was a way to connect the input from this joystick to a inputActionAsset and use the input from the inputactionasset to move the player

@LlamAcademy Год назад

That might be possible. I thought that felt kind of backwards since you need to address the movement of the joystick handle anyway. I handle multiple input controls where touch option is handled like this and the keyboard / game pad is handled by those input actions

@1onGoogle Месяц назад

Hi, I've created a Third person shooter game. The problem is that it has both input system (new & old). I'm also using fixed joystick. But when I build it for android and run it from my mobile device the joysticks collides with the touch screen and not working separately. Any solution?

@PetersExcapades 3 месяца назад

this is amazing thank you! but im having some trouble, how can i detect if the touch is in a UI element?

@LlamAcademy 3 месяца назад

You can use the UI Raycast to find the specific elements docs.unity3d.com/2018.3/Documentation/ScriptReference/UI.GraphicRaycaster.Raycast.html

@maxg5196 Год назад

So how would you allow a finger to press multiple buttons at the same time by sliding over them? The implementation is I am trying to make a mobile joystick for movement on mobile, but there is also a run button above it, and if you slide your finger high enough while also dragging on the move joystick it will engage the running. Please help!

@LlamAcademy Год назад

For that one, I think I would try to make it by checking if the current touch position relative to the initial position delta was great enough that it would indicate the player had moved their finger into the "run" zone. If you really want it to be the same finger that has to initiate the "run" mechanic then you might consider making it a zone at 90% or something of the max radius. From what I've seen, usually for actions you use a second hand, no the same one that is moving the player, so I'd play with this to see if it works well or is just awkward to use.

@maxg5196 Год назад

@@LlamAcademy ok thanks. Yeah I was thinking something similar.

@ShironatsuKun Год назад

Is there a way to make this work on UI Scale Mode of "Scale With Screen Size" properly so when you run the game on different types of mobile devices the Joystick UI will automatically scale for different mobile phone resolutions? Or is there a different way to do this easily? I tried setting the UI Scale Mode to "Scale With Screen Size" so the joystick will automatically scale based on the device's resolution but the joystick just pops up with a weird distance from the point of Touch and the Clamping is also different so I just want to ask. Thank you.

@LlamAcademy 11 месяцев назад

Yeah, you can have it scale with screen size but you may need to consider the Canvas's scale to scale up the maxMovementDistance relative to the designed size of the Canvas

@fortnoc321 3 месяца назад

Hey did you figure out how to do this? Struggling to get it to work with "Scale with Screen Size"

@hasanrakib4811 Год назад

How can i add a second joystick on the right side of the screen. so i can use the left side joystick to move and the right side joystick to aim, like a twin stick shooter ?

@LlamAcademy Год назад

The way I implemented this was to track if the initial contact point was on the left or right half of the screen ( < or >= Screen.width ). Then handle each touch like we did in this video and just apply the input to the player object!

@justfine9809 2 месяца назад

Hello, Wonderful Tutorial. I need help. These 3 lines giving me an error. ETouch.Touch.onFingerDown += Touch_onFingerDown; ETouch.Touch.onFingerUp += Touch_onFingerUp; ETouch.Touch.onFingerMove += Touch_onFingerMove; error:CS103 on the "Touch_onFingerDown/Up/Move" the name does not exist in the current context.

@LlamAcademy 2 месяца назад

You have to create those methods in the PlayerTouchMovement.cs class. You can see them at 07:11

@wahebplays 11 месяцев назад

what about touchzone for camera Look (cinemachine &new input system)

@abuzzakasm9767 Год назад

nice tutorial ..im using unity new input system .. for free look rotating camera we use delta mouse position but what will i do if i want to do the same thing for mobile ? if i use gamepad left stick it keeps rotating unless i put my finger off .. i could not find any delta stick for reading the change of value . .Can you cover this topic?

@LlamAcademy Год назад

Sorry I don't think I understand the question. In this video I show how to use the delta position of the touch to drag the "knob" on the joystick for touch input controls. If you want to rotate a camera based on the delta position, you can use the same concept as here but apply it to rotation instead of position

@raifazhar9727 22 дня назад

Sir, I want to know know how can we fix the joystick to bottom left side of the screen. I tried to get the position of reactransform and then used RectTransformUtility.ScreenPointToLocalPointInRectangle but it did not work.

@LlamAcademy 21 день назад

If you want it to be fixed to bottom left you can just anchor it there on the Canvas and not move it around at all

@raifazhar9727 21 день назад

@@LlamAcademy but how to see if the user touch at the joystick because now we are not comparing with screenwidth/2f

@kastinante6883 Год назад

thanks , for a Beginner，actually useful，subscribe and like!🔥

@ghost0fherobrine203 Год назад

Well, I am doing this with a Rigidbody and on line 107: Vector3 scaledMovement = Player.speed * Time.deltaTime * new Vector3( I have an issue because speed isn't a part of Rigidbody so what should I do there?

@LlamAcademy Год назад

Usually when using a Rigidbody for movement, your PlayerMovement script has a field defined as maximum speed such as [SerializeField] [Range(0,5)] private float MaxSpeed = 2.75f; You can then use this in place of Player.speed.

@ghost0fherobrine203 Год назад

@@LlamAcademy Thank you! :)

@Ironlionm4n 10 месяцев назад

At 5:25 how did you determine the joystick size? When I looked back in the video your joystick had a width and height of 200 so not sure where 300 came from here.

@LlamAcademy 10 месяцев назад

I was just making up a default value of 300x300 on the JoystickSize on PlayerTouchMovement so we have some size by default. You can adjust this in the Unity Inspector if it's too big/small for your game. I just played around with values until I found reasonable looking ones for my case.

@lucasradioativo 11 месяцев назад

how to add other buttons?

@cgutierr-zgz 5 месяцев назад

Is there a way for "blocking" this joystick with UI elements on a canvas for example Buttons? I would expect to be a easy way of prioritizing a canvas click over another if theres a ui element already there like a button/slider... etc :D

@LlamAcademy 5 месяцев назад

Yes, you can use something like EventSystem.current.IsOverGameObject or check the selected game object to see if it’s a button or slider

@duck730 6 дней назад

When I select source image I have no option for circle-border-06 Anyone know how I can get it?

@LlamAcademy 6 дней назад

It's included in this video's project files on github

@alonsojetski 10 месяцев назад

The navmesh agent component does not appear when I click add new component :(

@LlamAcademy 10 месяцев назад

You may need to add the Navigation package from the package manager on very new versions of Unity

@Nick-rq4gy Год назад

Dear LIam Academy, Can This script be done with the Unity Starter Assets FPS Controller with the move and look touchpad? Could you make a tutorial on this for me for Unity Starter Assets FPS Controller? I have been stuck on this problem for a looooooong time.

@LlamAcademy Год назад

Yes! You can apply the same idea here just to the CharacterController component on the player prefab from the starter assets instead. For aiming, you can use another joystick or some other input mechanism to apply rotation using the same concept here, but I think that one is a little more tricky.

@Nick-rq4gy Год назад

@@LlamAcademy thank you very much for your help do you know of any float joystick scripts online that I could use and then after that once I've made the script to why you just drag it on to the move and look as a child in the hierarchy?

@LlamAcademy Год назад

@@Nick-rq4gy sorry, didn't understand your question. You can use the same concept for the floating joystick as we implemented here. It's just mapping the values to something else

@Nick-rq4gy Год назад

@@LlamAcademy so I went to the unity standard assets website and I downloaded the unity starter assets pack which has a FPS controller. so when I download my unity game to my phone the look pad which makes you look around on the right side of the screen stays fixed in place. When you play games like Call of Duty mobile the look pad on the right is a floating joystick it doesn't stay fixed in place like it does but the unity starter assets FPS controller look pad. I just want to mke the lookpad on the right hand side of the screen a floating joystick. If you help me to do this in Unity on Discord I'll make you props for your game, and build some things for you, and share any assets I find on the asset store that are really good.

@kolithehapty4883 Месяц назад

what if I don't want it to just be able to be touched on the left side?

@LlamAcademy Месяц назад

Then just don't check that condition 🙂

@tinyboy6458 Год назад

Plz do a video about brust compiler ❤️

@LlamAcademy Год назад

I haven’t used it yet, but I do have a use case for it so I’ll make it once I have enough understanding to teach about it

@tinyboy6458 Год назад

@@LlamAcademy ok 😀

@stefanpavlovic3548 Год назад

03:50 But what if i really need to use "Scale With Screen Size" is there any workaround?

@LlamAcademy Год назад

Yes. You can scale it with screen size but then you have to query the Canvas Scaler for the scale factor and do some additional math around that

@fortnoc321 3 месяца назад

@stefanpavlovic3538 Hey did you figure out how to do this? I'm struggling to find any information on it atm.

@stefanpavlovic3548 3 месяца назад

@@fortnoc321 I don't remember if i ever solved this.I abandoned that project shortly after that comment was written,now im working in godot

@fortnoc321 3 месяца назад

@@stefanpavlovic3548 Np thanks for the reply! It was a simple fix for me, I had a safe area helper shifting my UI objects for me and it was screwing up the scaling math.

@ZeeshanKhan-ny8pm 8 месяцев назад

what if i dont want to use navmesh agent?

@LlamAcademy 8 месяцев назад

You can do basically the same thing with transform.translate, character controller.move, or applying force to a rigidbody

@aytekinmuratatasever 6 месяцев назад

@andrewallbright Год назад

When will the new input system stop being new?

@LlamAcademy Год назад

Maybe when a new one comes out? 😆

@chiragsawajiyani8540 Год назад

Hi sir , I have a question like How to assign a unity event to a button.Onclick.addlisner() event. Like i have a button refrence in a script and instead of assign methode call in onclick event of that button i have a unity event in the same script which have that button refrence and invoke this event by using button.onclick.add listen (). Thanks

@LlamAcademy Год назад

Hi! Unity has documentation on how to do that with a bunch of options here: docs.unity3d.com/2019.1/Documentation/ScriptReference/UI.Button-onClick.html