I’m wondering if it’s possible to use a Scroll View and Content Size Fitter, to have an expanding panel based on its content, but when the panel reaches the edges of the screen, the scroll bars kick in?
It’s to handle showing content at different screen resolutions. I don’t want to stretch the panel the screen’s height the whole time, as it will look empty. I’d rather have it as small as possible, but if that is larger than the screen, simply add a scroll bar.
Here’s a solution relying solely on Layouts and LayoutElements, no ContentSizeFitters.
By default, you have a hierarchy like this: Scroll View → Viewport → Content → Elements Let’s start from the bottom. Content gets a VerticalLayoutGroup, not controlling the height. You can now add elements to it as you like, their height will be unchanged.
In order to resize the Content to its children, we add a VerticalLayoutGroup to its parent (the Viewport object), and set it Control Child Height. This will make sure the Content object fits its children.
Now, we’re in a pickle regarding the Viewport object. We want it to grow with its children, but not exceed the screen. The Content, based on its children, reports a MinHeight, and this is the first thing the layout system will try to realize. In this special case however, it’s perfectly fine for the child (Content) to exceed the parent (Viewport), so add a LayoutElement to Viewport and overwrite the MinHeight with 0 (or any other minmum value you’d like to use).
In order to not break the scroll bars with this next step, add LayoutElements to both and set them to ignore layout. Now, to atually resize the Viewport object based on its Content child, add another VerticalLayoutGroup to the Scroll View and set it to Control Child Height.
Now add a screen- / window-sized RectTransform, give it a VerticalLayoutGroup that Controls Child Height, and throw in your ScrollView, and you should be fine.
I solved this using the post by @Brathnannhere. Basically:
The ScrollView ‘Viewport’ should be set to the max size you want it to be.
The ‘Content’ is where the content goes. ‘Content’ should have a ContentSizeFitter and some type of LayoutGroup, e.g. VerticalLayoutGroup. This will allow the content box to expand, but the Viewport will act as a mask.
Scrollbars will hide automatically depending on the setting on the ScrollView.
This is possible by working out how big the content will be and altering the scroll view and the scroll view content RectTransform. The scroll view allows for the ability to turn the scroll bar on or off is the content RectTransform is smaller than the scroll view window.
Maybe late…
But I handlet it with a content size fitter on the viewport.
Just check the viewport rect with the maxvalues u want and
Disable its fitter if it reaches max.
Thanks for @Daerst for his insights above (his is truly the best answer). I want the panel to also be centered in the middle of the screen and expand vertically so I took what he wrote and figured out how to do it and have detailed it in my document titled
[173493-centerexpandingpanel.pdf|173493]
