Hello there, I currently have Topbar in my game, and wanted to change the icon. I uploaded an image to ROBLOX, and changed the image ID but unfortunately all I received was this in-game?
This happened to me when my image was moderated, try using another image.
1 Like
I’m still a little confused on how to use this. Do we have to use a module script/scripts to be able to use the functions of the ui or is there a different way to actually make the ui that can perform the exact same functions the model provids.
Sorry if this question is unclear
Sorry, another question, so I created a money top bar label and it works fine, it shows the amount of money a player has. I then created a dropdown menu that has other multiple stats in it, for example, fish. I cant seem to find a way to loop the :SetLabel in a dropdown to keep updating the amount of fish a player has, any help?
It’s important you use the AssetId instead of the WebsiteId:
An easy way to retrieve an image’s AssetId is by right-clicking the item within the Toolbox or Asset Manager:
2 Likes
Roblox don’t provide support for anything icon-related on the topbar which is why I created this.
To use TopbarPlus you need to place the Icon module within ReplicatedStorage and then to construct your icons within a LocalScript under StarterPlayerScripts.
We’re aiming to release some tutorials soon to help.
4 Likes
You can use the :give method to achieve this (which I’ll likely later rename to :call in the next version which more accurately reflects what it does).
e.g:
Icon.new()
:setDropdown({
Icon.new()
:setLabel("Category 1")
:give(function(icon)
task.spawn(function()
for i = 1, 10 do
icon:setLabel("Test label "..i)
task.wait(1)
end
end)
end)
,
Icon.new()
:setLabel("Category 2")
,
Icon.new()
:setLabel("Category 3")
,
})
2 Likes
@ForeverHD Hey there! I noticed a weird issue and I wasn’t sure where to do a bug report so I’m just putting it here. If an icon is “selected” and you have a tooltip set for it, it won’t show if in the “selected” state, unless you were already hovering over it when u selected it. My code:
icon.selected:Connect(function()
icon:setTip("Click to Close Spawner")
end)
icon.deselected:Connect(function()
icon:setTip("Click to Open Spawner")
end)
Note: the code provided had more functionality but to make things simpler that is my code. icon is not defined here but it is in my script.
Videos below:
1 Like
I’m pretty sure this is meant to happen since if you were to have a button that opens a list of sorts, you wouldn’t want that going over the list. I don’t know for certain if this is the reason why it does this though. If this is meant to happen, there might be a way for you to modify it to remove this.
Thats the point of “setTip”
It will only appear when the cursor is hovering over the icon.
Wait can someone explain how the currency UI in the demo video works? I don’t understand how the numbers move up and down unless each number shown is its own TextLabel.
For example:
12,345 is made up of 5 textlabels, one for each number shown.
It doesn’t display the tip though in this part, https://shrek-is.life/f/VkRNZf.png - even though I am hovering over it
Hi, this is the current intended behaviour (i.e. when you select an icon its items like tips and captions are hidden). Seeing your example use-case I can potentially explore changing this behaviour. For the time being I recommend writing your tips based solely on the opening/selecting action.
2 Likes
This is a separate NumberSpinner module by boatbomber. More details here:
2 Likes
Alright, for my use cause I could look into modifying my file myself and see if I can change it for my use-case. Thank you!
@ForeverHD when i select and unselect and item then my leaderboard randomly comes back even tho i disabled it using game.StarterGui:SetCoreGuiEnabled(Enum.CoreGuiType.All, false)
my code:
local SettingsIcon = Icon.new()
SettingsIcon:setEnabled(false)
SettingsIcon:setName("Settings")
SettingsIcon:setImage(9817216056)
SettingsIcon:setImageYScale(0.5)
SettingsIcon:setProperty("deselectWhenOtherIconSelected", false)
SettingsIcon:setRight()
SettingsIcon:setTheme(Themes.BlueGradient)
SettingsIcon:setOrder(2)
:bindEvent("selected", function()
game.StarterGui:SetCoreGuiEnabled(Enum.CoreGuiType.All, false)
end)
SettingsIcon:setDropdown({
Icon.new()
:setLabel("FreeCam")
:setProperty("deselectWhenOtherIconSelected", false)
:bindEvent("selected", function()
game.StarterGui:SetCoreGuiEnabled(Enum.CoreGuiType.All, false)
end)
,
Icon.new()
:setLabel("Item Test")
:setImage(9817216056)
:setRight()
:setProperty("deselectWhenOtherIconSelected", false)
:bindEvent("selected", function()
game.StarterGui:SetCoreGuiEnabled(Enum.CoreGuiType.All, false)
end)
})
local GuiIcon = Icon.new()
GuiIcon:setName("Gui Off")
GuiIcon:setImage(9817219215, "selected")
GuiIcon:setImage(9817217979, "deselected")
GuiIcon:setImageYScale(0.5)
GuiIcon:setOrder(1)
GuiIcon:setProperty("deselectWhenOtherIconSelected", false)
GuiIcon:setRight()
GuiIcon:setTheme(Themes.GreenGradient)
GuiIcon:setTip("Hide Gui")
GuiIcon:bindToggleKey(Enum.KeyCode.V)
GuiIcon:bindEvent("selected", function()
game.StarterGui:SetCoreGuiEnabled(Enum.CoreGuiType.All, false)
for a,b in pairs(game.Players.LocalPlayer.PlayerGui:GetChildren()) do
if b:IsA("ScreenGui") and b.Name ~= "Chat" and b.Name ~= "HDAdminGUIs" and b.Name ~= "TopbarPlus" then
b.Enabled = false
end
end
SettingsIcon:setEnabled(true)
end)
GuiIcon:bindEvent("deselected", function()
game.StarterGui:SetCoreGuiEnabled(Enum.CoreGuiType.All, true)
for a,b in pairs(game.Players.LocalPlayer.PlayerGui:GetChildren()) do
if b:IsA("ScreenGui") and b.Name ~= "Chat" and b.Name ~= "HDAdminGUIs" then
b.Enabled = true
end
end
SettingsIcon:setEnabled(false)
end)
3 Likes
Not sure why this doesn’t work it works perfectly when I don’t use setimage.
--// < Cash >
Icon.new()
:setName("CashSpinnerIcon")
:setImage(7334848641)
:setMid()
:lock()
:setSize(100, 32)
:give(function(icon)
local NumberSpinner = require(replicatedStorage.NumberSpinner)
local labelSpinner = NumberSpinner.new()
icon:convertLabelToNumberSpinner(labelSpinner)
labelSpinner.Name = "LabelSpinner"
labelSpinner.Decimals = 0
labelSpinner.Duration = 0.25
coroutine.wrap(function()
while wait(0.5) do
labelSpinner.Value = player.leaderstats.coin.Value
end
end)()
end)
might because you also use the spinner. idk if you can use the spinner and setimage at the same time
Is it possible to disable controller mode? When adding TopbarPlus, controller mode can be really annoying to players.
1 Like