How would I add multiple "open frame" statements?

Hey everyone!

I’ve recently ran into a small problem with my “side panel” script for one of my projects … in the following script, I wanted to add multiple “open frame” statements (last few lines), however I’m unsure how, exactly, would I add that in as I keep getting red underlines in my code.

Here’s the script —

-- SCRIPT FOR NAVIGATION PANEL

local PanelNav = script.Parent.Parent.StarterGui.MainUI.MainFrame.NavigationPanel

-- Define a table with references to each UI frame
local uiFrames = {
	Dashboard = game.Players.LocalPlayer.PlayerGui.MainUI.DashboardFrame;
	Calendar = game.Players.LocalPlayer.PlayerGui.MainUI.CalendarFrame;
	Weather = game.Players.LocalPlayer.PlayerGui.MainUI.WeatherFrame;
	Moderation = game.Players.LocalPlayer.PlayerGui.MainUI.ModeratorFrame;
	Messages = game.Players.LocalPlayer.PlayerGui.MainUI.MessagesFrame;
	Friends = game.Players.LocalPlayer.PlayerGui.MainUI.FriendsFrame;
	Meetings = game.Players.LocalPlayer.PlayerGui.MainUI.MeetingsFrame;
	Account = game.Players.LocalPlayer.PlayerGui.MainUI.AccountFrame;
	YourPlan = game.Players.LocalPlayer.PlayerGui.MainUI.YourPlanFrame;
}

-- Define a table with references to each text button
local DashboardBtn = PanelNav.Dashboard
local CalendarBtn = PanelNav.Calendar
local WeatherBtn = PanelNav.Weather
local ModerationBtn = PanelNav.Moderator
local MessagesBtn = PanelNav.Messages
local FriendsBtn = PanelNav.Friends
local MeetingsBtn = PanelNav.Meetings
--local AccountBtn = PanelNav.Account
local YourPlan = PanelNav.YourPlan

-- Connect the button to the UI frame opening function
DashboardBtn.MouseButton1Click:Connect(function()
	local frameName = DashboardBtn.Name -- Use the button's name as the frame name
	-- Iterate through the UI frames and set visibility
	for name, frame in pairs(uiFrames) do
		frame.Visible = (name == frameName)
	end
end)

Hey @CookieTechAi, could you lend me a hand and tell me how I can change UI frame visibilities for all the defined frames, not just the dashboard frame?

Hi there! To change UI frame visibilities for all the defined frames, you can modify the MouseButton1Click event handler for each button to open the appropriate frame when clicked. Here is an example modification of your code that should accomplish this:

-- SCRIPT FOR NAVIGATION PANEL

local PanelNav = script.Parent.Parent.StarterGui.MainUI.MainFrame.NavigationPanel

-- Define a table with references to each UI frame
local uiFrames = {
	Dashboard = game.Players.LocalPlayer.PlayerGui.MainUI.DashboardFrame;
	Calendar = game.Players.LocalPlayer.PlayerGui.MainUI.CalendarFrame;
	Weather = game.Players.LocalPlayer.PlayerGui.MainUI.WeatherFrame;
	Moderation = game.Players.LocalPlayer.PlayerGui.MainUI.ModeratorFrame;
	Messages = game.Players.LocalPlayer.PlayerGui.MainUI.MessagesFrame;
	Friends = game.Players.LocalPlayer.PlayerGui.MainUI.FriendsFrame;
	Meetings = game.Players.LocalPlayer.PlayerGui.MainUI.MeetingsFrame;
	Account = game.Players.LocalPlayer.PlayerGui.MainUI.AccountFrame;
	YourPlan = game.Players.LocalPlayer.PlayerGui.MainUI.YourPlanFrame;
}

-- Define a table with references to each text button
local DashboardBtn = PanelNav.Dashboard
local CalendarBtn = PanelNav.Calendar
local WeatherBtn = PanelNav.Weather
local ModerationBtn = PanelNav.Moderator
local MessagesBtn = PanelNav.Messages
local FriendsBtn = PanelNav.Friends
local MeetingsBtn = PanelNav.Meetings
--local AccountBtn = PanelNav.Account
local YourPlanBtn = PanelNav.YourPlan

-- Connect the button to the UI frame opening function
DashboardBtn.MouseButton1Click:Connect(function()
	openFrame("Dashboard")
end)
CalendarBtn.MouseButton1Click:Connect(function()
	openFrame("Calendar")
end)
WeatherBtn.MouseButton1Click:Connect(function()
	openFrame("Weather")
end)
ModerationBtn.MouseButton1Click:Connect(function()
	openFrame("Moderation")
end)
MessagesBtn.MouseButton1Click:Connect(function()
	openFrame("Messages")
end)
FriendsBtn.MouseButton1Click:Connect(function()
	openFrame("Friends")
end)
MeetingsBtn.MouseButton1Click:Connect(function()
	openFrame("Meetings")
end)
--AccountBtn.MouseButton1Click:Connect(function()
--	openFrame("Account")
--end)
YourPlanBtn.MouseButton1Click:Connect(function()
	openFrame("YourPlan")
end)

-- Define the function to open a UI frame by name
function openFrame(frameName)
	-- Iterate through the UI frames and set visibility
	for name, frame in pairs(uiFrames) do
		frame.Visible = (name == frameName)
	end
end

In this modified version of your code, each button now has its own event handler that calls the openFrame function with the name of the frame to be opened as an argument. The openFrame function then iterates through the uiFrames table and sets the visibility of each frame based on whether its name matches the frameName argument.

I hope this helps! Let me know if you have any further questions.

1 Like

Thanks for your help, but the script didn’t work … the frames are all, by default, have “Visible” set to “false” if that makes a difference.

For example, if I wanted to hit “DashboardBtn” it will make every other frame defined as invisible, except for the associated frame with this button. In this example, “DashboardBtn” is associated with “Dashboard”.

Now, can we fix the script so that each button defined is “linked” with its own specified frame?

I see, thank you for clarifying. In that case, you can modify the uiFrames table to include both the frame reference and a boolean indicating whether the frame is currently visible. You can then update this boolean for each frame when a corresponding button is clicked. Here’s an updated example of your script that should accomplish this:

-- SCRIPT FOR NAVIGATION PANEL

local PanelNav = script.Parent.Parent.StarterGui.MainUI.MainFrame.NavigationPanel

-- Define a table with references to each UI frame and its current visibility status
local uiFrames = {
	Dashboard = {
		Frame = game.Players.LocalPlayer.PlayerGui.MainUI.DashboardFrame;
		Visible = true;
	};
	Calendar = {
		Frame = game.Players.LocalPlayer.PlayerGui.MainUI.CalendarFrame;
		Visible = false;
	};
	Weather = {
		Frame = game.Players.LocalPlayer.PlayerGui.MainUI.WeatherFrame;
		Visible = false;
	};
	Moderation = {
		Frame = game.Players.LocalPlayer.PlayerGui.MainUI.ModeratorFrame;
		Visible = false;
	};
	Messages = {
		Frame = game.Players.LocalPlayer.PlayerGui.MainUI.MessagesFrame;
		Visible = false;
	};
	Friends = {
		Frame = game.Players.LocalPlayer.PlayerGui.MainUI.FriendsFrame;
		Visible = false;
	};
	Meetings = {
		Frame = game.Players.LocalPlayer.PlayerGui.MainUI.MeetingsFrame;
		Visible = false;
	};
	Account = {
		Frame = game.Players.LocalPlayer.PlayerGui.MainUI.AccountFrame;
		Visible = false;
	};
	YourPlan = {
		Frame = game.Players.LocalPlayer.PlayerGui.MainUI.YourPlanFrame;
		Visible = false;
	};
}

-- Define a table with references to each text button
local DashboardBtn = PanelNav.Dashboard
local CalendarBtn = PanelNav.Calendar
local WeatherBtn = PanelNav.Weather
local ModerationBtn = PanelNav.Moderator
local MessagesBtn = PanelNav.Messages
local FriendsBtn = PanelNav.Friends
local MeetingsBtn = PanelNav.Meetings
--local AccountBtn = PanelNav.Account
local YourPlanBtn = PanelNav.YourPlan

-- Connect each button to the UI frame opening function
DashboardBtn.MouseButton1Click:Connect(function()
	openFrame("Dashboard")
end)
CalendarBtn.MouseButton1Click:Connect(function()
	openFrame("Calendar")
end)
WeatherBtn.MouseButton1Click:Connect(function()
	openFrame("Weather")
end)
ModerationBtn.MouseButton1Click:Connect(function()
	openFrame("Moderation")
end)
MessagesBtn.MouseButton1Click:Connect(function()
	openFrame("Messages")
end)
FriendsBtn.MouseButton1Click:Connect(function()
	openFrame("Friends")
end)
MeetingsBtn.MouseButton1Click:Connect(function()
	openFrame("Meetings")
end)
--AccountBtn.MouseButton1Click:Connect(function()
--	openFrame("Account")
--end)
YourPlanBtn.MouseButton1Click:Connect(function()
	openFrame("YourPlan")
end)

-- Define the function to open a UI frame by name
function openFrame(frameName)
	-- Iterate through the UI frames and set visibility flags
	for name, data in pairs(uiFrames) do
		if name == frameName then
			data.Frame.Visible = true
			data.Visible = true
		else
			data.Frame.Visible = false
			data.Visible = false
		end
	end
end

In this version of your script, each frame in the uiFrames table now contains a reference to the frame itself as well as a boolean indicating whether it is currently visible. The openFrame function has been updated accordingly to set both the frame’s visibility property and its visibility flag based on whether it matches the supplied frameName. When a frame is set to be visible, all other frames are automatically set to be invisible.

I hope this updated script works for you! Let me know if you have further questions.

1 Like

I’m getting orange underlines under the “openFrame” text in this area of the script, how would I fix that?

-- Connect each button to the UI frame opening function
DashboardBtn.MouseButton1Click:Connect(function()
	openFrame("Dashboard")
end)
CalendarBtn.MouseButton1Click:Connect(function()
	openFrame("Calendar")
end)
WeatherBtn.MouseButton1Click:Connect(function()
	openFrame("Weather")
end)
ModerationBtn.MouseButton1Click:Connect(function()
	openFrame("Moderation")
end)
MessagesBtn.MouseButton1Click:Connect(function()
	openFrame("Messages")
end)
FriendsBtn.MouseButton1Click:Connect(function()
	openFrame("Friends")
end)
MeetingsBtn.MouseButton1Click:Connect(function()
	openFrame("Meetings")
end)
--AccountBtn.MouseButton1Click:Connect(function()
--	openFrame("Account")
--end)
YourPlanBtn.MouseButton1Click:Connect(function()
	openFrame("YourPlan")
end)

The orange underlines might indicate that the openFrame function is not defined in the same scope as your button click handlers. To fix this issue, you should make sure that your function is defined at the same level as your event handlers. Here is an example of how you might define the openFrame() function in the same script as the button click handlers:

-- SCRIPT FOR NAVIGATION PANEL

local PanelNav = script.Parent.Parent.StarterGui.MainUI.MainFrame.NavigationPanel

-- Define a table with references to each UI frame and its current visibility status
local uiFrames = {
    Dashboard = {
        Frame = game.Players.LocalPlayer.PlayerGui.MainUI.DashboardFrame;
        Visible = true;
    };
    Calendar = {
        Frame = game.Players.LocalPlayer.PlayerGui.MainUI.CalendarFrame;
        Visible = false;
    };
    Weather = {
        Frame = game.Players.LocalPlayer.PlayerGui.MainUI.WeatherFrame;
        Visible = false;
    };
    Moderation = {
        Frame = game.Players.LocalPlayer.PlayerGui.MainUI.ModeratorFrame;
        Visible = false;
    };
    Messages = {
        Frame = game.Players.LocalPlayer.PlayerGui.MainUI.MessagesFrame;
        Visible = false;
    };
    Friends = {
        Frame = game.Players.LocalPlayer.PlayerGui.MainUI.FriendsFrame;
        Visible = false;
    };
    Meetings = {
        Frame = game.Players.LocalPlayer.PlayerGui.MainUI.MeetingsFrame;
        Visible = false;
    };
    Account = {
        Frame = game.Players.LocalPlayer.PlayerGui.MainUI.AccountFrame;
        Visible = false;
    };
    YourPlan = {
        Frame = game.Players.LocalPlayer.PlayerGui.MainUI.YourPlanFrame;
        Visible = false;
    };
}

-- Define a function to open a UI frame by name
function openFrame(frameName)
    -- Iterate through the UI frames and set visibility flags
    for name, data in pairs(uiFrames) do
        if name == frameName then
            data.Frame.Visible = true
            data.Visible = true
        else
            data.Frame.Visible = false
            data.Visible = false
        end
    end
end

-- Define a table with references to each text button
local DashboardBtn = PanelNav.Dashboard
local CalendarBtn = PanelNav.Calendar
local WeatherBtn = PanelNav.Weather
local ModerationBtn = PanelNav.Moderator
local MessagesBtn = PanelNav.Messages
local FriendsBtn = PanelNav.Friends
local MeetingsBtn = PanelNav.Meetings
--local AccountBtn = PanelNav.Account
local YourPlanBtn = PanelNav.YourPlan

-- Connect each button to the UI frame opening function
DashboardBtn.MouseButton1Click:Connect(function()
    openFrame("Dashboard")
end)

CalendarBtn.MouseButton1Click:Connect(function()
    openFrame("Calendar")
end)

WeatherBtn.MouseButton1Click:Connect(function()
    openFrame("Weather")
end)

ModerationBtn.MouseButton1Click:Connect(function()
    openFrame("Moderation")
end)

MessagesBtn.MouseButton1Click:Connect(function()
    openFrame("Messages")
end)

FriendsBtn.MouseButton1Click:Connect(function()
    openFrame("Friends")
end)

MeetingsBtn.MouseButton1Click:Connect(function()
    openFrame("Meetings")
end)

--AccountBtn.MouseButton1Click:Connect(function()
--  openFrame("Account")
--end)

YourPlanBtn.MouseButton1Click:Connect(function()
    openFrame("YourPlan")
end)

This code should resolve the issue with the orange underlines for the openFrame() function. Let me know if you have any more questions!

1 Like

Ok, thanks for your help!

While the script did not end up working, I’ll let community members to help me resolve the remainder of this issue. :+1:

No problem! I’m sorry to hear that the script didn’t end up working, but I hope the suggestions I provided were helpful. I’m glad to hear that you’ll be seeking further assistance from the community. Don’t hesitate to reach out if there’s anything else I can do to assist you in the future. Good luck with your project!

1 Like

This seems like scripting hell a little bit. Also red underlines don’t always guarantee an error. Can you clarify exactly what the error is and exactly on what you want to achieve?

1 Like

Alright, so, I have all these frames that must be controlled by their own button. Let’s say I had only two frames for simplicity sake, called “DashboardFrame” and “CalendarFrame”. And, let’s say I had two buttons called “DashboardBtn” and “CalendarBtn”.

What I need to do is somehow link “DashboardFrame” to “DashboardBtn”, and “CalendarFrame” to CalendarBtn" just so that I can make the scripting a bit easier.

If I were to think about this, this process would come to mind — “when I press DashboardBtn, I expect CalendarFrame to become invisible and DashboardFrame should become visible to the user.”

If you need me to clarify something, I’ll make sure I do.

Okay. Let me create a sample script.

@CookieTechAi Create a sample script with a dictionary, inside of that dictionary have a table, the first value in the table has a button, the second a frame. Then finish the script by detecting whenever a button is clicked and then making the frame visible. Make sure it’s prepared to have multiple tables inside of the dictionary.

Here is a sample script that uses a dictionary with multiple tables, where each table contains a button and a corresponding frame. When a button is clicked, the script will make the corresponding frame visible and hide all other frames:

-- Define a table with references to each button and frame
local UIFrames = {
    Dashboard = { Button = game.Players.LocalPlayer.PlayerGui.MainUI.DashboardBtn, Frame = game.Players.LocalPlayer.PlayerGui.MainUI.DashboardFrame };
    Calendar = { Button = game.Players.LocalPlayer.PlayerGui.MainUI.CalendarBtn, Frame = game.Players.LocalPlayer.PlayerGui.MainUI.CalendarFrame };
    -- Add more tables here for additional UI frames
}

-- Connect the button click events to the function
for frameName, uiFrame in pairs(UIFrames) do
    uiFrame.Button.MouseButton1Click:Connect(function()
        -- Iterate through the UI frames and set visibility
        for name, frame in pairs(UIFrames) do
            frame.Frame.Visible = (name == frameName)
        end
    end)
end

In this script, each table in the UIFrames dictionary contains a Button property and a Frame property, which are references to the corresponding UI elements. When a button is clicked, the script loops through all the tables in the UIFrames dictionary and sets the visibility of each frame based on whether it matches the name of the frame associated with the clicked button.

1 Like

Try something like this @OH20_rbLX.

1 Like

Sorry for the very delayed response … the script did not work, but now I’m thinking, maybe it’s something to do with my Explorer setup.

I have the script in ServerScriptService and I’ve editied the code so that it matches up with the actual location of the buttons and frames in the Explorer.

-- SCRIPT FOR NAVIGATION PANEL

-- Define a table with references to each button and frame

local UIFrames = {

Dashboard = { Button = game.StarterGui.MainUI.MainFrame.NavigationPanel.Dashboard, Frame = game.StarterGui.MainUI.DashboardFrame };

Calendar = { Button = game.StarterGui.MainUI.MainFrame.NavigationPanel.Calendar, Frame = game.StarterGui.MainUI.CalendarFrame };

-- Add more tables here for additional UI frames

}

-- Connect the button click events to the function

for frameName, uiFrame in pairs(UIFrames) do

uiFrame.Button.MouseButton1Click:Connect(function()

-- Iterate through the UI frames and set visibility

for name, frame in pairs(UIFrames) do

frame.Frame.Visible = (name == frameName)

end

end)

end

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.