Hold Button - Unreal Engine 5.2 Tutorial

hey there I'm your host lesoi and in today's video I'll show you how to create a hold button so if you're holding the button and you drop it it's going to reset and if you press it again and complete it it's going to give you a message in the top left corner so let's begin first let's create an input action for our button so if I go to my content drawer and navigate to where my input folder is let's go to actions input input action I'm going to call this IA underscore hold interact then go inside of your newly created input action and we want to add a trigger and this trigger is going to be a hold then for the index of that trigger we want to set the time so for me I'd be happy with two seconds and remember to take is one shot that means it's going to fire once and then for the actuation threshold we're going to change this to 0.001 and hit save then in our IMC we are going to create a mapping so find your introduction and I want this to be on the E key so save and we can exit then go into your third person character or wherever you will have the code I'm simply going to have it in my third person character and inside of here I want to create a variable this variable is going to be called alt number and a type of load so compile and Save then let's go and create our widget so I'm going to create a new folder UI and inside of this folder I'm just going to create my widget so user interface which blueprint user widget WB underscore hold button inside my widget I want to add a canvas panel then on top of the canvas panel I want to add a progress bar so this progress bar I want to be Center aligned with a width x of 300 and about there is good for me then for the color I want this to be a yellow color like so and if I go to my style background image we can change the tent to be something like orange and to see the yellow line let's just simply increase the percentage and now we can round out the box so instead of box we can have a rounded box and for the fill image we can do the same instead of a box we can have run the box and we can add a width of four then let's add a text and text is going to be size to content also Center aligned and it's going to say a hundred percent or let's say 66 percent and we are going to have a font of 20. if I drag this here everything fits good so we can compile and save then if I select my button my progress bar I can add a binding to the percentage so weight binding and from here I'm going to cast to my character so for me it's going to be the third person character for you might be Steve or Bob get player character and I'm going to then get my old number and I'm going to divide it by a value that is relevant to me so for me 100 is fine for you could be 200 you decide then we can compile this and let's get our number or our text and let's do the same thing so for our bind we can create a binding this one's very similar a little bit different same thing we're casting to our third person character the object is get player character then for the assert person character we're going to get hold number we're going to text to float or to text float then let's get a format text break the node and inside of the box to a curly black bracket X curly bracket again and if you want the percentage sign just add it at the very end and then connect the outcome to the x I connect all of it like that and we are pretty much done we can compile it save and exit the widget then inside of our third person character let's add the functionality so first let's go and create a custom event this is uh going to be for our hold button and capital the U is capital I don't want that then let's do hold number get it we're going to add and for example I want this value to be increased 10 points every 0.2 seconds so for me I'm going to do 10 then I'm going to set this value connected here and then let's get the delay so hold down D and press left Mouse button and it's 0.2 that's fine for me because that's what I want and we can comment this actually one more thing before we do let's uh at the very end get all button again so it is a constant Loop then for our in production we can do hold interact on triggered we want a print string so this is uh just to tell us that it succeeded so I'm going to say success with an exclamation mark and for my started we are going to create a widget so this widget is going to be what we made so our hold button widget and then for the return value let's promote this to a variable and this is going to be called our hold button reference and then we want to add it to viewport and after the viewport we want to use the custom event we created so hold button and after that we want to set this value back to zero so get the whole number set and it's going to be set to zero and if we cancel or complete this action we want it to disappear we don't want the widget to be on the screen so in order to do that let's get our old butter ref and we can convert it to a validate validated git so uncompleted and on canceled we're going to go inside and if it's valid we simply will remove from parent like so and if I compile and Save my whole button now should work perfectly if I let go it's not going to do anything but if I finish it it's going to give me a success sign on the top left so that's all guys I hope you enjoyed the video If You did leave a like if you didn't leave a dislike and as always happy developing

Channel: Lisowi

Views: 2,462

Keywords: Unreal Engine, Unreal Engine 5.2, UE5, Unreal Engine Hold Button, Hold Button, Unreal Engine Press Button, Hold to interact

Id: rLB1INqs2ro

Length: 7min 31sec (451 seconds)

Published: Tue May 30 2023