Layout Group not working when instantiate from prefab

Questions & Answers
,
1

When I instantiate a UI prefab, the horizontal layout group in my UI does not seems to work. However, it only works with either of the followings:

  1. When I enable Pixel Perfect in canvas
  2. When I remove the layout group component and hardcoded the UI position & size
  3. When it’s not instantiated from prefab (meaning the UI stays in runtime, but disabled.)

Here’s the setup I have:

151030-screenshot-2020-01-09-at-100645-pm.png
151030-screenshot-2020-01-09-at-100645-pm.png1086×360 51.7 KB

Did I miss out something?

2

Try this. This is how I always work with Layout Groups.

On the layout group component check the two boxes for child controls size. Then on every child add a LayoutElement component. This is so each one of them controls its own width and height. If the children disappear after adding the LayoutElement component it’s because you need to at least set something not to 0 in their width and height configurations. Try Flexible Width and Height set to 1 for every child so they will all take the same amount of available free space, or you could just set a minimum W/H too.

Also, for the always necessary sanity check, make sure that the Horizontal Layout Group is actually enabled when you make an instance of it.