CROSSHAIR With HUD - Unreal Engine 5 Tutorial

by following this unreal engine 5 tutorial you will get this crosshair on your screen we will show you how to import this and add this to your viewport so you can have a better aiming in your shooter game first you will need a transparent png crosshair i found one here on google titan crosshair and this is a free icon you can create your own in photoshop or whatever you would like make sure you have this one selected then inside of unreal let's right click create a new folder let's name this ui user interface and let's direct my crosshair icon right here into unreal engine so it's right here and let's right click go here to user interface and create a widget blueprint user widgets and let's name this one hut okay open up the hut i like to dock my window right here then here we are going to look here for canvas panel let's drag in the canvas panel on the hut so we can see the screen we already had in unreal engine 4 then we are going to need the image so drag the image on top of the canvas panel right now this is the image here on the corner we need to anchor it to the middle of the screen now you can go different ways aim for the middle of the screen and then reset the positions or what you can also do and if the trick that i found out you click anchor and then ctrl ctrl update the puzzle image control click in the middle and there it will snap to the middle but it's in the corner and we will fix this one later on then under appearance you have brush open a brush and then you can see the image now find your crosshair in the ui and drag this one into brush or you can also click here none and then look for your crosshair and this will update your crosshair but right now you can see this is not really good so you can click size to content if you have the correct settings this will do if you don't you can type in your own values to scale it up for example i will need a crosshair 5050 for example for the size that i prefer then with the crosshair selected scroll to zoom in and make sure the middle here is really on top of this middle circle right here so for example let's say i misclicked for something i can also with position x and y with my mouse type in or just drag select to the middle of the screen right here and this is perfectly in the middle right now okay have my canvas panel select so this is the middle of our screen right now we have our crosshair hit compile right now this won't be available on our screen so what we will need to do we want to sit inside of our level go back to content first person blueprints and select the bp first person character then make sure you're inside the event graph on event beginplay we want to show this on our screen so right click event begin play we're going to create a widget when the game is created so create widgets and here underneath class select your widgets namely the hud that we created and also add to viewport make sure the return value is also the target writer and right now when i hit play this new level you can see this is on top of my screen and then i can shoot my balls like this with my new crosshair now you can also let's say you want your crosshair a bit smaller for example or you can type in the values right here also center it once more something like this hit compile and then we go back to your game you see the crosshair is a bit smaller than earlier and is automatically updated now this is one way to do it if you like to create a hud widget with a transparent image but you can also do this with your own creation so for example let's say you don't want to use this one let's drag in an image and let's also anchor this to the middle ctrl click to the middle and let's click here and ctrl d to duplicate it three more times so we have four in total then let's zoom in a bit and what we can do now is set it up just like this maybe i can delete this one but then i can put like this here okay and then duplicate the one that i have selected put this one here now this is not really super nice but this is a quick way to get another crosshair this is way too big but you get the point and you can create a crosshair just like this and you can also use the brush and the tint for example let's say you want something fancy yeah this looks very fancy you can see these are two ways to add crosshairs and you can really go creative with this one okay more helpful tips like this one subscribe to the youtube channel and you will see whenever new ones go live bye

Channel: Buvesa Game Development

Views: 34,669

Keywords:

Id: tFfrDJu77kE

Length: 5min 3sec (303 seconds)

Published: Wed Apr 27 2022