← Назад в «Блог»
3 639

Автоматическое подчёркивание ссылок в Фигме

Часто возникает задача сделать подчёркивание ссылок в фигме. Есть несколько вариантов.

Автоматическое подчёркивание ссылок в Фигме 1

Через свойства текста

При выбранном элементе выбираем свойства текста и кликаем на параметр Underline.

Это быстро, но не даёт гибкости. Мы не можем изменить отступ и цвет.

Через линию вручную

Выбираем линию, делаем её полупрозрачной и располагаем под ссылкой.

Автоматическое подчёркивание ссылок в Фигме 2

Вроде бы все, задача решена. Но вдруг от клиента приходят правки поменять 10 ссылок в дизайне. Меняем текст и

Автоматическое подчёркивание ссылок в Фигме 3

И надо у каждой ссылки регулировать длину линии. Чтобы это автоматизировать, нужны Auto Layout.

Магия Auto Layout

Для магии, нужно выделить текст, линию, на каком-то из элементов кликнуть правой кнопкой мыши и выбрать пункт Add Auto Layout. Или просто нажать Shift+A.

Автоматическое подчёркивание ссылок в Фигме 4

После этого нам станет доступна панель Auto Layout.

Автоматическое подчёркивание ссылок в Фигме 5

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

Автоматическое подчёркивание ссылок в Фигме 6

Выбрав линию, нужно в блоке Resizing по горизонтали выбрать Fill Container. То есть она будет растягиваться на весь контейнер.

Автоматическое подчёркивание ссылок в Фигме 7

Пишем слово — линия растягивается самостоятельно.

Полезно
9
1
Непонятно
2
Поделиться
Отправить
Линкануть
Вотсапнуть

Подпишись на крутой канал о фрилансе

Я делюсь там фишками о фрилансе: деньги, клиенты, автоматизация, фриланс. Раньше это был закрытый материал с платным доступом. Сейчас он открыт. Иногда подписчикам будет открываться платные материалы. Подписаться

← Назад в «Блог»

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *