Trying to optimise creation of buttons

What I currently have in my system is whenever a players inventory updates, I delete all the previous buttons in their backpack, and remake all of them. This seems really innefficient

function GetInventory.OnClientInvoke(inventory)
	PlayersInventory = inventory

	for _, button in pairs(Page:GetChildren()) do
		if button:IsA('ImageButton') then
			button:Destroy()
		end
	end

	createItems()
end

So I tried doing something like this

function GetInventory.OnClientInvoke(inventory)
	PlayersInventory = inventory

	for _, button in pairs(Page:GetChildren()) do
		if button:IsA('ImageButton') then
			for i, v in pairs(inventory) do
				if button.Name == i then
					button.Quantity.Text = v
					break
				end
			end
		end
	end
end

With the premise being if their is a button already of an item, it would just edit the quantity of the button, but I don’t know how to:

  1. Check if button exists, but the player no longer has that item in their inventory (thus need to delete that set button)
  2. Detect if there’s a new item in their inventory and no button for it, to create a button.

How I create the buttons too


local function createItems()
	if PlayersInventory then
		for i, v in pairs(PlayersInventory) do						
			local Button = CreateButton(i, 'Furniture', Page, v)
			
			local FurnitureItem = Furniture:FindFirstChild(i)
			
			Button.Activated:Connect(function()
				furnishButton(Button, FurnitureItem)
				Button:Destroy()
			end)
		end
	end
end

The players inventory looks like this too

Inventory = {
    ['Table'] = 4,
    ['Chair'] = 3,
    -- etc
}

To check if the button exists, you can check if Page:FindFirstChild(name) is non-nil. To detect if a new item was added in their inventory, the easiest way would likely be to only allow mutation of the inventory through the use of setters (i.e. an AddItem method).

A general method if you don’t want to use setters would be to use metatables, the __newindex metamethod fires when a new key-value pair is added to a table. You can use that to create the button.

1 Like

https://github.com/Roblox/react

For your table items, i’d do this instead

[‘Table’] = {‘Table’, 4} --TableItem
[‘Chair’] ={‘Chair’, 3) --TableItem

Then, for the update function it would loop through the Inventory table, and for each item in the table, if it didn’t find TableItem[1] but it was in their inventory table, then it would give them a new button.

As for updating the buttons when something is removed from the table, i’d just find a way to make the buttons slide down in position (or over?). Or, you can just keep updating and deleting and adding all of the buttons again, which isn’t the greatest, but hey, it works.