Часто возникает задача сделать подчёркивание ссылок в фигме. Есть несколько вариантов.
Через свойства текста
При выбранном элементе выбираем свойства текста и кликаем на параметр Underline.
Это быстро, но не даёт гибкости. Мы не можем изменить отступ и цвет.
Через линию вручную
Выбираем линию, делаем её полупрозрачной и располагаем под ссылкой.
Вроде бы все, задача решена. Но вдруг от клиента приходят правки поменять 10 ссылок в дизайне. Меняем текст и
И надо у каждой ссылки регулировать длину линии. Чтобы это автоматизировать, нужны Auto Layout.
Магия Auto Layout
Для магии, нужно выделить текст, линию, на каком-то из элементов кликнуть правой кнопкой мыши и выбрать пункт Add Auto Layout. Или просто нажать Shift+A.
После этого нам станет доступна панель Auto Layout.
Нам надо сделать так, чтобы линия тянулась по ширине всего блока, когда увеличивается или уменьшается слово.
Выбрав линию, нужно в блоке Resizing по горизонтали выбрать Fill Container. То есть она будет растягиваться на весь контейнер.
Пишем слово — линия растягивается самостоятельно.