Skip to main content
Ruben8
Ruben8
New Member
June 5, 2024
Solved

Auto lay out alignment in combination with properties

  • June 5, 2024
  • 2 replies
  • 289 views

I am designing a product card and encountering an issue. I want to make the card responsive using auto layout. So far, everything is going well. However, I have also added two properties, namely a label with the text ‘New’ and a wishlist icon. But when I disable one of these two properties, the other label shifts. I have the auto layout set to ‘Gap set to auto’. Does anyone have an idea? See enclosed images.

WithLabel-New

This topic has been closed for replies.
Best answer by MarieSilj

I dont know if this is a solution to you problem, but I’ll give it a try; Instead of hiding the object, try setting the opacity to 0%. Then everything should stay in place.

It might be better ways to do this, as I feel my solution maybe is a ‘quickfix’ rather than a permanent solution. Making a component with two variants (one with both properties, and one with only one) might be more scalable.

Hope this can help!

2 replies

MarieSilj
MarieSiljAnswer
New Participant
June 5, 2024

I dont know if this is a solution to you problem, but I’ll give it a try; Instead of hiding the object, try setting the opacity to 0%. Then everything should stay in place.

It might be better ways to do this, as I feel my solution maybe is a ‘quickfix’ rather than a permanent solution. Making a component with two variants (one with both properties, and one with only one) might be more scalable.

Hope this can help!

    mint
    June 5, 2024

    Set those layers to “Fill” for their width.

    Ideally we need to tell us the expected behaviour for when you hide each layer.

      Terms & ConditionsAccessibility statement