CODEWITHSUNDEEP
unity-game-engineuser-interface
travlake
travlake

Reputation: 51

Scaling UI element with content up to a maximum (Unity)

I have a Panel containing a TextMeshPro (TMP) object and a few other (buttons for example) aligned vertically. I want the following behavior:

  1. Panel size expands vertically as more text is added to the TMP or more elements are added (e.g. buttons and sub-images).

  2. As more text is added to the TMP, we stop expanding the size of the Panel and instead use overflow (ellipses or whatever).

So it should look like this when the text is long, and this when the text is short.

My current setup has Vertical Layout Group and Content Size Fitter components in the Panel object.

The Vertical Layout Group has "Control Child Size" ticked but not "Use Child Scale" or "Force Child Expand".

The Content Size Fitter has "Preferred Size" for vertical fit.

The TMP object has a Layout Element component. If I set this component to a specific preferred size it gets fixed at that size and so handles overflow well but when the text content is short there is tons of extra space.

If I uncheck preferred size from the TMP, the TMP object shrinks to fit small amounts of text snugly (as I want). However, when I add lots of text it keeps growing without a cap, eventually taking over the entire screen and more.

Is there any way to achieve my desired behavior by tweaking the settings of the Layout Element/Content Size Fitter/Vertical Layout Group? Or do I have to write a new component that turns on preferred size to cap the height when text reaches a certain length?

Thanks!

Upvotes: 3

Views: 4705

Answers (1)

travlake
travlake

Reputation: 51

The best solution I found is to add a new component to the parent object with the Content Size Fitter that enforces the maximum.

The new component needs to implement the interface ILayoutSelfController and implement the methods SetLayoutHorizontal and SetLayoutVertical. In these methods, check if the current X and Y dimensions are larger than Serialized maxes you set in the inspector.

The full solution, from a Unity user called Democide (aka Democritus) is available here https://forum.unity.com/threads/rect-transform-size-limiter.620860/#post-7020001

Upvotes: 1

Related Questions