Nested Layouts don't refresh properly (in a scratch-like coding interface)

[tbll]

Hi everyone,

We are currently developing a game that include a coding scratch-like interface (a visual coding interface).

This visual coding interface is based on the Unity UI, layouts and content size fitter. However, when we remove a bloc from another one (ie: changing its parent), the UI breaks. We corrected it thanks to “ForceRebuildLayoutImmediate” and " ForceUpdateCanvases" but still, when Layouts are nested with 4 or 5 levels, the UI still breaks.

You can see it by yourself in action by playing the game for free here

At this point we don’t have any more ideas and we are starting to think it was a bad idea to use the Unity UI. Any help would be great

Thanks in advance for your ideas!

Thibault

[zyzyx]

Hi,
how do you change the parent in your code? Are you using SetParent?

[tbll]

Yes we are!

[zyzyx]

I see. Can you share a bit more info on how you set up the layout groups and content size fitters? Or (ideally) can you reproduce the behavior in a new project and maybe share it with us so we can have a look at the code? (it is hard to tell just from the screenshots)

[tbll]

You’re right, it’s hard to tell without seeing. The problem is that it would take days to extract this part from the project since everything is dynamic.

I will try to take a small example and show you the structure:
http://www.pistache-app.com/docs/CodeGif.gif

In this example I have 2 blocks attached with each other. The structure of a block is:

Bloc

• BG
• Block specific component and data
• Next Block

---

The important thing is that the “Next” object size and other objects sizes are defined by its children thanks to the ContentSizeFitter component.

Basically, every object have a LayoutElement to have a minimal size, a Layout to order children and a ContentSizeFitter with the 2 parameters set to PreferredSize.

So here is what happen when I remove the block in the Next object:

The refresh at the end happen when I tried to change the position of the object in the scene.

I tried to be more specific I can. Do you now have a nice picture of the situation?

Anyway, thank you very much for your help.

[zyzyx]

Ok, I think I understand your problem.
Basically you don’t want to use ContentSizeFitter in nested LayoutGroups.
I attached a small unitypackage with a setup example for nested VerticalLayoutGroups.

3383446–265705–nestedLayoutTest.unitypackage (6.72 KB)

[tbll]

Thanks, I see your point.

But actually, my main problems are when it comes to loops. I don’t see how I could get this behaviour without ContentSizeFitter.

To create this, the Loop is split in 3 parts and the middle part extends when new child come by using ContentSizeFitter and a Slicing image.

[zyzyx]

Gotcha!
So you only need a ContentSizeFitter on your root GameObject (see attached package and screenshot).
(sorry for butchering your art )

3383589–265725–nestedLayoutLoopTest.unitypackage (108 KB)

[Ghadeer77A]

can you please share how you made the blocks look like scratch?I need it in my project