How can I make some frames line up (possibly with some padding) with the bottom of a textlabel/imagelabel

So here’s what I’ve got going on
I’ve got 2 frames, a textlabel and (sometimes) an imagelabel
The “file” structure is

Frame 1
    Frame 2
      TextLabel
      ImageLabel (sometimes)

The TextLabel contains user text and the ImageLabel may sometimes be a different size
Assume we have a variable called isImage which defines whether or not the ImageLabel exists or not
When isImage is true, I want the bottom part of both frames to line up with the bottom of the ImageLabel padding
When it is not true, I want both frames to line up with the bottom of the TextLabel + padding

How can I accomplish this?

5 Likes

Could you draw a visual representation of what you’re looking for?

1 Like

Graphic design is my passion

3 Likes

(The imagelabel is basically the same deal but under the text so might be a problem)

2 Likes

Oh yeah totally there is a way using AutomaticSize and SizeConstraint

    Frame 1
      TextLabel
      ImageLabel (sometimes)

For the sake of simplicity, I’ll use this setup with just one frame (but it can easily be adjusted to more parents).
(The green outline is the UIStroke applied on Frame 1)

Looks like this in my studio:
image
image

For frame1 the settings are:

Where the changes on the parent frame are:
AutomaticCanvasSize = Enum.AutomaticSize.XY
Size = UDim2.fromScale(1, 0)
AnchorPoint = Vector2.new(0.5, 0)
Position = UDim2.fromScale(0.5, 0)

For ImageLabel the settings are:

Where the changes on the ImageLabel are:
AutomaticCanvasSize = Enum.AutomaticSize.X
SizeConstraint = Enum.SizeConstraint.RelativeXX
Size = UDim2.fromScale(1, 0.4) --Whatever size you want

And finally for the TextLabel the settings are:

Where the changes on the TextLabel are:
AutomaticCanvasSize = Enum.AutomaticSize.X
SizeConstraint = Enum.SizeConstraint.RelativeXX
Size = UDim2.fromScale(1, 0.4) --Whatever size you want

1 Like

Changing SizeConstraint to RelativeXX on the textlabel makes the text way too big

1 Like

Ahh so you want to add more characters into the TextLabel and thats what makes the Frame increase? Not an increase in the Size property for the TextLabel?

Exactly. I want the scale to change based on the text as shown in the example

1 Like

Gonna move this back to scripting support since I’m gonna assume it’s gonna require a script to do it

1 Like


Something like this?

Yes, that’s what I’m after
Back to design support I guess

1 Like

New layout looks like this:
image

So you’re going to have to nest the textlabel inside a frame

The parent frame properties:

The textlabel properties:

important Also change the Text properties to this:

You don’t need code to make this

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