- Home /
how to create scrolling list of prefabs of different height
Unity 5 (New GUI)
I have a simple canvas > scrollrect > content container (vertical layout group with vert. fit = preferred size).
My content items are from prefab that is just a panel containing 2 text elements placed horizontally. Text element 1 holds a phrase number and text element 2 holds corresponding phrase. The phrases can be long and often cover multiple lines so the text 2 element is set for horizontal overflow = wrap.
I instantiate and attach my prefab objects in the SceneManager.OnSceneLoaded event of a game controller object script.
Everything seems to work fine except the sizing of the prefab height. I want the height to be calculated based on the text content (which will be anywhere from 1 to maybe 5 lines depending on the phrase length). So working properly I would get a vertical list of different height panels holding the phrase text. However, what I am getting is uniform height for all instantiated prefabs. I have tried about every combination of layout modification I can think of including adding "Content Size Fitters" at some or all the levels and also adding Layout Elements to see if overriding the auto layout on an element would fix it. I get some variation in the output but never close to what I want.
For the new GUI guru's out there, how should I go about accomplishing this. This seems like a common use case so I would assume the tool can handle it and I am just doing something wrong.
I threw a script on the Text object and added some code to see what the preferred height is at run time. I output that value to the screen using the update method. Turns out the preferred height is set correctly and varies by phrase length. So it seems something in one of the parent objects is overriding this and forcing all items to same height. As mentioned above my content container is a vertical layout group but it does NOT control or expand it's children. It's just there to align items vertically.
Answer by rss181919 · Mar 16, 2017 at 09:12 AM
I found a few threads that led me to an answer.
My scrollrect was simply a panel with an image, a mask, and a scrollrect set to vertical scroll. My item container was a panel with vertical layout group with no child expansion or control. I also added a content size fitter with vertical constraint set to preferred height.
My item was a horizontal layout group with no child expansion or control. It also has a content size fitter with height constraint set to preferred height.
I had 2 text elements inside the horizontal layout group item panel. To each I added a content size fitter with height constraint set to preferred height.
All of this got me the correct height text boxes, horizontal text box container that matched the text height and an item container that matched the sum total height of its items. However, even though the item container was the correct height and the items were the correct height, the items did not reposition so that they all fit within the content container. The items overflowed the item container vertically. Turns out that after adding my prefab items in my script to the item container, I had to force a recalculation of the item container so it would reposition the items correctly. I used this code to force the recalc:
`LayoutRebuilder.ForceRebuildLayoutImmediate (MyContentContainer.GetComponent<RectTransform> ());`
Your answer
Follow this Question
Related Questions
Inserting text into GUILayout Box? 3 Answers
Change gui box height based on text content? 1 Answer
ArgumentException: control 1s position in group with only 1 control 0 Answers
GUILayout.MinHeight and EditorGUILayout.BeginScrollView not respecting layout options. 1 Answer
Having trouble making Level Complete text, GUI appear 0 Answers