GUI container.adaptWidthToChildren doesn't respect child horizontal padding

When padding is set on a child element, a parent container with adaptWidthToChildren = true doesn’t factor in the child’s padding.

Example PG

Note also the commented out lines where you can workaround the problem by adding negative padding to the parent container, which is counter-intuitive.

I assume the same applies to adaptHeightToChildren but I haven’t tested it.

Adding @Evgeni_Popov to the thread as he knows GUI a lot :slight_smile: or at least a lot more than me :slight_smile:

Let me know if you can not have a look and I ll try to fix it, THX a ton !!!

That would be easy to change the computation and to take into account the padding of the children, but that would be a breaking change and maybe it was intended that way…

It looks to me that the paddings are “inside” the control, meaning within the boundary of the width (for the left/right padding) - they don’t increase the width, in which case the current behaviour (not taking into account the children padding in the width computation) is the right one.

I would prefer waiting for @Deltakosh input about this before going further.

Let s not disturb it in vacation :slight_smile:

We should add the fix in if easy as it feels like a bug ? and I ll let him know when he comes back.

That’s the thing, I’m not sure it is a bug…

From what I can tell, when you set a width + paddingLeft + paddingRight on a control, the width of the control is really “width”, it is not “width+paddingLeft+paddingRight”.

From the GUI doc:

This means that the usableWidth = width - paddingLeft - paddingRight.
Same for usableHeight = height - paddingTop - paddingBottom.

So, when using adaptWidthToChildren, it seems right to me to use width from the children and not width+paddingLeft+paddingRight: width/height define the boundaries of a control.

1 Like

I have changed the PG to remove the rectangle and directly add the text to the GUI texture. I have also highlighted the text so that we can see what is the bounding rectangle of the text:

https://www.babylonjs-playground.com/#GL5SIM#31

If you comment the padding, you will see no change: so, the problem is not that the padding are not factored in the computation when using adaptWidthToChildren = true on the parent container, it is that they are not taken into account in the text control when resizeToFit = true.

Having a look at that.

1 Like

Ok, having looked at the code and performed some testings, I do now think the paddings should be taken into account in the computation :slight_smile:.

PR:

2 Likes

Merged it will be available in the next nightly, thanks a lot @Evgeni_Popov !!!

1 Like

Thanks @sebavan and @Evgeni_Popov. That was a quick turnaround. Love this community! :relaxed: