fbpx
Рисуем идеальную пунктирную линию в Sketch

Рисуем идеальную пунктирную линию в Sketch

Это руководство не работает после обновления Sketch на версию 3.4.

Смотрите новый способ создания пунктирной линии:

Рисуем идеальную пунктирную линию в Sketch, небольшой лайфхак

Я люблю Sketch. Он быстро стал моим любимчиком среди инструментов для UI-дизайна, но и он не идеален. Например, мне нужно было создать пунктирную линию, и это оказалось куда хуже, чем должно быть. Но после небольших экспериментов с настройками я нашел способ создания идеального пунктира.
Рисуем идеальную пунктирную линию в Sketch

  1. Нарисуйте линию.
  2. Задайте ей границу, толщина может быть любая.
  3. Откройте настройки границы под иконкой шестеренки.
  4. А теперь начинается самое интересное. Чтобы создать идеальную точечную линию, укажите значение штриха 0.01 и выделите закругленные края. Задайте значение промежутка между штрихами больше, чем толщина границ.
  5. Вуаля. Вот и идеальная точечная линия.

Вот и идеальная точечная линия

Вы можете поэкспериментировать со значением интервала, чтобы получился правильный интервал между точками. Например, если у меня толщина границ 5 пикселей, при 10-пиксельном интервале расстояние между точками будет 5 пикселей.

Важный момент – пунктир всегда должен быть задан 0.01 с закругленными концами. Если вы откроете диалог настроек, то пунктир будет задан 0. Нужно задать значение 0.01, если будете менять другие параметры.

Также можно применять пунктирные линии к фигурам. Единственная разница в том, что границу надо располагать по центру. Иначе Sketch очень забавным образом соединит кружочки по контуру.

можно применять пунктирные линии к фигурам
Граница, выровненная по центру, по внутреннему краю, по внешнему краю фигуры.

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

В новой версии Sketch задать значение 0.01 нет возможности. Работает только в старых версиях!

3 Комментариев
Старые
Новые Популярные
Межтекстовые Отзывы
Посмотреть все комментарии
Похожие статьи
Замена изображения
Подробнее

Быстрая замена изображения в Sketch

Недавно состоялся релиз Sketch 3.1, и одна из новых функций особенно нас порадовала. Она называется ‘Replace Image’ – замена изображения. В качестве примера, я собираюсь заменить изображение аватара в дизайне приложения.
9 советов как стать профи в Sketch
Подробнее

9 советов как стать профи в Sketch

Совсем недавно, Sketch стал для нас повседневным приложением для создания крутых дизайн проектов. Sketch быстрый, гибкий, ориентированный на UI инструмент. В нем содержится несколько секретных опций. Я хочу познакомить вас с моими любимыми.
Руководство дизайнера по DPI и PPI
Подробнее

Руководство дизайнера по DPI и PPI

Этот лонг-рид создан для продвинутых дизайнеров, которые хотят узнать больше о кросс DPI и кросс-платформенном дизайне с самых азов. Никакой сложной математики и нечитаемых графиков, только простые объяснения, разбитые на короткие разделы для лучшего понимания и быстрого применения в вашем дизайн-процессе.

Лучшие статьи, раз в неделю, с доставкой на почту

Total
0
Share