Как нарисовать линию в зеро блоке
Tilda Publishing
| РЕГИСТРАЦИЯ |

21 ФЕвраля 2023
Vector — новый элемент в Zero Block (beta)
Теперь вы можете создавать и редактировать векторные элементы в Zero Block. Новый векторный редактор позволяет создавать шейпы любой формы и базовые иллюстрации для сайта, а также дорабатывать импортированные svg-объекты.
Четыре режима работы векторного редактора
В этом режиме вы рисуете элемент. Можно рисовать прямыми и изогнутыми линиями. Если вы хотите нарисовать незамкнутую фигуру, по окончанию нажмите esc или кликните дважды на последней точке. Если замкнуть фигуру, вы автоматически закончите рисование. После завершения вы перейдете в режим Select.
Векторный редактор в Zero Block
Теперь вы можете создавать и редактировать векторные элементы в Zero Block. Новый векторный редактор Тильды позволяет создавать шейпы любой формы и базовые иллюстрации для сайта, а также дорабатывать импортированные svg-объекты.
Четыре режима работы векторного редактора
В этом режиме вы рисуете элемент. Можно рисовать прямыми и изогнутыми линиями. Если вы хотите нарисовать незамкнутую фигуру, по окончанию нажмите esc или кликните дважды на последней точке. Если замкнуть фигуру, вы автоматически закончите рисование. После завершения вы перейдете в режим Select.
Select Tool позволяет выбирать, перетаскивать, масштабировать и вращать отдельные созданные шейпы, а также менять их настройки — заливку и цвет и ширину обводки. Больше действий доступно в контекстном меню по клику правой кнопкой мыши.
Чтобы работать с композицией на артборде было удобно, создавайте отдельный элемент для каждого шейпа или иллюстрации. Если у вас сложная иллюстрация или много небольших шейпов, которые связаны воедино, над композицией лучше работать внутри векторного редактора.
3. Edit (E или двойной клик мыши по элементу)
В этом режиме вы можете править нарисованный элемент — по точкам, отрезкам и кривым Безье. Двойной клик на точку скруглит или заострит элемент, а правая кнопка мыши откроет дополнительное контекстное меню. Также в этом режиме можно менять цвета и толщину линий по аналогии с режимом Select.
Режим позволяет сгибать существующие линии и работать с точками. В этом режиме вы можете работать только с оболочкой фигуры, оформление задается в режиме Select и Edit.
Как импортировать SVG-файл
Нажмите на артборд правой кнопкой мыши и в контекстном меню выберите Импорт SVG. Для корректной работы рекомендуется загружать файл весом до 20 кб.
Перенос градиентов и масок будет доступен в следующих обновлениях инструмента.
Чем полезен векторный редактор
Векторный редактор будет полезен, если вам нужны шейпы необычной формы, свободные иконки или небольшие рисованные элементы, например, подчеркивания или стрелки и так далее. Также будет удобнее дорабатывать импортированный svg-элемент прямо в Тильде.
Теперь давайте посмотрим на векторный редактор в действии
Как добавить направляющие линии в Zero Block?
В режиме редактирования Zero Block нажмите справа вверху на «. » (три точки) — откроется панель меню. Для добавления направляющих нажмите на Guides: Hide/Show:
Чтобы задать горизонтальную направляющую, выберите пункт Guides: Add Horizontal, чтобы задать вертикальную — Guides: Add Vertical.
Похожие вопросы
- Как добавить стрелку в Zero Block?
- Есть ли слои в Zero Block?
- Как в Zero Block настроить увеличение изображения по клику?
- Что такое Tooltip (тултип) в Zero блоке?
- Как сделать анимацию на мобильных в Zero Block?
Как сделать вместо точек галереи ZeroBlock в виде линии заполнения в TILDA ?
Что бы указать class у элемента, нажимаешь на него правой кнопкой мыши и выбираешь из списка последнюю строку «Add CSS Class Name», далее, справа в настройках указываешь class.
2. Цвет активной и идущей перед ней линий, указывается в настройках Зеро Блока, цвет точек Dots (Это техническое ограничение здесь это не можем указывать);
- «Класс элемента»– Указываешь class, который привязал к слайдеру (например, customslider);
- «Цвет неактивной полоски»– Линии, та которая тонкая в 1px;
- «Высота линии (px)»– Толщина линии;
- «Отступ от слайдера (px)»;