Figma выкатила новый подход в Auto Layout

Figma выкатила новый подход в Auto Layout! Большое количество изменений в построении адаптивных компонентов и макетов.

Figma выкатила новый подход в Auto Layout

Файл с примерами: тут (локализованный файл тут)

Мануал: тут

Поле с Auto Layout теперь выглядит так:

Figma выкатила новый подход в Auto Layout

Основной упор был на том, чтобы настраивать разное поведение вложенных компонентов, а так же разные отступы в компонентах, сделать их можно с помощью новых настроек:

Figma выкатила новый подход в Auto Layout

На скрине ниже видно, что отступы настроены по-разному, и это позволяет нам избежать костыльных методов настройки Auto Layout с пустыми фреймами для доп отступов. Теперь это гибко настраивается за пару кликов.

Figma выкатила новый подход в Auto Layout

По мере использования в реальных проектах, буду обновлять и дополнять статью.

2020
20 комментариев

Да, я этого ждал с момента появления самого инструмента. Очень круто, что у них дошли руки до реализации.

5

Согласен, это позволит очень легко настраивать решения при адаптации, да и вообще в целом работу с макетами.

1

Такс, а margin collapsing так и не подвезли, я правильно понимаю?

1

А поподробнее что имеете в виду? Если отступы друг от друга, то это решается оборачиванием всех элементов в один Auto Layout. Приведите кейс который хочется решить.

А что, выглядит неплохо)

1

Это что-то типа auto layout в xcode interface builder?

да, что-то похожее.