Scaling UI panels with layout element component

Questions & Answers
1

I want to make an UI panel with dynamic content. Parts of the UI will come and go and the main window should account for the size change.

My main window has a VerticalLayoutGroup and ContentFitter components, and all the children has a LayoutElement component with the PreferredSize set to some values. The idea was to animate the components by slowly changing the Y-scale of the RectTransform from 1 to 0 when the UI elements should disappear and back to reappear. The problem is, the UI elements do scale, but the layout system doesn’t account for that and still allocates the full PreferredSize in the main window.

Is there a way around it?

2

Ok, I found the workaround myself: I re-implemented the VerticalLayoutGroup class. I changed the CalculateLayoutInputVertical method by adding two extra lines:

public override void CalculateLayoutInputVertical () {
    CalcAlongAxis (1, true);
    var scale = GetComponent<RectTransform> ().localScale.y;
    SetLayoutInputForAxis (minHeight, preferredHeight * scale, flexibleHeight, 1);
}

Now the scaling works as I want.