Skip to main content
Question

Auto layout not growing to accomodate component instance

  • November 17, 2023
  • 4 replies
  • 716 views

Hi,
I have 5 of the same component stacked inside an auto layout, which works fine.

However, when I replace one of these components with one of its instances which is taller, the auto layout does not grow/expand to make room for the instance in the stack. Instead, the content of the instance ends up being overwritten by the component below it.

I have searched for a solution to what must be a common issue but have come up empty handed. Any help is appreciated.

Thank you.

Thank you.

4 replies

Nate_G
  • Power Member
  • 180 replies
  • November 17, 2023

@Doug_Stackhouse This is a similar issue I’ve run into using slots and swapping out instances of different sizes into an auto-layout.

One way I found to fix this is by adding auto-layout to the element, variant, or instance you are going to swap within the main auto-layout.

Below are 2 example files I put together answering similar questions that show the issues and some solutions. Hope this helps!

Swapping elements or slots in auto-layout
Scaling image within auto-layout


Life saver.

Thank you!


MaxZuman
  • 26 replies
  • November 18, 2023

it seems, like two auto-layouts DO talk to each other (or rather Figma properly calculates them during swap procedure), while direct swap of a slot with new item slips past the almighty Calculator and the main autolayout ignores the spatial changes…


Parisa Naderi
Nate_G wrote:

@Doug_Stackhouse This is a similar issue I’ve run into using slots and swapping out instances of different sizes into an auto-layout.

One way I found to fix this is by adding auto-layout to the element, variant, or instance you are going to swap within the main auto-layout.

Below are 2 example files I put together answering similar questions that show the issues and some solutions. Hope this helps!

Swapping elements or slots in auto-layout
Scaling image within auto-layout

 

 

That was easy understanding thanksssss , now i can understand what auto-layout between varient of component is used for :)))


Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings