How do I make a gui stay in the same place?

Recently I’ve been working on a gui system and whenever I tween a gui to make it smaller it goes in one direction a tiny bit. the thing is I want to keep it in place instead of moving that little bit. does anyone know a specific way to code it so it stays where I want it? thanks.


as you can see when the guis shrink they are locked to the top left of the frame.

(don’t worry about they constantly shrinking, I just want to know how to keep them centered when shrinking.)

Hi, you can use the AnchorPoint property to fix this problem.

Can you try it and let me know if it works or not?

:smile:

3 Likes

Ive never used anchor point before, so i’m not sure if i implemented this correctly. when I ran the script i ran into a error

local SizeNPos = TweenService:Create(OtherGui,info,{Size = OtherGui.Size - UDim2.new(.05,0,.05,0),Position = CorrectPos.AnchorPoint})

“TweenService:Create property named ‘Position’ cannot be tweened due to type mismatch (property is a ‘UDim2’, but given type is ‘Vector2’)”

since I’m using udimm2 I don’t think vector 2 will work idk though im not experienced with UI’s

Yeah when creating a tween for a GUI element, both the ‘Size’ and ‘Position’ properties expect values of type UDim2 , not Vector2

the AnchorPoint property of a GUI element is a Vector2 , which is the " normalized " position within the element where the anchor is set, but it cant be used as the ‘Position’ in a tween because they are different types

anchorpoint is used to determine the pivot point of the UI element while the Position determines the actual position of the element in the parent container. they work together to place the element, but they are not interchangeable. personally i would fix it like this:

  1. Set the AnchorPoint of the OtherGui element separately and outside of the tween, if you need to change it
  2. Create the tween with the UDim2 value for the Position

:smile:

1 Like

You do not use code for this (atleast what I think, never used anchorpoints before). But I think I know how it goes.
In this image you can see the default anchorpoint is on the upper left corner (0,0) so when you resize the GUI it will resize from the left upper corner.
image
image
But if you put the anchor point (0.5,0.5) the anchor point will be in the middle and the scale will resize in the center
image
image
I suck at explaining, maybe the images will help. lmk if you need any more help.
Edit: make every anchorpoint on the UI elements that you’re trying to resize to (0.5,0.5)

2 Likes

@DrDarkBlock Yeah, you’re right. That’s one way to do it too. :smiley:

1 Like

Thanks I had to change one line in the code along with this but it seemed like a easier and faster fix than rewriting the code to accommodate anchor points. appreciate both of the responses. :+1:

1 Like

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