Автолэйауты

Автолэйаут — это инструмент для автоматического выравнивания и распределения элементов внутри контейнера. Он помогает создавать адаптивные макеты быстрее и поддерживать аккуратную структуру страницы без ручной настройки отступов.

С помощью автолэйаута элементы автоматически:

• выстраиваются по вертикали или горизонтали
• сохраняют заданные отступы между собой
• корректно реагируют на изменение размера контейнера
• упрощают адаптацию под разные экраны

---

Как включить автолэйаут

Включить автолэйаут можно двумя способами.

Способ 1. С помощью горячей клавиши

1. Выделите контейнер или несколько элементов на холсте.

2. Нажмите Shift + A.

После этого выбранные элементы будут объединены в автолэйаут-контейнер.

Способ 2. Через панель настроек

1. Выделите контейнер или элементы на холсте.

2. В правой панели откройте раздел Автолэйаут.

3. Нажмите кнопку +.

Автолэйаут будет применён к выбранным элементам.

Подсказка

Если выделить несколько элементов и включить автолэйаут, они автоматически будут выстроены в контейнер с одинаковыми отступами между элементами.

Направление автолэйаута

Автолэйаут определяет, как элементы располагаются внутри контейнера.
В Flexbe доступны три режима расположения элементов.

Вертикальный

Элементы располагаются друг под другом.

Этот режим подходит для:

• текстовых блоков

• карточек

• списков

• форм

При добавлении нового элемента он автоматически появится ниже предыдущего.

Горизонтальный

Элементы располагаются в одну строку слева направо.

Этот режим удобно использовать для:

• кнопок

• навигационных меню

• иконок

• карточек в ряд

Новые элементы будут добавляться справа от предыдущего элемента.

С переносом (Wrap)

Элементы располагаются в строку, но если внутри контейнера не хватает места, они автоматически переносятся на следующую строку.

Этот режим подходит для:

• галерей

• карточек товаров

• списков тегов

• сеток элементов

Такой автолэйаут позволяет создавать гибкие макеты, которые автоматически подстраиваются под ширину контейнера.

Совет

Используйте автолэйаут с переносом, если элементы должны автоматически перестраиваться при изменении ширины блока или на разных устройствах.

Расстояние между элементами

Расстояние между элементами задаётся параметром интервал (gap).

Это позволяет:

• быстро изменять расстояние между элементами

• поддерживать одинаковые отступы

• упрощать редактирование макета

Измените значение интервала в настройках автолэйаута, чтобы увеличить или уменьшить расстояние между элементами.