Im making a open and close inventory by clicking the button?

Hi , im very new to scripting, but there seem to be a promblem to what i did, im practicing my coding skill by making something, so i got an idea, i want to do a UI where you click the button, then the UI (GUI) appears, and if you click the button again, the UI or GUI, Dissapear, Then if you click it again ,it appears and so on, here's what i got :

local Mainframe = script.Parent.Parent.Mainframe

if Mainframe.Visible == false then
	script.Parent.MouseButton1Click:Connect(function()
		Mainframe.Visible = true
	end)
end

if Mainframe.Visible == true then
	script.Parent.MouseButton1Click:Connect(function()
		Mainframe.Visible = false
	end)
end

Mainframe.Changed:Connect(function()
	if Mainframe.Visible == true then
		script.Parent.MouseButton1Click:Connect(function()
			Mainframe.Visible = false
		end)
	end
end)

Mainframe.Changed:Connect(function()
	if Mainframe.Visible == false then
		script.Parent.MouseButton1Click:Connect(function()
			Mainframe.Visible = true
		end)
	end
end)

Even tho i command the code to check if the mainframe changed, it still doesnt work

Backpack Mainframe Somestuff InventoryButton LocalScript <--- where the script above is

Ok, lets try it!

Firs Step : We need to know where's the GUI located (The position). And then move it to the position we want.

Second Step : Second, we need to know how to use boolean values. They're very usefull to make this type of things with GUI or debounce.

Third Step : We will learn the function "TweenPosition()" so we can make more cosmetic the frame and make it bettter.

Fourth Step : We need to know what is a Script and a LocalScript in this case we will use a LocalScript, so create it on the button.

Fifth Step : Enjoy coding! Always have to enjoy what are you doing! Play some music while you code or something that relax you.

Lets get into the code!

--[[
	First, create a boolean Value on the ScreenGui and name it "openValue" and then
	duplicate it and rename it "closeValue". Then select the box in the right side of "Value"
	on the Properties panel. [Do it for the closeValue]

	Put this script on the Button.

	We will need a "OpenButton" and a "CloseButton" so make sure you already create
	a second button for the closeButton 
]]

local frame = script.Parent.Parent.frame --> Change it to your frame name
local openV = script.Parent.Parent.openValue
local closeV = script.Parent.Parent.closeValue
local button = script.Parent

local function tweeningF()
	frame:TweenPosition(Udim2.new("Showing Position"), "Out", "Quint"; 1, true)
end

local function openF()
	if closeV then
		if not openV then
			openV = true
			closeV = false
			
			tweeningF()
		end
	end
end

button.MouseButton1Click:Connect(openF)
--> This is all for the openButton

And that's how we make a openButton, now lets make the closeButton. You can customize it however you want.

Lets get into the code!

local frame = script,Parent.Parent.frame
local openV = script.Parent.Parent.openValue
local closeV = script.Parent.Parent.closeValue
local closeButton = script.Parent

local function tweeningF()
	frame:TweenPosition(Udim2.new("Hiding Position"), "Out", "Quint", 1, true)
end

local function closeF()
	if openV then
		if not closeV then
			closeV = true
			openV = false

			tweeningF()
		end
	end
end

closeButton.MouseButton1Click:Connect(closeF)

This can be easily done with not too many lines of code.

local Mainframe = script.Parent.Parent.Mainframe

script.Parent.MouseButton1Click:Connect(function()
	Mainframe.Visible = not Mainframe.Visible -- similar to a toggle on/off
end)