[Guide] How to make an easy blueprint XP/ Inventory System + Question

Dear Epic community,

I Am Emptyless :slight_smile:

I want to write out my guide on how to create an easy inventory system but i got a question though on how to small it down. So lets get started.

I will first explain the event that causes your inventory to rise. If you already have an event or something that would cause it to rise than that is fine. Skip bits or continue at step #x
The system that is going to make your inventory full is in my example a tree falling. I have tried to simplify it as much as possible but if you do not understand something just ask :slight_smile:

To achieve this follow this:

  1. go to http://tf3dm.com/3d-model/a-tree-88011.html and download the fbx file of the tree. Import it into the game.
  • A: Open blender or any 3D program to cut off a part of the tree (to get the trunk)
  • B: Import the FBX file i uploaded. (Dropbox - Error) MODS PLEASE TELL ME IF I HAVE TO REMOVE THIS LINK. I DO NOT KNOW IF IT IS ALLOWED TO LINK FILES ON THIS FORUM (sorry for caps do not want problems O:) )
    • create materials from the textures and open the leaves one. Set the blend mode to masked and drag the bottom dot from the texture sample to the opacity mask.
    • now open your alan tree and set the element 1 and 2 to broadleaf bark and element 3 to the leaves.

3: create a blueprint -> actor
4: add static mesh, static mesh & a box shape
5: arrange them to something like this:

(the trunk inside of the tree and the triggerbox surrounding it)
6: go to the graph
7: create this:

  • add event for the tree: on clicked
  • add event for triggerbox: on begin overlap, on end overlap
    • add a gate and make it open when begin overlap, close it when end overlap and enter when clicked on tree
    • create a variable for the tree to be rotated (boolean) and create a branch
    • when the variable is false (tree isnt rotated) move component to: rotation y axes 90. ease in ease out and over 1 second
      • create a sequence and set the variable of the tree being rotated to true
      • trigger a delay and set it to 5 seconds
      • create an event dispatcher and call it.
        - once delay is finished move component back to y = 0 over 0 seconds (instantly)
        - set the variable tree rotated to false

soo now we got our blueprint of a tree. you can just drag and drop trees on your landscape to your liking.

8: select all the trees you have placed
9: open the level blueprint editor
10: right click and add event for actor -> default -> your dispatcher
11: create an integer and call it woodcutting xp
12: close the level blueprint editor
13: create a new blueprint interface and call it woodcutting_xp

  • add function -> integer as input and call it woodcutting_xp
    14: create a new blueprint interface and call it woodcutting_lvl
  • add function -> integer as input and call it woodcutting_lvl
    15: go back to your level editor and create this: (i have made 2 trees so hence the 2 events etc etc. To create the second tree. Duplicate the static mesh. Open the leaves material from the FBX file of the Alan tree and increase its saturation in photoshop. Now you have 2 leave materials and you can just create the second tree like you did the first tree except with different coloured leaves.)
  • create a set woodcutting_xp and link all the events you created in step 10.
  • create a get woodcutting_xp and link it to integer+integer and link that to the set woodcutting_xp
  • right click with the mouse and type in the woodcutting_xp and choose the interface.
    • now link the execute from set to the interface.
    • link the integer+integer to the integer in the interface
    • and create a player controller linked to gethud linked to target of the interface

now we have communicated with the hud.

the next step is to create a nice hud we can interact with.

16: open the hud and create a new function:
17: create the following:

  • create input vector2D
  • create input string
  • create input name
  • create input texture2D
    just draw all the lines the same way.

18: now we have created a button:
– you will need square textures (39x39) or higher and scale em down
– for nostalgic feels i will place the skills and inventory and equipment icons from runescape. As long as you use it for personal testing i think they’ll be fine with it. you can do a google search for these icons or use these which are already sized to fit:

19: create and place the buttons like this: inventory_control1.png (1920x1080) havent made scaling mechanism yet as it wasnt needed for me

  • create and event receive draw hud
  • drag in your function button 3x, and create a draw texture and select a random texture and set it to modulate (so it will be opacive which looks cool <3 )

20: create the click events like this: XP_Counter_total_level.png

  • add an event receive hit box click.
  • create 2 or 3 (depending on the amount of tabs) booleans with corresponding names to your tabs
  • create an switch on name
    – !! important to add the EXACT name of the hitbox in the switch on name. !!
    – just create the rest like i did.

21: now we are getting somewhere :smiley: create this after your sequence created in step 19. Equip_stats_icon.png

  • used the booleans created and set in step 20.

22: use the true value and drag it out to a sequence and create this:

(note you have not yet created the function draw skills nor draw mouse over skill, read below)
– to create the Draw Skills create a new function and copy this: this one is almost identical to the draw tabs but has other values
– to create the mouse over function copy this: which has some differences

23: Now go on compile and notice the difference when clicking on tabs (you might need to f11 to see your tabs on 1920 x 1080 monitor).

THE INVENTORY PART

24: now come the horrible part of creating an inventory. I have managed to create an easy 1 - 2 - 3 etc item system but when you get to something like 5 / 6 different items the amount of variables becomes HUUUUGE so if someone is reading this who actually has some experience with how this engine works :slight_smile: please enlighten me how to create a blueprint of this. <3

25: adding items:

26: now go to the HUD and drag out the inventory boolean created in step 20 and create a sequence.
– and in the level HUD on the left in the my blueprint section open the texture 1 and texture 2 interace and use these textures for them: b41ac5146437b8fa5bef4c616ca3d1857362f1a0.jpeg


27: create a new function in the hud called Inventory Spaces and create it like this:

*outdated. Hakabane pointed out better way <3

28: draw a sequence from the sequence in step 26 (you will need the space trust me :wink: ) and create this:

  • use blueprint props to add interface and add the inventory interface created in step 25
  • i trust you know what booleans are by now <3
  • use the equal integer to set the booleans to true

29: now create this from your first sequence made in step 26

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*

28: create this with what you have created in all the previous steps in the hud XP Background.png

30: PROFIT
31: result:

i get error when uploading new pictures :frowning: here is the dropbox link: Dropbox - Error Dropbox - Error

I hope i got it all covered. If you got questions or tips please post them in the comments.
Still hoping for someone to improve this system <3

Emptyless

Reserved for further posting

Maybe move this to the wiki. There you will have proper formatting and no restrictions on the number of images.

Sedonded. This would be a perfect wiki entry. Thanks for the effort of putting it together by the way!

Thanks for this post emptyless, you were able to provide me with some information I have been looking for lately. I believe I may be able to help improve these blueprints, in that you wont need so many connections, but I’m not sure. I’ve bookmarked this thread to keep watching the progress

Thanks! The problem with the inventory system as it is now is exactly that. It is simple to make but requires lots of work.
Though once setup i was able to create events like dropping my wood and creating fire in under 5 minutes. So i believe the power of this style of inventory is there :slight_smile:

Still thinking the same style as my TI-84+ O:)

Man i wish there was a IF - THEN to just set the texture. It would be like defining in one blueprint:

If int is 1 disp texture 1
if Int is 2 disp texture 2
if int is 3 disp texture 3

etc etc etc but unfortunately i coudnt find a function to draw a texture :frowning:

Honestly your approach is the one I took at first but I couldn’t stand making so many links everywhere and due to what I want, I didn’t want to spend weeks copy/pasting everywhere.

I did take a look at your Inventory system and so far it is superior in every other way :stuck_out_tongue: but i coudnt figure out how to get my inventory from a tree other than spawning an actor after the tree was “chopped down” and how to actually display my inventory the way im doing now.

If it wasnt obvious already i am trying to make a runescape like inventory system. After i got the hang of that i think i can bend it to any way i like :slight_smile:

To Do:

  • Dumb down new items and inventory slots
  • stackable (though i think this can be easily achieved by adding a text button to the inventoryspaces function and creating a branch to check if there is another texture/item with the same name already in the inventory)
    • problem being the over 9000 nodes

Btw as an after thought, if you want to switch textures based on an int, look at the “Switch on int” function, you may like it.

I have found a way using my inventory to reference my array finally so I’m now drawing textures from a value stored in the array. Once I have the entire inventory working together I will post how to do it. right now its very ugly.

I loved how you used Runescape sprites :stuck_out_tongue: Love the tutorial/guide/wiki, Ill probably try it out sooner or later. Makes sense though!

You are a genius!!! i love you so much.

I am no able to smallen the code in the hud to this:

instead of the 6 pictures i needed in the tutorial. I love you man!

Edit: even that can be shortened down to the function so no need to write millions blueprints:

Function InventorySpaces:

looks a bit messy but if you look at the previous picture in my post you know how it works

Hud :

^ this is all what is left from the 6 pictures now

To draw the variable i now have created a function in the level blueprint:

and after i for example chop down a tree i create a variable called Item 1. set it to 1 and execute the function with variable you just created.

Bonus:

this is how clean my hud and level blueprint have become:

You can, use a bool. get your int reference plug it into a == set it to whatever one you want. plug it into the bool. done.

does anyone have an image of the result?