UIFlexItem does not initialize correctly until viewport is updated

Bug Reports Engine Bugs
,
#1

Using the new flex UI beta, when you use a UIFlexItem in a GuiObject, its size may not initialize correctly. You will have to resize the viewport to force the object to update to its correct size. Below is a video showing the issue. A Play Solo session had just started a few seconds prior to the recording. You can see an experience bar that is overlapping another UI element. Once I resize the viewport by dragging its bottom edge the bar is resized correctly.

Here is the relevant piece of the UI’s hierarchy. There are three elements present inside a UIListLayout container. The experience bar - BarContainer - has a LayoutOrder which puts it in the middle between two elements that have a pre-defined size (using Scale and Offset). The experience bar contains a UIFlexItem with FlexMode set to Fill.

image

9 Likes
New UIListLayout Flex Features [Beta]
#2

Bump. This is still happening to me.

#3

I’ve been experiencing this bug aswell, and for quite a long time

Edit: this bug is probably not gonna be fixed quickly, as it is the beta does not work on roblox game clients

#4

Hi, thanks for reporting this issue! I’ll let you know when there are any updates on this.

2 Likes
#5

Hi @Zomebody if you have a chance, would you be able to send a minimal repro file (rbxl or rbxm) of the UI that doesn’t update correctly?

This would help me verify that the bug is indeed fixed. Thanks!

1 Like
#6

Well, the thing is it still does not work. Just to note, same goes for UIListLayout (with it’s HorizontalFlex and VerticalFlex properties). When GUI is initialized, calculations fail, but after resizing, it fixes itself. Even simply selecting the item fixes it but the gui is off when initialized.

Structure:
image
Studio:
image
Hitting play:
image

image

The problem is, it does not work with Plugins either!
image

image

#7

Hi, yes we are aware this issue is currently still present in the UIListLayout flex features beta.

I am planning to deploy a fix for this as well as for a few other bugs. I’ll be sure to post to the main flex layout thread when the fixes are live!

#8

Hi @Zomebody @Semir2006, I believe this bug should be fixed now in the UIListLayout flex beta! Could you confirm if you get a chance? Thanks!

1 Like
#9

Haven’t been in Studio for a while so I cannot really test it but I can say that the plugin GUI looks good right after opening so I guess it is fixed. Thanks a lot!

1 Like
#10

I did a quick test and don’t see the bug anymore. I’m going to assume it’s fixed for good. Thanks for the update!

2 Likes
#12

I may have incorrectly assumed that the bug is fixed because this week I noticed some more related issues. Similar to the video I posted in the original bug report, the two UI elements are once again sometimes overlapping until I resize my viewport to force an update.

image

I also noticed a related issue where updating the size of the viewport would prevent text from scaling correctly if TextScaled is true and the label has a UIFlex child. This is best seen in the emulator view. E.g. here in this video you can see my text scaling in all sorts of weird ways.

When I switch from a large screen size to a small screen size my text scales to become a lot smaller than it should be.

I think this is caused by the same bug, but please let me know if I should file a separate bug report for this problem.

#13

You are correct, thanks for flagging this! We had a temporary regression for the last 2 weeks, but I turned on a fix today. Please let us know if the reported issues are fixed!

2 Likes