Question by Blaze5565 · Feb 18, 2019 at 04:40 PM · ui scaling recttransform worldspace screenspace

Aligning UI Elements in Code

Hi,

So, I'm trying to create a menu with a variable number of buttons that display one below the other. To be more specific, I want the lower edge of each button to touch the upper edge of the next one. Due to scaling in the canvas and on the RectTransform for the button (and maybe other places?), I've been having difficulty actually making them align. My current (not working) code is:

 for(int i = 0; i < numberOfButtons; i++)  {
     Vector3 newPos = mainCamera.WorldToScreenPoint(basePosition.position);
     newPos.y -= i * buttonPrefab.GetComponent<RectTransform>().rect.height * 
         GetComponent<CanvasScaler>().scaleFactor;
     newPos = mainCamera.ScreenToWorldPoint(newPos);
     Instantiate(buttonPrefab, newPos, Quaternion.identity, transform)
 }

And, for reference, base position is simply an empty RectTransform that's a child of the canvas, and is positioned in the top-left corner. My button prefab's pivot is also in its top left corner. This script is on the canvas object.

Any help would be much appreciated.

Add comment