anyone? help pls 
Sure hope they update this to fit in with the new Roblox topbar UI
You can read the document on how to but the code would probably look like this:
Icon.new()
:setName("CashCounter") -- Set name for good practices
:setLabel("$1,000") -- Set the label to $ amount
:setRight() -- Align to the right
:lock() -- Lock to prevent being selected
And then from there you would use :setLabel() to update the cash amount.
i have no coding experience at all
Would recommend taking a look at this curriculum path if you’re having difficulties grasping scripting: Introduction to Scripting | Documentation - Roblox Creator Hub
Here’s a code snippet that should work if you have the Icon module in ReplicatedStorage, and if you paste it into a LocalScript under StarterPlayerScripts. To update the cash amount, change the value of the CashAmount object in ReplicatedStorage:
Example code
local ReplicatedStorage = game:GetService("ReplicatedStorage")
local Icon = require(ReplicatedStorage.Icon)
-- This keeps track of our cash amount
local cashAmountValue = Instance.new("NumberValue")
cashAmountValue.Name = "CashAmount"
cashAmountValue.Parent = ReplicatedStorage
-- This creates a counter in the topbar
local cashAmount = Icon.new()
:lock() -- Make it not clickable
:setName("CashAmount") -- The identfier of the counter
:setLabel("$0") -- The text on the counter
:setRight() -- Align it to the right
-- Detect when the cash amount changes
cashAmountValue.Changed:Connect(function(value)
cashAmount:setLabel("$" .. value)
end)
@ForeverHD @ValiantWind
Hey, i have made a PR that add Typing to TopbarPlus, it’s a fairly huge PR so please take your time reviewing it.
9 Likes
I thank you so much for this, genuinely. I always wondered why this didn’t have typecasting so thank you.
1 Like
All of my buttons are overlapping
It’s a large and complex code base so it take tons of time to work on the typing, i am pretty sure ForeverHD wanted to get the features done first before get the typing done
1 Like
Is it possible to add a label which uses the NumberSpinner module?
It is possible in v2.9.1, but I couldn’t find a solution for V3.
Thank you very much for this PR! Will review as soon as I get the chance.
v3 is done, including overflows (minus 1 console quirk I need to account for above), and I’m tapping away at the documentation… so very soon!
Fixed now at the v3 playground 
To be fixed soon, thanks for the report.
Thanks for your report, this is helpful, I’ll look into this on Monday.
What do you mean exactly by click menu debounce interval? Can you share a gif/video?
Yes, icon:modifyTheme(…) or Icon.modifyBaseTheme(…). I can’t retrieve the exact values right now but there are examples above (and you can find the precise values within the Default theme module).
v3 playground is best! will be releasing the package officially soon.
Fixed
Coming soon but I only have time to focus on the essential features right now I’m afraid.
Will be exploring a solution this Monday!
Can you update your module please (from the playground v3) and let me know if this still happens. It should be fixed now.
NumberSpinner support won’t be included in initial release but I’ll hopefully have time to support after. Other people are welcome to submit PRs for this feature and I’ll happily review.
8 Likes
there like a interval debounce between select and deselect, once i click a menu it fires select event then i click again that menu directly after selected it cant go deselect likely there a debounce.
Hey, so I have an issue using v3 that is causing these output errors to happen when two icons intersect, when the merging behaviour happens. Any ideas?
Also, when these errors happen, the icons lose where they’re anchored to (left/centre/right) so they now appear in the wrong positions.
Also, the progress bar is an icon, it just has its own controller, but disabling it doesn’t change any of the unintended behaviour unfortunately
This is a very basic example of how the error can occur:
local icon = require(game:GetService('ReplicatedStorage'):WaitForChild('TopbarPlus'):WaitForChild('Icon'))
icon.new()
:setWidth(100)
:setMid()
:setLabel('mid1')
icon.new()
:setWidth(100)
:setMid()
:setLabel('mid2')
icon.new()
:setWidth(100)
:setMid()
:setLabel('mid3')
icon.new()
:setLeft()
:setLabel('left1')
icon.new()
:setLeft()
:setLabel('left2')
icon.new()
:setRight()
:setLabel('right1')
icon.new()
:setRight()
:setLabel('right2')
2 Likes
does anyone know how to make a shop gui with a tween open animation
Hey, I wanted to ask if it was possible to make a dropdown tween animation just like the one in V2. I think it would make it look better with it instead of it popping in and out. Otherwise, if it won’t be added, I want to ask if there is any way I could tween it myself in the code of the dropdown. The dropdown code is from the V3 playground.
1 Like
Is there a way to toggle an icon’s visibility? (preventing the player from seeing or using it)
Edit: NVM! found out how
1 Like
icon:debounce(x) helps here, e.g:
:bindEvent("toggled", function(icon)
icon:debounce(3)
end)
This is because HD Admin hasn’t been updated with v3 yet, I’m hoping to have all that complete this week 
1 Like
I’ve forked HD Admin to use V3 and changed the methods to the applicable V3 methods and such. This also happens with the code snippet on the V3 test place
1 Like