Proportional auto-layout, possible?

[romuald]

Hi there,
I would like to know if there is a way to specify proportions to auto-layout? For example, take a horizontal auto-layout, and specify the left part should take 70% of the width, and keep the remaining 30% for the right part.

Thanks.

[Antoine]

To my knowledge, no, and that would be a great feature.

Some exceptions:

• Equal parts layout (50-50, 25-25-25-25, and so on): using “Fill container”, you can have content grow to use space in equal parts (if you have two elements, they’ll each take half of the container, 3 will take a third, etc)
• Column layout: without using auto layout, you can use the columns and constraints to have content resize according to columns. But as a “normal frame”, this is limited to one dimension. This was discussed here.

There might be some other ways to achieve this but not that I’m currently aware of.

[Agni_Kaster]

I just had a similar need an hour ago. I have a hybrid solution: I have a large container with two containers inside and I wanted to make them 30%-70% width. I set one inner container to be ‘fill container’ and had to calculate a fixed width on the other (eg: 30% of the parent width). Figma will do percentages on the existing width. So, I selected the smaller inner container, set to be the width of the parent container (eg: 1000), and then selected the width again and typed ‘30%’ in place of the ‘1000’. Figma will do the math for ya. When you resize the parent, unfortunately, you’ll need to adjust the width of that one container with fixed width, but the other will be elastic.
Although, it would be rad if we could set an actual percentage like in flexbox.

[Klesus]

Do they need to be wrapped in a single frame? Otherwise I’d just use two frames that takes up 30% and 70% respectively, wrap them in a frame and have them use fixed size and constrain to scale.

[romuald]

That’s interesting. It works, but you lose auto-layout, or did I miss something?

[Klesus]

The 30%, 70% frames can still utilize autolayout.
It’s always easier to create something when you know what it is you’re creating, and since I’m not 100% sure what it is you’re trying to do it might be I who has missed something