Topbar+ v1 (deprecated) | Add additional functionality and themes to your topbar

Resources Community Resources
#64

is there any way to remove your hd admin topbar button that comes up automatically, it takes over the fake chat button and the only way to open it is by “/”

c2e2f6de7faf631f7245605e0f6b6310

Note: The right button is the custom one made manually, and the left is the hd admin one, it overlaps the fake chat button :joy:, I would just delete my button that I made, but I want it to fit with the blue theme

also, did try this, didn’t work:

--Local script in StarterPlayerScripts
local hdMain = require(game:GetService("ReplicatedStorage"):WaitForChild("HDAdminSetup"))
local hdAdminMain = hdMain:GetMain()
local hd = hdAdminMain:GetModule("API")
hd:SetTopbarEnabled(false)
1 Like
#65

The HD Admin button shouldn’t be showing up. What’s in your explorer?

#66

image

In SSS

Edit:
image
also the other admin button made automatically is made by topbar+

“HD” is mine, and “HDAdmin” is the other button

#67

That’s not what I have…

Maybe try using the Topbar+ Installer that I have created with @ForeverHD’s permission (Thx HD)

And maybe then it should work?

Scripts That Get Installed:

Screen Shot 2020-05-23 at 3.49.57 pm

2 Likes
#68

It doesn’t work, just the same result of overlapping the chat and makes it invisible

#69

May I have a screenshot?

#70

If you’re trying to re-theme your whole topbar (including the the HD icon which comes with HD Admin), I recommend using IconController:setGameTheme(theme), which sets a theme which is applied to all existing and future icons.

To grab the existing HD Admin icon with V2, you can do:

local hdMain = require(game:GetService("ReplicatedStorage"):WaitForChild("HDAdminSetup")):GetMain()
local TopbarController = hdMain:GetModule("TopbarClient")
local hdIcon = TopbarController:getIcon("HDAdmin")
3 Likes
#71

Actually, while going through a script, I found the topbarClient, and I tried the gameTheme but the (fake) chat still gets overlapped by the icon

#72

How do I enable and disable Topbar+ that comes with HD Admin?

#73

I’ve just deployed a patch to fix this. Feel free to DM me if you have further issues specifically with HD Admin.

@UltraKrypt

To hide the icons created specifically by HD Admin, do:

local hdMain = require(game:GetService("ReplicatedStorage"):WaitForChild("HDAdminSetup")):GetMain()
local TopbarController = hdMain:GetModule("TopbarClient")
local hdIcon = TopbarController:getIcon("HDAdmin")
hdIcon:setEnabled(false)
TopbarController:removeFakeChat()

To enable/disable Topbar+, do:

TopbarController:setEnabled(bool)
1 Like
#74

Thanks! It worked. You’re great!

#75

@ForeverHD You never fail to suprise me!

Your ideas are so good, it helps me a lot as a game developer.

Keep up the amazing work! :smiley:

1 Like
#77

Question from @jake31255:

Would it be possible to make the button run a script? I have a First Person Camera Script that I want to be run when the button is clicked.

Sure can! There’s two ways you can achieve this:

  1. Events
icon.selected:Connect(function()

end)

icon.deselected:Connect(function()

end)
  1. setToggleFunction
local function toggleFunction()
     -- This will be called every time the icon is toggled (selected and deselected)
end
icon:setToggleFunction(toggleFunction)
1 Like
#78

Is it possible if I can use the rounded corners that was built-in to the client?
For reference:

rbxasset://LuaPackages/Packages/_Index/UIBlox/UIBlox/App/ImageSet/ImageAtlas/./img_set_1x_1.png

I stumbled upon this path on the CoreGui where it houses the TopBar on how the buttons are laid out. Is this path going to cause conflict in the future when using it for Topbar+?

oh yea i had to edit the script to add the slice thing lol

#79

If significant changes are made to the core UI I’ll have Topbar+ mirror these, so that shouldn’t be a problem. Corner manipulation is something I’m looking to explore once it’s been officially released.

1 Like
#80

Whenever I set a theme for Topbar+, when the icons are not selected, there are no backgrounds. image
image
Sorry if this is hard to understand.

1 Like
#81

That theme (I’m assuming from the docs) purposely makes the buttons background transparent when deselected:

image
image1647×594 39.2 KB

Use this one instead (not from the docs), if you’d like a solid background:

local selectedColor = Color3.fromRGB(0, 170, 255)
local theme = {
	
    -- TOGGLE EFFECT
    ["toggleTweenInfo"] = TweenInfo.new(0.15, Enum.EasingStyle.Quad, Enum.EasingDirection.Out),

    -- OBJECT PROPERTIES
    ["button"] = {
        selected = {
            ImageTransparency = 0.1,
            ImageColor3 = selectedColor,
        },
    },
    ["image"] = {
        selected = {
            ImageColor3 = Color3.fromRGB(255, 255, 255),
        },
        deselected = {
            ImageColor3 = Color3.fromRGB(255, 255, 255),
        },
    },
    ["notification"] = {
        selected = {
            Image = "http://www.roblox.com/asset/?id=4882430005",
            ImageColor3 = Color3.fromRGB(255, 255, 255),
        },
        deselected = {
            Image = "http://www.roblox.com/asset/?id=4882430005",
            ImageColor3 = selectedColor,

        },
    },
    ["amount"] = {
        selected = {
            TextColor3 = selectedColor,
        },
        deselected = {
            TextColor3 = Color3.fromRGB(255, 255, 255),
        },
    },
}
1 Like
#82

@ForeverHD You’re a absolute Legend!

Thank you for making this.

You continue to surprise me, the things you do for the community is really good!

Keep up the great work!

1 Like
#83

Wow, this is Amazing!
This really gives us the ability to make themes that fit the GUI style of our games. How can I get it?
And Good job :+1: by the way!

#84

You can simply load the most up-to-date modules into your game by running require(4874365424) in a server script (for example a Script placed in ServerScriptService), or grabbing the source code directly from the repository.

Then in a LocalScript placed under StarterPlayerScripts (for the first method) you can reference the IconController by doing:

local replicatedStorage = game:GetService("ReplicatedStorage")
local topbarPlus = replicatedStorage:WaitForChild("HDAdmin"):WaitForChild("Topbar+")
local iconController = require(topbarPlus.IconController)

Then creating an icon by doing:

local shopIcon = iconController:createIcon("Shop", 4882429582, 1)

For more coded examples, it’s definitely worth checking out the playground!

3 Likes