Search Unity

Question UI Elements not scaling correctly on build, even with anchors in place.

Discussion in 'UGUI & TextMesh Pro' started by crjase, Sep 28, 2022.

  1. crjase

    crjase

    Joined:
    Feb 13, 2022
    Posts:
    6
    I've setup a small UI Menu with elements and what-not. The elements placed in the editor are misplaced when I build the project and I've tried different anchors, from the corner anchor to stretch anchors. I've looked through tons of forums, yet to find no solution.

    upload_2022-9-28_16-37-49.png
    upload_2022-9-28_16-38-2.png
    upload_2022-9-28_16-38-12.png

    Above are the three button elements.
    - The top button is anchored to the top left, the same for its pivot.
    - The middle button is anchored to the middle, the same for its pivot.
    - The bottom button is anchored to stretch to all sides, the pivot is set to the middle.

    I've tried everything I could think of with anchoring and all that, it still gave the same result.
    All of the elements were out of place when built, as shown in the image below.
    upload_2022-9-28_16-43-59.png

    The canvas scaler is set to constant pixel size, as "scale with screen size" uses a fixed reference resolution and that doesn't go well when I'm trying to make the resolution dynamic.

    [https://imgur.com/a/T8Nc2U7] - Canvas Properties


    - Thanks in advanced
     

    Attached Files:

    Deleted User likes this.
  2. crjase

    crjase

    Joined:
    Feb 13, 2022
    Posts:
    6
    The attatched upload at the bottom is the anchor point for the bottom button element on the UI.
     
  3. MelvMay

    MelvMay

    Unity Technologies

    Joined:
    May 24, 2013
    Posts:
    11,467
    Here's the dedicated UI forum for this stuff. I'll move your post for you.
     
    crjase likes this.
  4. crjase

    crjase

    Joined:
    Feb 13, 2022
    Posts:
    6
    Thank you
     
  5. crjase

    crjase

    Joined:
    Feb 13, 2022
    Posts:
    6
    It was a long process, but this is solved. I can't not give credit, so here it is: @Nero, borderline games, discord.

    The problem was multiple things and lot of them at that:
    1. I was not using "scale with screen" on canvas because I thought the "reference resolution" was static, but it was just as it said, a "reference".
    2. Match, on canvas should of been 0.5 to balance it out, it was set to zero before.
    3. I was using EmptyObjects as containers for my ui elements, I should of used Panels instead, Panels are like divs in html if you know web development.
    4. My elements were scaled wrong ( IN TWO WAYS! ). It's hard to explain this one.
    5. Overall, my ui was not what you'd call "responsive", so it didn't even scale with the screen.
    PS: I hate the number 5 for an unknown reason. I JUST HATE IT.


    I hope this helped even one person with the same problem(s) as me. Crjase OUT-
     
    Deleted User likes this.
  6. kove2727

    kove2727

    Joined:
    Jun 29, 2022
    Posts:
    2
    Hi my circle ui changed to oval how to keep that in 1:1 ratio I mean how to keep that ui Always in square format