[HELP] GUI Appearance Support

Hey there!

So, I recently made a GUI. For some reason, upon loading into the game, the main GUI itself is already on screen, like such:

(Yes, I know it’s not centered)

However, I would like it to look like the following upon loading in:

The Script I Used:
script.Parent.MouseButton1Click:Connect(function()
local shop = script.Parent.Parent.Frame
shop:TweenPosition(UDim2.new(0.288,0,0.218,0), “Out”,“Elastic”,0.5,true)
end)

Does anyone know why it’s happening and how I can fix it?

2 Likes

Is the Shop Gui already on screen before you run the game as well?

you can fix this easily by setting the position of the Gui offscreen immediately.

Yeah. Before I run the game, my screen looks like the following:

You Can also drag the Shop Off screen in the studio before running the game.

I’m not entirely sure I know what you mean.

This can easily be fixed by turning the visibility of the gui off and than just when the button is clicked have the gui smaller than have the button hiding off past the side of the screen than have it enter the screen on click.

2 Likes

I mean since it is already there in studio The tween wont do anything since the goal has already been reached.

I’m brand new to this sort of stuff, therefore I’m not entirely sure how I would go about doing that. Sorry.

1 Like

He’s saying you need to move the GUI. You’re asking the GUI to move when it’s already in the correct position.

Everyone starts from somewhere, once upon a time everyone was like this!

2 Likes

If your problem is still active then I will show some information on how to effectively do stuff.
So, for the beginning you have to get your local script in that Shop button, and if you want it to work like you click it multiple times instead of using a close button I suggest using this:

	
	local isdone = false
	
	if script.--[[the directory of your frame]].Visible == false and isdone == false then
		script.--[[the directory of your frame]].Visible = true
		isdone = true
	end
	
	if script.--[[the directory of your frame]].Visible == true and isdone == false then
		script.--[[the directory of your frame]].Visible = false
		isdone = true
	end
	
	isdone = false
	
end)

Edit:
I never suggest you moving the screen gui parts by mouse because as how you can see it produces those weird “0.288” and “0.218”. Those show the screen weld position. The position properties look like “{XW,XP},{YW,YP}” where XW is the horizontal weld, with value from 0 to 1 and same for YW, but it’s vertical, also it’s important to know that when XP and YP are 0, XW and YW weld the part on the top right corner, so to make a perfectly centered part on all screens you have to check the part size, divide the x and y values by 2 and put their negative value in XP and YP. For example: part size: X = 200px, Y = 300px, make the position of that part {0.5,-100},{0.5,-150}. By setting a size of your part that suits you and welding it to XW = 0, YW = 0.5 will make that part be the same size in pixels (not proportion because different screens have different pixel density) on all screens and weld to the middle left of the screen.

2 Likes