How To Use Input Keys Inside Of Widgets In Unreal Engine 5 (Tutorial)

hey guys and welcome back to another Unreal Engine 4 and 5 tutorial so in today's video what we're going to be going over is how to set up using inputs and key bindings inside of a widget so as you may know you can't actually use key bindings in widgets so today I'm going to be going over how we can actually do that so if I were to hit play what you can see is that we're in the game if I were to press tab we can open up my inventory obviously nothing in here and if I press tab again we're going to close it now there are many different ways to do this you could just do this in the player blueprint however the way I'm doing it here means we can now interact with this widget a lot more efficiently which means because I've done it that way we need to be able to close it inside the inventory so I'm doing that a nice efficient way as well so this is only going over today so without further Ado let's delete this code and I'll show you how I've done it also I'm using new recording settings today so I appreciate any feedback you may have on this video whether it looks nice whether it doesn't look good whether you think there could be improvements here there or whatever and again I'm still just testing it all out first time using this new setup so I'm just trying to get it all work out perfectly so sorry if it's not perfect just yet and again any feedback is greatly appreciated so the first thing we want to do is we want to actually create this widget so what I'm going to do is just go to my content browser and open my inventory widget I have here I notice this is all I've got just a canvas panel background blur and a border again you can have in here anything you want once we've created this we want to be able to open it so to do that we're going to go to our player blueprint or wherever it is that you want to do this so for me this can be third person blueprints BP third person character and what I'm going to do in here is just right click and get my inventory action event which I have then in this is where I want to open it so above this what I'm going to do is get event begin play and I'm going to create widget with the class being my inventory widget I just created a moment ago and I'm going to promote this to a variable right by right clicking return value hitting promote your variable I'm just going to Simply name this inventory UI like so that's all I'm going to do then off of my input action here I'm going to get that inventory UI and add to viewport so I'm adding it when I want to open the inventory so I'll put that there like so then I'm going to right click and get player controller out of here I'm going to set input mode UI only with the in widget to focus being the inventory UI we just got there and this is what's going to make it more efficient for interacting with this widget and after this I'm also going to come out the get play controller and set show mouse cursor so we have the mouse cursor on screen like so that you'll see don't need to do if you don't want it on screen but in my case I do now here is where you may normally also do maybe a flip-flop or a branch so you can then add it to viewport and remove from parent as well again I'm doing it differently so we're going to compile save that and now we're going to go back into our widget which we want the input in now obviously you don't have to do everything I've just done there if this is different for you but the next part you are going to want to do if you want to be able to use an input inside of your widget so we're going to go to the graph and what you may want to do is just get the inventory action event here however this isn't going to fire off and you can't enable input in here that won't work what we're going to do instead is you'll notice up in the top left we have functions 39 overridable we want to override a function so if you hover over it you should get an override button here we're going to press override and we're going to get the on key down event this will allow us to actually use the on key down event for whatever we want so if we press a button it will work in here so let me move out this return node in key event we're going to come out of this and get key so whatever key the player has pressed the return value of this we're going to get equal equal and then we're just going to use the key we want so for me that is going to be tab now you can use any key you want in here just set it up and if you want to use more than one come out for Boolean get an or Boolean and come out the get key and get another equal equal connecting that in there setting it to whatever you want as well so let's say I like so and you can add in as many of these as you want just add a pin and do it again like so I'm not going to bother that as I just want tap once you've done that we're going to hold down B left click to get a branch connecting that in here like so with the condition being the equal equal we just created there or the all Boolean for you and out of true of this what we want to do is basically just the opposite of what we did to put it on screen so we're going to get player controller doing set input mode game only now not UI only going into true of the branch and I'll get a play controller again we're going to set show mouse cursor to false so unticked like so like so then the final thing is we want to just obviously remove from parent so we're actually taking this off the screen like this then out of the return node here the return value of this we want to just do handled that means basically just success then I'm going to copy the return node paste it down here and connect that into false of the branch with the return value being unhandled so essentially unsuccessful and that is all we need to do this will now allow us to actually interact with and use inputs inside of our widget we'll compile and save that like I say that's all the code we need to do but one final thing to make this work is go back to the designer select the root of your widget so this top one here so mine is inventory widgets and just make sure that it is focusable is ticked and that just means that you can focus inside of this widget so you can click in it you can use it and you can use inputs in it so we'll compile save close this hit play and this should now be working perfectly for us so what I'm going to do is if I were to hit tab we should see that I'm going to open up my inventory I've got my mouse cursor and I can't move in my game because obviously I'm in UI only and if I hit tab again we're going to close it Mouse class is gone I can move again this is working perfectly it's going to tab tab open and close perfectly like so again the input is not in the player blueprint to close it it's just in the widget so I think that'll be it for this video as we've done everything we want to do what we've done is again it's set up so we can use an input inside of the widget blueprint so thanks so much for watching this video I hope you enjoyed it and I hope found it helpful and if you did please make sure to like subscribe down below as it really does help me in the channel a lot once again thanks so much for watching and I'll see in the next one okay [Music]

Channel: Matt Aspland

Views: 21,164

Keywords: ue4, unreal engine 4, unreal engine, tutorial, ue4 tutorial, unreal engine 4 tutorial, how to make a game, how to, blender, unity, games design, ue5, unreal engine 5, unreal engine 5 tutorial, ue5 tutorial, widget, ui, input, ue5 input in widget, key, binding, override, function

Id: clKG7m5xawQ

Length: 6min 46sec (406 seconds)

Published: Thu Jan 19 2023