UI's going offset when in-game

I’m designing the UI in Roblox Studio so that it looks good to me,
image

but, when joining in-game, it looks like this
image
I think it looks like it has gone down by a bit…

is there any fix for this?

3 Likes

When you are in-game your ROBLOX player is full screen?

1 Like

One thing to remember when designing a UI is that the first values of the UDim2 (the first x and y value) is scale. That means there is 100% to work with (that’s good for positioning the element in the correct part of the screen for all users). The second value is off set. I usually use this if I have like images, however I find scale is better for me.
My point being, if you want the same exact size (in both studio and in game), use offset, and if something needs to be positioned perfectly in a frame or whatnot, set its size to {1,0},{1,0}.
Not sure if that’s what you’re looking for, but that’s how I interpreted it (sorry lol)
Hope this helps :blush:

1 Like

Yes, I am fullscreen while in-game, because when I’m not fullscreen this happens:
image

1 Like

Show the sizes of the GuiObject?

1 Like

Side button’s size: {0, 54},{0, 55}
Money Display size: {0, 261},{0, 55}

I used the drag/resize editor while designing these, I don’t use even values while designing UI’s…
I should start using even values while designing UI sizes right?

1 Like

Can you also show the positions?

1 Like

Do some research on the difference between Scale and Offset for positioning and sizing GUIs. Also check out the AnchorPoint property. You should be able to use all of these in conjunction with each other to fix your positioning issues! (Sorry but not giving a specific fix, but this will help you create better guis in the future :slight_smile: )

UPDATE: I will give you a fix for this after all! I assume you want it in the bottom left corner of the screen.
Make the anchor point of your frame: 0,1
Make the position of your frame: 0,0,1,0
Then make the size whatever you want. It should always stick to the bottom left corner now.

7 Likes

Side Toggle Posistion: {0.007, 0},{0.938, 0}
Money Display Position: {0.04, 0},{0.938, 0}

Same thing, I don’t use even values…

1 Like

Yeah, if you use the Offset:

{Scale, Offset},{Scale, Offset}

Then your UIs will only work for one screen size. There is a cool plugin that can automatically make your UIs resize, so this might not be necessary, but I recommend you use the Scale, not the Offset.

1 Like

Okay, because it only works in fullscreen, and what’s that plugin?

1 Like

Let me get a link.

1 Like

There.

6 Likes

Thanks! Appreciate the help :slight_smile:

1 Like

But I’d still recommend you learn to use Scale lol. NP.

1 Like

Yeah, I tried it, and I absoulutely love it! :smile:

1 Like

Great! Solution?

1 Like