How would i make a inventory drag and drop system with premade slots?

Hello DevForum,

I’m trying to make an inventory with a drag and drop system. I ran into some problems, because i use pre-made slots, and it would be handy to parent the imagelabel that i’m dragging and dropping to that slot, since they’re in a ScrollingFrame:

image

But, i’m running into a small issue here. If i would try to do this, the size of the ImageLabel would change, because it’s relative to it’s parent, and if i change the parent to for example the background frame, it’s size would change. Are there any other options or solutions?

Thanks in advance!

You mean the ImageLabel would change size when dragging it? If that’s what you’re talking about then you could set the ImageLabel Offset instead of the Scale.

An apparent way to “snap in place” is to find the event whenever the mouse is released. During that event, check for the nearest tile based on the mouse position. It is possible that your mouse is already hovering on the icon, but this is sometimes bad UX if you try to always base it on the mouse’s position unless the item you are dragging is right on the mouse.

You could use GuiButton(s) that have a visual for selection and when the mouse is released on top of it. It will fill the item you triggered MouseButton1Down.
https://developer.roblox.com/en-us/api-reference/event/GuiButton/MouseButton1Up

Also if you want an image on button, refer to:
https://developer.roblox.com/en-us/api-reference/class/ImageButton

Or you can build the UI in various creative ways with different layers.

1 Like