Search Unity

Dynamically resize container based on content

Discussion in 'UI Toolkit' started by Marble, Aug 23, 2019.

  1. Marble

    Marble

    Joined:
    Aug 29, 2005
    Posts:
    1,268
    I'm working with the GraphView and am adding some wrapping text content to the Node.extensionContainer visual element. In USS (attached), I can set the node style to a fixed height, which works for a certain amount of content, but I'd like their height to resize based on the text – so it neither cuts off nor exceeds the size of the elements inside it. I'm finding the behavior of my current stylesheet to be inconsistent even across instances of the same visual elements with the same style (image attached). Can anyone help me find the correct properties I should be manipulating?

    The #node id is that of the node.

    The #extension id is that of the GraphView.Node.extensionContainer.

    The #nodeDescription id is that of the wrapping text underneath the node around which I would like the node height to fit.
     

    Attached Files:

    Last edited: Aug 23, 2019
    Marble, Aug 23, 2019
    #1

  2. uDamian

    uDamian

    Unity Technologies

    Joined:
    Dec 11, 2017
    Posts:
    1,231
    I would revert the flex-basis back to auto. You shouldn't need to mess with flex-basis in this case. If the node has a fixed width, the text should just increase the height, given Wrap is enabled. Text will always mess with flex. Or rather, flex thinks text is a divine entity and will do all it can to make it fit, including completely ignoring flex-basis or flex-grow.

    Do also make sure your #extension and/or #nodeDescription have flex-shrink set to 0 (it is set to 1 by default). This will prevent the opposite problem.
     
    uDamian, Aug 26, 2019
    #2

  3. Marble

    Marble

    Joined:
    Aug 29, 2005
    Posts:
    1,268
    Thanks for not only taking the time to advise but to look at my specific case, too. It is appreciated!
     
    Marble, Aug 27, 2019
    #3
    uDamian likes this.