GridPack - Create Grid/Tetris Style Inventories

[iFrexsim]

GridPack

An easy way to create grid/tetris style inventories.

📚 GitHub Repository | 📜 Documentation | 🐶 Wally | 📦 Roblox Releases

---

Why?

About 2.5 years ago I posted a showcase of a tetris-style inventory that I had made. Ever since I’ve gotten countless requests to give out the source code to it. So I figured it would be best to create an open source library for everyone to edit and use for free!

Pre-release statement

This library is in it’s alpha stage and should not yet be used for production! Updates could introduce breaking changes and there may be missing features.

---

Features (as of v0.2.0-alpha)

Item Dragging in Grids

Example

Transfering Items Between Inventories (TransferLinks)

Example

If you want an inventory to have multiple grids or simply just want to connect two inventories together. Then TransferLinks will be your friend!

Item Rotation

Example

Single Item Slots (SingleSlots)

Example

These slots only allow one item at a time, regardless of size. They can be used for equipment slots like for example; your primary weapon.

---

Client-side Only

GridPack by itself doesn’t handle the Server-side, which means that your items won’t be accessable on the server and will not automatically save. Although this may change in the future, but it’s not set in stone yet! It is still possible to communicate the items to the server, see the documentation for more info.

Contribution

You are free to use the source in any way you want. And please if you find any bugs then feel free to open an issue or create a pull request if you’ve fixed the issue yourself.

[tibiscus]

Seems pretty cool, looking forward to the updates.

[baseparts]

This looks really helpful! I was just in need of such a system for my game and this literally has every feature I was looking for. Thanks

[NathanDingy]

Very awesome ive been using a heavily modified version of your older inventory in my dungeon dwellers game cant wait to update to this one.

[StarVSK (Star)]

This is really neat, thanks for this, I noticed an issue with the documentation missing the potentialRotation arg in the Server Communication portion of adding the middleware:

MoveMiddleware = function(movedItem, newGridPosition, lastItemManager, newItemManager)

should be

MoveMiddleware = function(movedItem, newGridPosition, newRotation, lastItemManager, newItemManager)

[iFrexsim]

Thanks for reporting! Gonna fix this when I get home!

[Calymth]

Hey,
looks awesome. I’ve been looking though the Code, but couldn’t find, where the drag-function is defined.
I am working on a similar inventory-system, but not in your Tetris-style and I am struggling with enabling a Drag-Functionality from the Players Inventory to the Players hotbar.

How exactly did you manage to solve it?

[iFrexsim]

The dragging code is somewhat split among all of the classes but the “core” controller of it all is in the Item class. The code shares some similarities with tycoon sandbox placement modules, so you could also check those out.

[iFrexsim]

I’ve now fixed some problems with the documentation, and also added a new customizing guide for customizing ItemManagers and Items.

[TheSwipedSwiper]

Thank you, this will be really helpful for my game! One question however, how do I change the item’s image?

[iFrexsim]

All items have a read-only property called .ItemElement which is set to the item’s GuiObject, so if you are using the default item asset you would do <YOUR_ITEM>.ItemElement.Image.Image = "rbxassetid://<YOUR_ID>" to change the image.

[TheSwipedSwiper]

Thank you! I’ve been testing it out and I’ve nearly got everything I need working for my inventory system, apart from one thing, is there any sort of function or way I can automatically give the item a position that isn’t colliding with anything else? Whenever my item is picked up and it’s added to the inventory, if there’s a collision with where it’s meant to be put, it gives out the error for that reason and doesn’t spawn and I’m not really sure on how to find a way around this. Any help would be appreciated, thanks!

[iFrexsim]

Yes! There is actually a function for just this in grids: Grid | GridPack

[TheSwipedSwiper]

I’m not sure if I’m using the function correctly or if there may be a bug:
This is my code:

events.InventorySlot.OnClientEvent:Connect(function(infoTable)
	local item = GridPack.createItem({
		Position = Vector2.new(0, 0),
		Size = infoTable.SlotSize,
		Assets = {
			Item = nil,
		},

		Metadata = {
		},
	})
	item.Position = grid:GetNextFreePositionForItem(item)
	grid:AddItem(item)
end)

In the output it gives the error:

ReplicatedStorage.Packages.GridPack.ItemManager.Grid:244: attempt to perform arithmetic (mod) on table and number

Any help would be appreciated again, thanks!

[iFrexsim]

Yes, sorry! This was a bug on my part, get the new fixed release here: Release Release v0.2.1-alpha · Frexsim/grid-pack · GitHub

[TheSwipedSwiper]

Sorry if I keep bringing up issues, but I believe I found another issue. Even when there’s enough space but at a different angle, the item doesn’t rotate and an error is given in the output.

ReplicatedStorage.Packages.GridPack.ItemManager.Grid:243: invalid argument #1 (Vector2 expected, got nil)

[iFrexsim]

I don’t have time to look into this issue much right now, so please move your issue to the github: Issues · Frexsim/grid-pack · GitHub so that I and others can track it easily.

From what I’ve seen so far it seems that you have an invalid position somewhere. But I would need to see your code first.

[sssssdddddd_1212]

it could be really cool if you made this tool-based with equipping too, so it would basically replace he default backpack.

[7yooso (Adres_IQ)]

There is a mistake in explaining

GitHub - Frexsim/grid-pack: An easy way to create grid-style inventories on...

Forgot (,)
in

Visible = true -- If the grid is visible, changes the containers visible property. Also disables item interaction on all items inside.

	Assets = {
		Slot = nil -- Add your own GuiObject here to customize the slots in the grid.
	}

[Orbular3]

Do you have a rough release date for the full version yet? Also is there a list of what you plan to add for v1, such as mobile support?