InventoryMaker (PC and Mobile)
InventoryMaker is an open-source, framework I created to help (initially, myself) Roblox devs create their inventory system. The design of this framework is based around the idea of containers, which structures your inventory slots with UIGridLayout and allows you to separate your inventory into different spaces with its own UI and functionality, while still being connected as “one” inventory.
Get the rbxm file here (latest version):
InventoryMaker_v1.2.1.rbxm (88.6 KB)
Or get it from Wally
IMC | IMS
Try the uncopylocked demo place:
InventoryMaker Demo - Roblox
The demo place is where I do all my developing for the module, so it’s guaranteed to have the latest version.
Some of items in the demo place do not have their own tools, so you won’t see any tool welded to your character when it is equipped. UI should work fine, though.
GitHub Repo:
GitHub - InventoryMaker
Thank you to all who voted on the poll.
Documentation:
InventoryMaker Docs ← it’s basically done, except for some tutorials
Features
- Dragging
- Swapping
- Stacking and Splitting
- Hotbar and Keybinds
- Context Menus
- Hover prompts
- Custom filters
- Search bar filtering
- Containers
InventoryMaker, to my knowledge, does not support any complex, custom UI animations, like a hotbar that shrinks to hide all of its slots and expands to show all of it, like a deck of cards or something. If it does, please let me know because that is awesome.
How It Works
InventoryMaker has two components, one for the client and server. The client component (InventoryMaker/InventoryMakerClient/IMC) works on the client to handle all your UI interactions. But it won’t work out the box right away. You as the developer must design and create your UI templates, which can then be plugged into IMC to be used. You decide how you want your inventory to look like.
The server component, InventoryMakerServer (IMS) allows the server to be aware of the client’s inventory and its shape. This is especially important when it comes to adding a new item because without the server knowing how the inventory is structured, exploiters can add in fake data they haven’t earned and gain an advantage. No no no, exploits bad.
Basic Example
Code Sample
local InventoryMaker = require(path_to_module)
--[[
first, you wanna initalize the module with a ScreenGui, which will contain ALL
of your UI for the inventory
]]
InventoryMaker.Initalize(someScreenGui)
--[[ Then you populate the inventory with data ]]
InventoryMaker.Populate(function()
-- this is where you can fetch the player's inventory data from the server
-- the data HAS to be an array though, since order matters
return {}, 25 -- I used an empty table bc no data; 25 is the total inventory capacity
end)
-- Now, we'll create a container with a capacity of 25 to hold all the items
local container = InventoryMaker.Container("c1", 25)
--[[
we'll just use the default UIGridLayout provided, but we still need to set the
ParentContainer, which is the gui object that will contain all the slots for
this container
]]
container:DefineLayout({ ParentContainer = someScrollingFrame })
-- then we define how we want to render our empty and filled slots for the container
container:DefineEmptySlot({
GuiTemplate = someGuiTemplateForEmptySlot,
RenderFunc = function(slotIndex, emptyGui: GuiObject, containerIndex)
-- assume there is a TextLabel named "Label" in this gui template
emptyGui.Label.Text = slotIndex
end
})
container:DefineFilledSlot({
GuiTemplate = someGuiTemplateForFilledSlot,
RenderFunc = function(slotIndex, item: InventoryMaker.ITEM_TYPE, filledGui: GuiObject, containerIndex)
-- filled slots are created using the GuiTemplate and are parented under our empty slot
--[[
setting the size and position, assuming our template did not have these
properties set beforehand when designing them
]]
filledGui.Size = UDim2.new(1, 0, 1, 0)
filledGui.Position = UDim2.new(0, 0, 0, 0)
-- assume there is a TextLabel named "Label" in this gui template
filledGui.Label.Text = item.ItemName -- assuming each item has a value called ItemName
end,
})
-- Finally, we can build our inventory with this container
InventoryMaker.Build({ container })
If you wish, feel free to share any photos of your inventory using InventoryMaker so I can showcase them, :]
I’ll definitely be forking it myself because it’s nice to use, very nice job 
anyway, awesome post doesn’t really teach anyone much. Maybe make a module breakdown for people who genuinely want to learn or something. Really cool overall