[v3!] TopbarPlus v3.0.0 | Construct intuitive topbar icons; customise them with themes, dropdowns, captions, labels and much more

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

Hey! I was just wondering how could I make it so when a dropdown is selected all of its or one of its option gets deselected?

try using this

icon:setProperty("deselectWhenOtherIconSelected", false)
1 Like

sup, i need some help here

i’m trying to set the coregui enabled to false on click and to true when you deselect a button but i have multiple buttons so i have a small issue here, because when i switch from button to button it both enables and disables it because one’s being deselected and another is being selected which leads to the coregui being enabled unwantingly

example:


local PhoneIcon = Icon.new()
:setName("Phone")
:setLabel("Phone")
:bindEvent("selected", function(icon)
	CoreGui:SetCoreGuiEnabled(Enum.CoreGuiType.All, false)
end)
:bindEvent("deselected", function(icon)
	CoreGui:SetCoreGuiEnabled(Enum.CoreGuiType.All, true)
	CoreGui:SetCoreGuiEnabled(Enum.CoreGuiType.Backpack, false)
end)
:setEnabled(true)

local ClanIcon = Icon.new()
:setName("Clans")
:setLabel("Clabs")
:bindEvent("selected", function(icon)
	CoreGui:SetCoreGuiEnabled(Enum.CoreGuiType.All, false)
end)
:bindEvent("deselected", function(icon)
	CoreGui:SetCoreGuiEnabled(Enum.CoreGuiType.All, true)
	CoreGui:SetCoreGuiEnabled(Enum.CoreGuiType.Backpack, false)
end)
:setEnabled(true)
2 Likes

is it the same problem that i have with my topbar?

you can see the video in the post.

he didnt respond to me yet. so we have to wait

1 Like

image
A little problem I found any fixes?

Im expericening a problem where they duplicate when you die how do i fix this?

Nevermid i shall not put localscripts in startergui

Is it possible using this to make a way to deselect a button from a different local script?

Why does this not toggle the gui when pressed

local Icon = require(game:GetService("ReplicatedStorage").Icon)
local icon = Icon.new()
	:setImage(9394951049)
	:setLabel("Proton Admin", "hovering")
	:bindToggleKey(Enum.KeyCode.V)
	:bindToggleItem(game.Players.LocalPlayer.PlayerGui.ProtonAdmin.AdminGUI)

Use :GetIcon(name) then icon:deselect()

Try this instead:

local Icon = require(game:GetService("ReplicatedStorage").Icon)
local Players = game:GetService("Players")
local icon = Icon.new()
	:setImage(9394951049)
	:setLabel("Proton Admin", "hovering")
	:bindToggleKey(Enum.KeyCode.V)
icon.deselected:Connect(function()
	Players.LocalPlayer.PlayerGui.ProtonAdmin.AdminGUI.Visible = false
end)
icon.selected:Connect(function()
	Players.LocalPlayer.PlayerGui.ProtonAdmin.AdminGUI.Visible = true
end)