Restrict Content Size Fitter to screen height, enable scroll bars when larger

Heya!

I posted this on Answers as well, but sometimes get a better response on the forums.

Basically I want to have a panel expand to fit its vertically stacked content, until it gets as tall as the screen. When this happens, I want it to have a scroll bar. But I can't work out the combination of UI classes to add to achieve this. I don't want it to be 100% height always, that should just be the maximum.

Any help is appreciated!

 

Scroll views come with three parts. The parent with a scroll rect, a viewport, and a content. Your viewport should be set to the size you want it to be max, your content is where your objects go under. Your content should have a content size fitter and some type of layout group (I use grid, but there are others depending on your needs). This will allow the content box to expand, but the viewport only lets you see what is visible based on its size.

The scroll rect on the parent has an auto hide option which will hide your scroll bar unless it's needed.

 

Hey, you're spot on! That's great! One thing I can't seem to work out is how to stretch, but with padding. So have it fill it's parent, but with 10px around the inside. Surely I'm missing an additional component?

 

What part do you want to stretch? If you're using grid(the other layout groups should have this also) there should be a padding setting. You just have to click the little arrow to expand it. It can be easy to miss, I know I did at first.

 

Hmm no I mean the container. So I want it to extend to the screen's edges, but sit 10 pixels within, rather than right on the edge.