Unreal Engine 5 Tutorial - Inventory System Part 21: Hotbar

[@LemursCorner]

For those looking for how to make the Hotbar Visible, you need to make it visible from the start. Under My Player Controller: Event Begin Play>> Sequence ( You need this if you have any other HUD or anything showing) >>> Branch (Condition - Is Local Controller) >> True >>> Create Widget (Change Class to W_Hotbar) >> (Create new Variable I called mine HOTBAR - its pin option should be the Hotbar Widget) >> SET new Variable >> Add to viewport Hope it helps!

[@anarchywasp2984]

Legit, thx. Working.

[@thoryam2690]

Great Help ! Thanks Mate !

[@maaska.8432]

Thank you very much!

[@DigeL-el6uo]

thx :)

[@lord_tarek837]

Thank god you said that!

[@TheKaimukas]

Lately after every tutorial, I have to spend 2 hours fixing bugs. Really unfortunate, these series started off great

[@studiobaxter1242]

(EDIT) I think you forgot to add widget to viewport here? I had to do that anyway. I initially was unable to drag from player inventory to hotbar. I think a few of us have messed around with the non-hit testability of the canvas panel, because it was hard to close, as you needed to click right on the inventory to do it. But that made it so that dragging from inventory to hotbar didn't work. Changing to non hit testability in the canvas panel of the user inventory enables the drag to work, but the older problem of making the inventory hard to close, returns.

[@kevinbyer5449]

I too thought I missed a step somewhere, and went over the video multiple times. But I did the same as you, I added the hot bar to my Player Hud, but had the same issues with dragging would drop on the ground instead. I had to change the visibility on my canvas element on my inventory UI, back to default. I had changed it due to a post on an earlier video about fixing a quirk and that stopped this from working. Hopefully Ryan revisits this video and posts an update .

[@studiobaxter1242]

@@kevinbyer5449 Which 'inventory UI' do you mean? The Inventory grid? And what is the default? Non hit testable or visible? I think I have set every possible bit to visible and focusable, but still not working.

[@kevinbyer5449]

​@@studiobaxter1242 Yes, I mean the inventory grid. But I think Ryan called it W_PlayerMenu early on. I clicked the reset to default button on the far right side of the visibility behavior on the canvas. I think its Non-Hit testable (self only) I added the w_hotbar to the W_playerhud . So it's always visible. So when i click my inventory button, the W_Playermenu appears over the w_hud UI, and I can now interact with both. Whether its right or not, it worked for me lol . One thing I have learned through binging 21 tutorials and following along, its very very easy to miss something . I've had to go back to the beginning of videos many times. I'm getting better though at know what it should look like now , so it's getting easier to debug.

[@studiobaxter1242]

@@kevinbyer5449 Great, big thanks. I had added the hotbar UI from my level blueprint, but I put it back in the playerHUD, and yes changing the canvas panel to non hit testable did the trick. It works, but now I remember why we and others changed it in the first place. Now you need to click exactly on the player inventory in order to be able to close it, whereas making the canvas panel visible meant you didn't have to do that. (or at least that is my new problem) Of course there's a solution, but I don't know it yet. You're right about being easy to miss stuff, but added to that I'm adding all of these tutorials to an existing game, meaning even more possible issues.

[@TaysonBowles]

Where did you do the add to viewport, which BP? My Hotbar is not appearing...

[@mprotos9192]

Started so great and fallen so bad with amount of bugs without any fixes for so long...

[@oops2179]

If you forgot to set visibility of inventory slot back to visible, it's still work normally due to the UI recall every time, but not for hotbar slot (maybe since I ignored to add canvas). 3:55 show a part of function on the right side of video. Hoping no-one make the same dumb mistake like me..

[@madster3714]

any chance u can make character equipping armor inventory ?

[@motazturk]

Amazing Videos Man!! i really appreciate your continued Support for this Topic! best Patreon subscription ever! the knowledge we are getting is really priceless!! I dont know if it was already suggested or not, but an amazing addition would be like specialized Slots for specific item classes like, weapon slot, or armor slot!

[@WarpaintStudios]

great series so far, is there any chance you could do a companion to this video that shows the alternative method you mentioned where it doesn't keep the item in the inventory but places onto the hotbar or would that just be similar to the chest inventory but as permanent bar?

[@AlscarB]

This would be amazing! I've been trying to figure out that method for the past week with no success so, I'm definitely keen on that one!

[@oostenmusic]

For anyone wondering how to make the hotbar a separate inventory, you have to make a separate component for the hotbar itself. This means making a new array and having all of the same logic as a standard inventory within it, while also implementing separate checks & balances to make sure items are moved to the inventory/hotbar and removing them from the source inventory as needed. I was able to implement this system into not only a hotbar, but an equipment system as well. It takes a lot of checks/balances to make sure items aren't duplicated but it is relatively simple as long as you understand how to populate an array (set array element/set members in struct depending on the context). My hurdle was that I had no idea of how an array actually worked. I figured out that an array is exactly like it sounds (container of X items, each at an index starting from 0) and "set array elem" was basically the key to adding/removing items from an array. Hopefully this can help someone!

[@curator7]

Inherit from the current component, or create a new one?@@oostenmusic

[@mrh8984]

I agree. This would be an awesome tutorial. I'm trying (with no luck) having another inventory/chest type widget that has 4 specific items taken from the inventory, and then when the spefic four are added to these 4 slots, the quest is complete. Cmon Ryan, would make a bunch of peeps happy!

[@AliBounds]

My hot bar wasn't updating because I was having save issues with the save logic, so I disconnected them, and the hot bar works fine. I probably missed something in the last video but in my case, I don't want my game data such as that to safe so it's perfectly fine.

[@ogloctatoo95]

I have an issue with the hotbar, when I tried to drop an item to it, it's removing from the inventory and not drop it on the hotbar, I tried different method with visibility, adding my hotbar directly in my hud etc.. but nothing works. Someone can help me ?

[@statusfx1]

It sounds like (potentially) on the HotBarSLOT, when you grabbed the "Get" from the content you may have grabbed it as a "copy" instead of as a "ref"

[@pando5409]

Did u miss the last part where he edited the onDrop function? That was my problem.

[@ogloctatoo95]

@@statusfx1 No I get the ref 😢

[@ogloctatoo95]

@@pando5409 No I follow the same way he did

[@ogloctatoo95]

Six month later problem not solved, someone can help me ?

[@ty_teynium]

How can I do a hotbar without the drag and drop?

[@Sohneg]

If I move a Item to the slot bar and reopen the Inventory, the items are duplicated. One in the hotbar and the old one in the inventory. Somebody had the same problem?

[@ahmetozan4754]

Hi friends. i have a problem. i can pick apple but dont show my ınventory. Open the debug services (press 1) , i have a apples. Only dont show my inventory.

[@ahmetozan4754]

:)))) sorry meeennn :) i was dublicated. and not open hot bar slot :D change value in inventory slot :D

[@Tegurd]

Hmm... I'm running into a problem maybe someone can help me with. Basically I don't want my hotbar down there all the time, only when I have the inventory open. But every time I close the inventory the hotbar resets.

[@jakespencer917]

This is odd. If you simply add that HUD to the inventory panel it should work this way.

[@ashermills9527]

is it possible there is a way that the player during the game can edit variables of an item like size, color or name and then be able to add that item to their inventory with the modified variables stored? That way when the item is later dropped its modified variables will persist in the newly placed item. Basically I would like to have a custom cooking system in my game where players can make a customized dish with all sorts of variables. It may not be possible with this setup, but It would be highly inefficient to make a new item for every combination.

[@HashtagBassCovers]

I feel like modifying raw ingredients to become a completely new compounded item is way more inefficient than making a new item for every combination. This system already has the item class functionality built in which you could put all your cooking logic on. You could also do this on the use item functionality. Combine two items through whatever interface you have set up for cooking. If they are compatible for a recipe then a branch could be passed on to your item class component which then has the logic for cooking and making/baking the new item and then spawning it. You could then use the remove item inventory functions to remove the ingredients on completion.

[@ashermills9527]

Thank you so much for the help. The only potential issue is that I’m planning on having a large amount of ingredients that can be added to an item with differing intensities. That’s why I think it’s not as efficient to have a separate item for each combination. With 20 different ingredients and different amounts of each ingredient (like 1-10 carrots) the possibilities are very large. I’m toying with the idea of each slot having its ‘own inventory’ so to speak that contains each ingredient the food has? Idk, I’m not very skilled with this stuff yet.

[@HashtagBassCovers]

@@ashermills9527 Stack size can just be another bool or integer you can check on a branch but it sounds like you are trying to start to complex. I would suggest making it in the simplest way possible first even if it seems a little messy and then you can go from there. It's a lot easier to build something complex by developing it in stages. If you have something you can look at and see how it works in real time you can imagine how to make it more efficient much more easily. I did something similar recently when I adapted this system to work with my in game merchants. I just got it to work at all first even if it was simplistic and then over a day or two I updated and tweaked it until it worked how I wanted it to. If I tried to get it to work as intended from the get go without understanding how to manipulate what variables and when etc. it would have took me much longer.

[@ashermills9527]

@@HashtagBassCovers thanks man, I’ll try my best to digest everything you suggested. Thanks for the quick response!

[@tepechef1932]

where add to viewport Ryan?????

[@jakespencer917]

He did skip this part. I would do it on begin play on the player as this is likely going to be the HUD that you put health and stuff on as well.

[@Zorok123]

The hotbar is not showing

[@Sohneg]

Add to viewport

[@ricardoxu9352]

I followed the video step by step, but counldn't get the hot bar to show on the screen, any ideas why?

[@studiobaxter1242]

I believe that Ryan forgot to mention adding the hotbar widget to the viewport in this video. Open your player HUD and add it there with the others, using an Event construct.

[@thelostside1511]

Get all the way to the end (video 26) and you'll find my comment fixing the last bug. Make sure you follow this to the end so everything is the same. P.S. he fixes most of the bugs in a later video, so don't stress it here.

[@actuallygameon]

WE NEED PART 22 BRO PLZ 😂😂

[@studiobaxter1242]

It's out for patreon members, and 23 also.

[@actuallygameon]

@@studiobaxter1242 👍👍👍

[@sxk182]

yes let's goo

[@Lulugu]

Danke

[@BarışSezer-r1k]

You are not just bad. You are the worst.

[@chickenbroski99]

I have an issue where if an item is anywhere except the first slot of the inventory, when I use an item from the hotbar it only removes an item from the first slot. If the item is in the second slot it still gets the consume effect, but no item is removed. Using items from the inventory is fine, the issue is only when using from hotbar. Assistance appreciated.

[@chickenbroski99]

I managed to fix this myself, in WB_HotbarSlot inside the Mouse function, simply change 'Content Index' to 'Inventory Index' and its fixed.

[@chickenbroski99]

Remember to set the Player HUD and PlayerMenu Cavas Panels to "Not Hit Testable - Self Only" if you're having problems with the drag and drop

[@jakespencer917]

this is a solid tip

[@dawidpiejko9917]

Hi, I fixed displaying hotbar, but first, when I pick apple, I have all slots filled with 1 apple. Secon, if I drag apple from inventory to hotbar, it is removend from inventory and ends on ground....can somebody help me?

[@klawrz]

Same issue here, will post back if I find anything

[@klawrz]

So, for the drag/drop issue, I think it is due to the ZOrder of the hotbar widget. To display the widget, I used the Construct event in W_PlayerHUD to create the W_Hotbar widget > set the Menu variable > Add to Viewport. Adjusting the ZOrder to 1 on the add to viewport node allows me to drag and drop again. I think that in one of the upcoming videos, Ryan shows us a workaround for dealing with the inventory menu becoming "uncloseable" due to it losing mouse pointer focus, where we change the visibility behaviour of the W_PlayerMenu canvas and adjust the ZOrder of the HUD within the player controller. When I revert that fix, the hotbar drag/drop works as expected again. One issue is that after dropping on the hotbar, the focus is shifted to the hotbar. I am using TAB to toggle my inventory menu display, and tab seems to cycle through the hotbar slots (they get highlighted as you press TAB), so I wonder if there is a 'prevent default' in unreal (like in javascript). I wonder if preventing the default of TAB would let me close the menu with my current setup after ryans focus fix + my hotfix for the hotbar drag drop. I could try a different key than tab to test that quickly actually So I believe that Ryan's player menu focus fix is what caused the hotbar drag and drop bug, but it is fixable by adjusting the ZOrder of the hotbar. Still working on the 'item fills up all hotbar slots' bug. I notice that if you drag the hotbar item to another hotbar slot (from the inv or the hotbar), it prevents the issue. That said, I also notice that if you put the item in a different inventory slot, and change the hotbar slot it is in, only the hotbar slots past that inventory slot index get filled. Finally, if you drop the item, then exit the game, then come back in, the issue is prevented BUT (and this might be expected), if you have the item assigned to a hotbar slot, then change the inv slot, the hotbar is cleared. From this new inv slot, you can then assign the item to a different hotbar slot, and then dragging the item in the inventory back and forth between slots causes the hotbar slot to change with each drop okay back to working on this, hopefully that can help someone else get up to speed and we can knock our heads together on this^^

[@klawrz]

I have a hotfix for why all slots are filled with 1 apple. I am assuming you are not referring to the issue that Ryan covers at 9:30 in this video (all slots filled with apple, slot 2 onwards showing 0 quantity), and instead are having the issue I was having where upon picking up an item in a new game (i.e save data deleted), all hotbar slots suddenly get filled with apples (with the same quantity in every slot including slot 1) From my best judgement, this is due to how the current code handles the LoadHotbar function. In LoadHotbar, we create an array of hotbarslots, and we loop over them. On each iteration of the loop, we are taking the current index, and using that number to retrieve the information stored at the same index within the Hotbar Content array (created in SaveData_PlayerData). That's what the GET node is doing -- retrieving the data at each index of the HotbarContent array (an integer), then setting that number as the value for InventoryIndex for the hotbarslot in question. Now, the issue, the HotbarContent array is only populated with data during the SaveHotbar function. LoadHotbar function is called for the first time right when you click Play, and since SaveHotbar hasn't been called yet when it executes that first time, the HotbarContent array has nothing in it. I don't know why, but it is setting the InventoryIndex to 0 on each pass, even though there is no integer to retrieve in HotbarContent at that point (its just an empty array). Might be due to the falsiness of null? Since all hotbar slots are being initialized with InventoryIndex as 0, when you grab that first item i guess it thinks that all slots are index 0 and thus shows the same stuff. This means that in W_HotbarSlot, when we reach the 'Is Valid Index' branch, the check passes and we leave the branch via the True pin. So essentially, we need to make it so that Is Valid Index check fails. If the Inventory Index value was -1, this check would fail. Therefore my fix is to add another check to see if the HotbarContent array has anything in it, and if not, set the Inventory Index to -1. In summary, to fix, do the following: a) access W_Hotbar > LoadHotbar. b) From the ForEach loop, go into a Branch node. c) the condition for the branch node should be the "Length" node, which is checking the length of the Hotbar Content array. Use the one that is already there also connected to the GET (i.e drag off of it, search Length, and pop that into the condition of the branch. d) from that branch's True pin, set the Inventory Index as normal (taking the value from the GET node), then call OnUpdateHotbarSlot (this code should mostly be there already). e) from the False pin, set Inventory Index to -1, then call OnUpdateHotbarSlot Hope it helps and if anyone has a more elegant solution please share

[@jakespencer917]

The entire hotbar filling if an item is in inventory slot 1....set the default value in the hotbar to -1. This fixes it.

[@klawrz]

@@jakespencer917that’s way easier than whatever novel I wrote lol ❤