Description
Recently, I was browsing the DevForum looking for answers of how to make a billboardgui not scale when the camera is moving (an example is set below in the examples section). The posts I’ve seen have been less comprehensive and rather difficult to follow; so I’ve decided to make this post.
Sections
Section 1: Understanding Offsets and Scales
The differences between offsets and scales play a significant role within this tutorial. The specific Sizes and Offsets I am referencing are billboardguis’ size offsets and size scales.
When you set an offset, you are setting the UIobjects size in pixels and fixing it there. This causes the UIobject to scale itself when the camera moves. However, this is the opposite for scaling.
When you set the scale of a UIobject, you are not fixing its’ size, so it does not move when the camera changes positioning. This results in the UIobject staying in place. Please note that this only applies to the object that you are setting the scale for, it does not apply to it’s children or any descendants.
Section 2: Creating the UI Object
For us to actually begin this, we need a sample UI. For this, just insert a Billboardgui into the workspace and a part. Then, make the billboardgui a child of the part you inserted.
Something like this:
Notice how when you move the camera, the biilboardgui and the textlabel automatically scale? For reference, view the attached video:
Video
Section 3: Setting the properties of the UIO
Now that we have our UI, let’s begin setting the properties for the objects.
First, we need to set the scale property of the Billboardgui, using offset will fix it’s size in pixels, so we need to use the scale section which are the first numbers in the x and y axis.
For example, {{a,b},{c,d}}.
‘a’ and ‘c’ would both be the scales since they’re the first numbers that appear on the axis.
Why not set the scale to the same as the textlabel? Let’s do that! To do this, set the X scale to 7.5,0. This is the closest scaling to the offset being 200 from trial and error. Now, set the Y axis to 1.5, same thing; closest to the offset being 50 from trial and error.
Now try moving the camera again, see how only the textlabel is moving? This is because the textlabel is the only UIObject with offsets.
So now, let’s do the same for the textlabel parented to the billboardgui. Set both the X and Y axis’s offsets to 0 and the scales to 1.
Try moving the camera once more, notice how only the text is moving? To stop that, just set TextScaled to true.
Now look at it again, it does not automatically scale itself when the camera moves because it is not fixed (not ‘fixed’ as in opposite of being destroyed), See the video below for reference:
Video
Now we’re done! Your billboardgui and its descendants should not scale itself when the camera moves.
Examples
UI Scaling Itself: Post Description
Key details: The Billboardgui scales itself and ends up going through the baseplate.
If I made a mistake, please let me know so I can fix!
Documentation used: SizeOffset