Correct size of the scripted buttons for different aspect ratios

Unity Engine
1

Hello everyone!
I want to adjust my field of buttons(4x4) to different aspect ratios per script. If I create the buttons manually and set the canvas as parent, everything looks correct, but not if I create it via script.

My Startfunction looks like this:

        buttonSize = (Screen.width * buttonSizeStandard) / 1080;
        buttonOffset = (Screen.width * buttonOffsetStandard) / 1080;

And the function to initialize my 4x4 field looks like this:

var borderCanX = (this.gameObject.GetComponent<RectTransform>().sizeDelta.x - ((buttonSize * 4) + (buttonOffset * 3))) / 2;
        var borderCanY = (this.gameObject.GetComponent<RectTransform>().sizeDelta.y - ((buttonSize * 4) + (buttonOffset * 3))) / 2;
        var offset = new Vector3((this.gameObject.GetComponent<RectTransform>().sizeDelta.x / 2) - (fieldButton.GetComponent<RectTransform>().sizeDelta.x / 2) - borderCanX, this.gameObject.GetComponent<RectTransform>().sizeDelta.y / 2 - (fieldButton.GetComponent<RectTransform>().sizeDelta.y / 2) - borderCanY);
        for (int x = 0; x < 4; x++)
        {
            for (int y = 0; y < 4; y++)
            {

                var btn = Instantiate(fieldButton, new Vector3(0, 0, 0), Quaternion.identity);
                btn.transform.SetParent(this.gameObject.transform);
                btn.GetComponent<RectTransform>().anchoredPosition = new Vector3((x * (buttonSize + buttonOffset)) - offset.x, (y * (buttonSize + buttonOffset)) - offset.y);
                btn.GetComponent<RectTransform>().sizeDelta = new Vector2(buttonSize, buttonSize);
            }
        }

My Canvas has this settings:

495Ă—853 52.2 KB

It would be great if somebody could help me!
Best wishes!

2

I suspect you’re having problems because of the reparenting. SetParent has a second parameter “world position stays” that defaults to true. After the reparenting, you are overwriting the position and sizedelta, so it doesn’t matter what they were set to during reparenting…but you are NOT overwriting the object’s scale. And since you have a Canvas Scaler on your Canvas, your Canvas probably has a scale that is something other than 1. SetParent is automatically changing your button’s local scale to the inverse of it’s new parent’s global scale to keep it at the same apparent size.

Try passing “false” as a second parameter on SetParent, or use a different overload of Instantiate that lets you specify the parent immediately as part of the instantiation process.

Also, you should consider if you can maybe bypass this entire re-scaling process by somehow modifying your Canvas Scaler. (I’m assuming you have a bunch of other stuff in your game that is already scaling the way you want it to scale, so probably not, but…just make sure the Canvas Scaler is set the way you want it set, so you don’t have to go back and change things later.)

1 Like
3

Hey, I’m sorry for the late reply. I have now added the second parameter and it works fine!

Yes, I have now done so too, so that I will have fewer problems with it later on. Thank you very much!