81bf188f5f
Single-letter tool keys (R, O, L, F, S, P, H), Escape, Enter, Space (and locale equivalents), arrow key names in shortcut tables and prose. Remove <kbd> from non-key words like 'drag'.
98 lines
7.1 KiB
Markdown
98 lines
7.1 KiB
Markdown
---
|
||
title: Рисование фигур
|
||
description: Создание прямоугольников, эллипсов, линий, фреймов, секций, многоугольников и звёзд в OpenPencil.
|
||
---
|
||
|
||
# Рисование фигур
|
||
|
||
Нижняя панель инструментов содержит инструменты для создания фигур, фреймов и секций. Выберите инструмент, затем кликните и перетащите на холсте для рисования.
|
||
|
||
## Инструменты панели
|
||
|
||
| Инструмент | Сочетание | Описание |
|
||
|------------|-----------|----------|
|
||
| Прямоугольник | <kbd>R</kbd> | Рисует прямоугольник |
|
||
| Эллипс | <kbd>O</kbd> | Рисует эллипс |
|
||
| Линия | <kbd>L</kbd> | Рисует линию |
|
||
| Фрейм | <kbd>F</kbd> | Рисует фрейм (контейнер для других узлов) |
|
||
| Секция | <kbd>S</kbd> | Рисует секцию (автоматически включает перекрывающиеся соседние элементы) |
|
||
|
||
## Выпадающее меню фигур
|
||
|
||
Выпадающее меню фигур (доступно из панели инструментов) содержит дополнительные фигуры:
|
||
|
||
- **Многоугольник** — создаёт многоугольник с 3 сторонами по умолчанию (треугольник)
|
||
- **Звезда** — создаёт 5-конечную звезду с внутренним радиусом 0.38
|
||
|
||
У многоугольника и звезды нет сочетания клавиш — доступ через выпадающее меню фигур на панели инструментов.
|
||
|
||
## Пропорциональное рисование
|
||
|
||
Удерживайте <kbd>Shift</kbd> при перетаскивании, чтобы ограничить пропорции фигуры:
|
||
|
||
- Прямоугольник → квадрат (одинаковая ширина и высота)
|
||
- Эллипс → круг
|
||
- Линия → фиксация под углами 0°/45°/90°
|
||
|
||
## Свойства фигур
|
||
|
||
После рисования фигуры выделите её, чтобы редактировать свойства на вкладке «Дизайн» панели свойств.
|
||
|
||
### Заливка
|
||
|
||
У каждой фигуры может быть заливка. Раздел заливки поддерживает:
|
||
|
||
- **Сплошной цвет** — выбор через HSV-палитру или ввод hex-значения
|
||
- **Градиент** — линейный, радиальный, угловой или ромбовидный с редактируемыми контрольными точками
|
||
- **Изображение** — выбор файла изображения в качестве заливки
|
||
|
||
### Обводка
|
||
|
||
Добавление контура к любой фигуре. Свойства обводки включают:
|
||
|
||
- **Толщина** — равномерная или по сторонам (верхняя/правая/нижняя/левая) через выпадающий список
|
||
- **Цвет** — сплошной цвет с прозрачностью
|
||
- **Выравнивание** — внутри, по центру или снаружи границы фигуры (рендеринг на основе обрезки соответствует поведению Figma)
|
||
- **Стиль окончаний** — без, скруглённые, квадратные, стрелки (линии), стрелки (равносторонние) (для открытых контуров)
|
||
- **Стиль соединений** — митра, скос, скругление
|
||
- **Штриховой шаблон** — штрих/пробел
|
||
|
||
### Скругление углов
|
||
|
||
Доступно для прямоугольников, фреймов, компонентов и экземпляров. Нажмите переключатель независимых углов, чтобы задать каждый угол (верхний левый, верхний правый, нижний левый, нижний правый) отдельно.
|
||
|
||
### Эффекты
|
||
|
||
Добавление визуальных эффектов из раздела «Эффекты»:
|
||
|
||
- **Тень** — смещение, радиус размытия, распространение, цвет
|
||
- **Внутренняя тень** — те же настройки, отображается внутри фигуры
|
||
- **Размытие слоя** — размывает весь узел
|
||
- **Размытие фона** — размывает содержимое за узлом
|
||
- **Размытие переднего плана** — размывает содержимое перед узлом
|
||
|
||
Нажмите **+**, чтобы добавить эффект. Каждая строка эффекта сворачивается, с встроенными элементами управления. Нажмите значок глаза, чтобы включить/отключить эффект.
|
||
|
||
## Фреймы и секции
|
||
|
||
**Фреймы** — это контейнеры. Перетащите фигуры внутрь фрейма, чтобы сделать их дочерними элементами. Фреймы могут обрезать содержимое (по умолчанию выключено) и поддерживают [авто-раскладку](./auto-layout).
|
||
|
||
**Секции** — это контейнеры верхнего уровня, которые автоматически включают перекрывающиеся соседние узлы при рисовании. Они полезны для организации больших холстов в логические области. У секций есть заголовок-бейдж, который можно перетаскивать.
|
||
|
||
## Сочетания клавиш
|
||
|
||
| Действие | Mac | Windows / Linux |
|
||
|----------|-----|-----------------|
|
||
| Прямоугольник | <kbd>R</kbd> | <kbd>R</kbd> |
|
||
| Эллипс | <kbd>O</kbd> | <kbd>O</kbd> |
|
||
| Линия | <kbd>L</kbd> | <kbd>L</kbd> |
|
||
| Фрейм | <kbd>F</kbd> | <kbd>F</kbd> |
|
||
| Секция | <kbd>S</kbd> | <kbd>S</kbd> |
|
||
| Ограничить до квадрата/круга | <kbd>Shift</kbd> + перетаскивание | <kbd>Shift</kbd> + перетаскивание |
|
||
|
||
## Советы
|
||
|
||
- Секции могут существовать только на верхнем уровне — их нельзя вложить внутрь фреймов.
|
||
- Используйте фреймы с [авто-раскладкой](./auto-layout) для создания адаптивных макетов.
|
||
- [Экспортируйте](./exporting) отдельные фигуры или группы как изображения через панель свойств или контекстное меню.
|