Search Unity

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

Question Any way to Set a Maximum width for an element?

Discussion in 'UGUI & TextMesh Pro' started by kahshmick, Sep 25, 2023.

  1. kahshmick

    kahshmick

    Joined:
    Dec 27, 2016
    Posts:
    7
    Hello, I'm looking to make my UI flexible for horizontal and vertical monitor layouts specifically, but I can't seem to get the behavior I'm looking for with existing features.

    The problem:
    My UI element is a dial in the bottom of the screen with a fixed aspect ratio (can't stretch the sprite). In Horizontal monitor(16:9) mode it takes up 2/3 of the screen width, and as the resolution width shrinks to a vertical monitor(9:16) I want in to take up a higher percentage of the width until it reaches 100%, then stop.

    The simplest way I can think of it is that I want the element to have a "max width" attribute that keeps it from getting out of bounds. But this doesn't seem to be an option!

    Horizontal Layout:
    upload_2023-9-25_9-36-18.png
    Vertical Layout:
    upload_2023-9-25_9-37-25.png

    What I've tried:
    - Making the panel a Layout Element in a Horizontal Layout Group. I can put in filler elements to simulate a max width, but they still overflow the canvas bounds when squashed to vertical monitor size
    - Using anchors, but this just creates a consistent border with the left and right bounds. I need this border to shrink until it reaches zero.

    Has anyone had this type of problem before? It seems like I could write some custom scripting to make this work like I want, but I'm interested if the UI system supports it as is.
     
    deli-d likes this.
  2. surden

    surden

    Joined:
    Dec 17, 2023
    Posts:
    3
    Same problem here. I've been into Unity development only for a month and I do not stop to wonder how things that should be simple do not have a simple solution.
     
  3. kahshmick

    kahshmick

    Joined:
    Dec 27, 2016
    Posts:
    7
    Can confirm that there isn't a way to do this without custom code. You'd be able to do this with UiToolkit which implements a flexbox css way of showing content, but I solved it with writing my own script to keep it down to size.