образовательный центр

Работа с фигурами

Фигуры доступны в левом меню.
 

 

Для того, чтобы добавить фигуру на сайт, перетяните ее на рабочую область редактора.

Всего доступно 6 виджетов:

Прямоугольник
Эллипс
Треугольник
Горизонтальная линия
Вертикальная линия
Многоугольник

 

Прямоугольник
 

После переноса на рабочую область виджет отобразится следующим образом
 

 

Вы можете изменить размер прямоугольника, потянув за один из маркеров.
Используйте клавишу Shift, чтобы изменять размер, сохраняя пропорцию.

Для того чтобы настроить прямоугольник дважды кликните по нему левой кнопкой мыши. Откроется окно Свойств виджета.

 

Свойства

Здесь вы можете задать точные координаты прямоугольника и его размер.
 

 

Примечание: если вы хотите отключить сохранение пропорций фигуры, нажмите на иконку с замком.

Ниже находится настройка фона. По умолчанию, фон фигуры прозрачный.

Вы можете выбрать цвет заливки или сохранить прозрачный фон.
 

 

Параметр прозрачность – позволяет управлять прозрачностью фигуры. Обратите внимание, что он влияет как на фон фигуры, так и на ее границу.

 

Закладка Граница

На закладке Граница можно настроить скругление углов прямоугольника.

Устанавливать скругление можно в процентах или пикселах.

По умолчанию скругление изменяется в пикселах, но вы можете переключиться на проценты.

Чтобы задать значение используйте кнопки "+" и "-" или просто введите нужную величину в соответствующем поле с помощью клавиатуры.
 

 

По умолчанию величина скругления изменяется для всех углов. Обратите внимание на схему слева, значения скругления для всех углов одинаковые и все они выделены темно серым.

Чтобы изменить скругление конкретного угла, просто кликните по нему. Выбранный угол останется темно серым, в то время как другие станут светло серыми. Теперь вы можете изменить величину скругления данного угла в то время, как скругление других, невыбранных углов, останется без изменений.
 

 

Примечание: вы можете одновременно изменять скругление нескольких углов 2 или 3. Для этого просто выделите их на схеме.

Ниже находится настройка границы. Вы можете

  • • выбрать цвет границы
  • • установить ее толщину

 

 

Эллипс
 

После переноса на рабочую область виджет отобразится следующим образом
 

 

Вы можете изменить размер  эллипса, потянув за один из маркеров.

Для того, чтобы настроить эллипс дважды кликните по нему левой кнопкой мыши. Откроется окно Свойств виджета.

 

Свойства

Здесь вы можете задать точные координаты эллипса и его размер.
 

 

Примечание: если вы хотите отключить сохранение пропорций фигуры, нажмите на иконку с замком.

Ниже находится настройка фона. По умолчанию, фон фигуры прозрачный.

Вы можете выбрать цвет заливки или сохранить прозрачный фон.
 

 

Параметр прозрачность – позволяет управлять прозрачностью фигуры. Обратите внимание, что он влияет как на фон фигуры, так и на ее границу.

 

Граница

На закладке Граница вы можете

  • выбрать цвет границы
  • установить ее толщину

 

 

Треугольник
 

После переноса на рабочую область виджет отобразится следующим образом
 

 

Вы можете изменить размер треугольника, потянув за один из маркеров.

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

Свойства

Здесь вы можете задать точные координаты треуголньника и его размер.
 

 

Примечание: если вы хотите отключить сохранение пропорций фигуры,  нажмите на иконку с замком.

Ниже находится настройка фона. По умолчанию, фон фигуры прозрачный.

Вы можете выбрать цвет заливки или сохранить прозрачный фон.
 

,

Параметр прозрачность – позволяет управлять прозрачностью фигуры. Обратите внимание, что он влияет как на фон фигуры, так и на ее границу.

 

Закладка Граница

На закладке Граница вы можете:

  • выбрать тип треугольника
  • выбрать цвет границы
  • установить толщину границы
     

 

 

Линия
 

После переноса на рабочую область виджет отобразится следующим образом (в случае использования Вертикальной линии, линия будет вертикальной)
 

 

Вы можете изменить длину линии, потянув за маркеры.

Для того, чтобы настроить линию, дважды кликните по ней левой кнопкой мыши. Откроется окно Свойств виджета.

 

Свойства

Здесь вы можете задать точные координаты линии и ее длину.
 

 

Граница

На закладке Граница вы можете выбрать вид линии:

  • сплошная
  • пунктираная
  • точки
  • двойная

 

А также выбрать цвет линии и ее толщину.
 

Теперь можно очень просто делать линии высотой всего в 1px, что позвоит создавать более интересные дизайнерские решения.

 

Многоугольник
 

После переноса на рабочую область виджет отобразится следующим образом
 

 

Вы можете изменить размер виджета, потянув за один из маркеров.

Примечание: обратите внимание, что многоугольник может быть только правильным.

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

 

Свойства

Здесь вы можете задать точные координаты многоугольника и его размер.
 

 

Примечание: если вы хотите отключить сохранение пропорций фигуры, нажмите на иконку с замком.

Ниже находится настройка фона. По умолчанию, фон фигуры прозрачный.

Вы можете выбрать цвет заливки или сохранить прозрачный фон.
 

 

Параметр прозрачность – позволяет управлять прозрачностью фигуры. Обратите внимание, что он влияет как на фон фигуры, так и на ее границу.

 

Граница

На закладке Граница вы можете:

  • выбрать число вершин многоугольника
  • выбрать цвет границы
  • установить ее толщину