Хотите быстрее научиться создавать сайты? Рекомендую эти видеокурсы!

х
Наверх

Ограничители в Figma

Ограничители в Фигме – это настройки слоев проекта, отвечающие за то, как они будут вести себя при изменении размеров фрейма – липнуть к краю, менять свои позиции, или растягиваться по ширине. Такая функция доступна только в том случае, если созданный объект находится во фрейме.

Например, у нас есть фрейм с 5 прямоугольниками по углам и в центре. Каждый объект можно закрепить за определенны углом. Для этого в правой панели инструментов есть прямоугольник, который показывает какую позицию занимает объект относительно фрейма. Если выделить прямоугольник, который находится в левом верхнем углу, то в панели инструментов необходимо кликнуть на схему в виде квадрата, и выставить такое же позиционирование.    

закрепление объекта за углом фрейма То же самое касается и остальных углов.

выбор позиции объкта относительно фрейма в FigmaТаким образом, меняя размер фрейма – уменьшая или растягивая, все объекты будут находиться на своих местах. Если это, например, левый нижний угол, то объект там и останется.

позиция объектов при смене размеров фрейма в FigmaОднако закреплять объекты можно не только в определенных углах, соответствующих их расположению. Например, можно закрепить все объекты за одним углом. Если выбрать левый верхний угол ко всем прямоугольникам, то при изменении фрейма все объекты сохранят позиционирование относительно этого угла.

сохранение позиционирования объектов при растягивании фрейма в FigmaКроме того, вы можете выставить позиционирование по центру фрейма. Для этого в панели управления «Constraints» необходимо выставить отметки по центру в виде плюса. Тогда при изменении фрейма объект всегда будет находится по центру.

позиционирование объекта по центру фрейма в FigmaЕще одна функция ограничителя – позиционирование по левой и правой стороне. Для того чтобы использовать эти отметки в разделе «Constraints» поставьте при помощи клавиши «Shift» отметку слева и справа квадрата. Эта функция позволит вам сохранять то расстояние, которое составляет от объекта до края фрейма. Таким образом вам будет доступно масштабирование объектов при изменении размеров фрейма.    

масштабирование объекта по центру относительно фрейма в FigmaЧем полезна эта функция? С ее помощью вы сможете создавать адаптивный дизайн для своего сайта. Благодаря ей, посетители сайта могут видеть содержимое на своем устройстве с любым разрешением. Используя логотип на своем сайте, может быть необходимость чтобы его расположение было всегда точно по центру. Ограничители сразу решают проблему с отображением таких объектов как шапки, фоновые изображения, сайдбары, меню на разных устройствах, без необходимости создания отдельного дизайна под разные версии.

Полезные ссылки:


Дата размещения/обновления информации: 13.01.2021 г.
Сообщить об ошибке
Пройдите, пожалуйста, защиту от спама.