4

I need to change the expanding direction of the VerticalLayoutGroup. With the default behavior the group will expand downstairs. What i want is, that the group will expand upstairs.

The expected behavior is described in this Video. (Link to the answer on stackoverflow https://stackoverflow.com/a/43192904/11236801)

The solution on the link is, to rotate the LayoutGroup about 180°. Now this seems more like a workaround, because all childs have to be rotated as well. The solution suggested by this one will not give the expected behavior shown in the video.

I added the ContentSizeFitter to the LayoutGroup like described in this link in the Unity Answers. Now the LayoutGroup will expand in both directions (upstairs and downstairs).

Is there any solution to accomplish the desired behavior without rotating the LayoutGroup?

Edit: I also noticed a downside from the rotating approach: The Billboard Script from the MixedRealityToolkit will force the LayoutGroup to rotate back to 0°.

andiikaa
  • 43
  • 1
  • 5

2 Answers2

13

This works for me:

Unity Inspector screenshot

Note the Child Alignment setting on the Vertical Layout Group, and the Pivot settings on the Rect Transform. This makes the layout group expand upwards when more items are added.
Also note the presence of a Content Size Fitter component, and its Vertical Fit set to Preferred Size, that will adjust the height of the layout group when content is added or removed.

frankhermes
  • 4,720
  • 1
  • 22
  • 39
  • 3
    This didn't work for me until I added the content size fitter component, and set the Vertical Fit to "Preferred Size". – Max Izrin Dec 24 '19 at 10:43
  • 2
    @MaxIzrin check the image! The Content Size Fitter component is there, exactly as you describe ;) But I will clarify my answer with this in mind – frankhermes Feb 18 '20 at 15:27
  • @frankhermes Sorry I wasn't clear, I meant I had to add it to the objects inside the layout as well, though Unity warns against this, it just doesn't seem to work without it. – Max Izrin Feb 19 '20 at 23:57
0

Old question but the accepted answer makes it more complicated than necessary: the desired direction of expansion can be controlled via the sign of Spacing in the VerticalLayoutGroup.

See this GIF

Schnabeltier1991
  • 1
  • 1
  • An example would be nice here. – boj Oct 10 '22 at 11:06
  • 1
    I don't think you're right. You can see in the screenshot in the answer that it has a negative spacing. That only makes items in the layout overlap each other, and doesn't change the way the layout resizes itself, afaik. – frankhermes Oct 29 '22 at 11:11
  • Hi, @frankhermes, I added a GIF to my answer. If you make the `Spacing` small enough, your elements will overlap, that is right. However, changing the sign of `Spacing` will simply align them in the given distance into the other direction. – Schnabeltier1991 Nov 08 '22 at 16:16
  • 1
    Altough this could be the easiest workaround in several use cases. It's required at least, elements with same height. If not, these elements will overlap each other, which is why we use vertical layout group in first place. – SwingingTom Apr 06 '23 at 13:48