Search Unity

  1. Unity support for visionOS is now available. Learn more in our blog post.
    Dismiss Notice

Question How to Scale Buttons along with Panel?

Discussion in 'UGUI & TextMesh Pro' started by anilsayar, Aug 22, 2023.

  1. anilsayar

    anilsayar

    Joined:
    Oct 14, 2018
    Posts:
    14
    Hello,

    I would like to place four buttons on a panel object and scale the buttons in different resolutions, if necessary. For this reason, I added four buttons under Panel object at Hierarchy (see image 1) and then added panel object Aspect Ratio Fitter and Grid Layout Group components (see image 2). I set my Canvas Scaler to Scale with Screen Size at 1366 x 768. So, everything looks well in the 3rd image. However, when I change the resolutions, button corners don't align properly (see image 4). I cannot add buttons Aspect Ratio Fitter component, because Grid Layout Group at panel object overrides on it. Are there any solutions for this?

    Thanks

    Image 1:
    Ekran görüntüsü 2023-08-22 122716.png
    Image 2:
    Ekran görüntüsü 2023-08-22 122812.png
    Image 3:
    Ekran görüntüsü 2023-08-22 122332.png
    Image 4:
    Ekran görüntüsü 2023-08-22 122350.png
     
  2. irene_reko

    irene_reko

    Joined:
    Feb 14, 2019
    Posts:
    12
    The GridLayout only supports fixed cell sizes. But Horizontal and Vertical Layout Groups support children with adaptable sizes.
    The hierarchy like this should work:
    - Horizontal Layout Group
    - Vertical Layout Group
    - Button 1
    - Button 2
    - Vertical Layout Group
    - Button 3
    - Button 4

    I would enable "Control Size Child" and "Child Force Expand" on the horizontal layout and only "Child Force Expand" on the vertical layout. But depending on what you want to achieve, another configuration might work as well.