Hey there! So basically I am building an admin panel and I need help in making a menu system. Like when you open one page the other page closes. Just like a website when you click on a menu item.
I want to achieve a menu system just like a website.
I have tried using Frame.Visible and ZIndex but did not work. I did not look for the solution in the Developer Hub.
Here’s the script I used: Note: Every button has it’s Individual script.(It’s just this script duplicated). And yes, each menu button’s name is different
local MenuButton = script.Parent
local Frame = game.StarterGui.Adminify.Frame.MainFrame.--Frame Name--
MenuButton.MouseButton1Click:Connect(function()
Frame.Visible = true
if Frame.ZIndex == 5 then
Frame.ZIndex = 6
else Frame.ZIndex = 5
end
end)
I have made you a working browser page thing (idk what to call it)
This takes one localscript, which is parented to the main screengui
There must be a folder containing all the frames that you want this to work on
Each frame in the folder must have another folder called PageButtons that contains all of the buttons that can switch the page. These buttons must all have an objectValue that points to the page you want to send to.
local frames = script.Parent.Frames--the parent of all your frames, probably a folder
--setup all frames including binding buttons and making invisible to start
for i,v in pairs(frames:GetChildren()) do
--check if we found a frame
if v.ClassName~="Frame" then continue end
--check if the frame has a folder with buttons
local buttons = v:FindFirstChild("PageButtons")
if buttons == nil then continue end
if buttons.ClassName~="Folder" then continue end
print(i,v)
--loop trhough the buttons to set them up
for i,v in pairs(buttons:GetChildren()) do
--make sure its a button
if v.ClassName~="TextButton" then continue end
print(i,v)
--give the button a clicked function
v.MouseButton1Down:Connect(function()
--check if the button has a value of the next page to go to
local value = v:FindFirstChild("NextPage")
if value == nil then return end
if value.Value == nil then return end
--use the value to go to the next page
for i,v in pairs(frames:GetChildren()) do
if v.ClassName~="Frame" then continue end
v.Visible = false
value.Value.Visible = true
end
end)
end
end
If you are still confused, heres an example of what the tree would look like:
in this example the localscript is named coolscript
Well the example I gave worked exactly like a website (you could even add the back and forward buttons) so it will work.
This method works with more than one button leading to different things per page as well, meaning that everything in your gui should work. If you have a button that you don’t want to swap the page just don’t put it into the pagebuttons folder.
I would recommend using UIPageLayout this way you can loop through all the menu buttons and give the Activated connection and then use :JumpTo() to go the corresponding page.
-- Local script (just one is needed)
local MenuButtons = -- Define here
local Pages = -- Define here
local UIPageLayout = --Define here (should be in the Pages frame)
for _, button in pairs(MenuButtons:GetChildren()) do
if button:IsA("ImageButton") then
button.Activated:Connect(function()
-- This will only work if the page is the same name as the button
UIPageLayout:JumpTo(Pages:FindFirstChild(button.Name))
end
end
end
Uhmm. I don’t think I understood that. Do you mean to add UIPageLayout to all the Frames I am using as a page. I did’t get what the :JumpTo() thing means
So create a frame to fill up the right side of your UI and make it invisible (wherever your pages are going to go) and insert a UIPageLayout and then drag all your pages as a child of the invisible frame.
If you can send me a screenshot of how your explorer looks I can help guide you on what to do, If you feel like everything is already in place then you can simple use the script I wrote earlier
Can you send an image of your explorer so I can see how you have it laid out? Also for this, I would recommend making an invisible frame or white frame and using that as the background so it takes up the whole area under the top bar. Now call that frame “Pages” and put all the pages in there. Then make another frame invisible or grey and set that up so its the same size as the sidebar and make sure that is on top of the pages frame so when you open the menu it’s in front of the page UI and call this frame “Menu” or “Sidebar” now use a UIlistlayout so it’s all neat and you can mess around with the padding etc.
