Векторное изображение![](anchor.svg)
Компонент векторного изображения позволяет включать изображения в формате SVG. Манипулируйте и анимируйте изображения SVG на основе событий, функций и значений переменных, используя Динамические векторные изображения. Пользовательские параметры будут отображаться на вкладке свойств SVG как переменные компонента. В уроке "Манипулирование SVG-изображениями " показано, как использовать пользовательские свойства в дизайне пользовательского интерфейса. | ![]() |
Публичные переменные (Свойства)![](anchor.svg)
[?]
Компонент Векторное изображение имеет следующие основные свойства и группы свойств, общие для всех компонентов:
Имя, Дополнительные свойства, Свойства контейнера, Стиль контейнера, Прелоадер, События, Привязки.
Файл SVG![](anchor.svg)
Указывает файл, который будет отображаться компонентом.
Переменная: | drawing |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
drawing | Data Block | Файл SVG |
Масштаб![](anchor.svg)
Увеличивает или уменьшает размер изображения в окне компонента.
Переменная: | scale |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
scale | Float | Масштаб |
Вращение![](anchor.svg)
Количество градусов, на которое нужно повернуть изображение по часовой стрелке.
Переменная: | rotation |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
rotation | Float | Вращение |
Режим интерактивности![](anchor.svg)
Позволяет пользователю изменить положение изображения в рамке просмотра.
Переменная: | enableInteractions |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
enableInteractions | Boolean | Режим интерактивности |
Анимированный![](anchor.svg)
Позволяет отображать анимированные элементы SVG-изображений.
Переменная: | анимированный |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
анимированный | Boolean | Анимированный |
Сохранять пропорции![](anchor.svg)
Указывает, как элемент с viewBox с заданным соотношением сторон должен вписываться в область просмотра с другим соотношением сторон. Если переменная имеет значение true, свойства Выравнивание по горизонтали и Выравнивание по вертикали будут применяться, когда viewBox и область просмотра имеют разное соотношение сторон.
Переменная: | preserveAspectRatio |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
preserveAspectRatio | Boolean | Сохранять пропорции |
Выравнивание по горизонтали![](anchor.svg)
Указывает, как изображение должно быть выровнено по горизонтали, когда viewBox и область просмотра имеют разное соотношение сторон.
Переменная: | horizontalAlign |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
horizontalAlign | String | Выравнивание по горизонтали |
Выравнивание по вертикали![](anchor.svg)
Указывает, как изображение должно быть выровнено по вертикали, когда viewBox и viewport имеют разные соотношения сторон.
Переменная: | verticalAlign |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
verticalAlign | String | Выравнивание по вертикали |
Максимизировать![](anchor.svg)
Позволяет применять свойства Процент отступа по X и Процент отступа по Y к соответствующим значениям окна просмотра SVG в тех случаях, когда размер окна просмотра увеличивается или уменьшается.
Переменная: | maximize |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
maximize | Boolean | Максимизировать |
Процент отступа по X![](anchor.svg)
Когда свойство Максимизировать включено, элемент SVG занимает все пустое пространство в viewBox. Свойство marginPercentX управляет процентным отступом SVG-элементов по оси X. Все изменения происходят в свойстве viewBox.
Переменная: | marginPercentX |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
marginPercentX | Плавающий | Процент отступа по X |
Процент отступа по Y![](anchor.svg)
Когда свойство Максимизировать включено, элемент SVG занимает все пустое пространство в viewBox. Свойство marginPercentY управляет процентным отступом SVG-элементов по оси Y. Все изменения происходят в свойстве viewBox.
Переменная: | marginPercentY |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
marginPercentY | Плавающий | Процент отступа по Y |
Ширина холста![](anchor.svg)
Ширина холста в пикселях для SVG-изображения. Значение устанавливается при загрузке SVG-файла и может быть изменено. До загрузки файла значение 0
означает, что горизонтальное растяжение не ограничено и ширина холста будет равна ширине области просмотра.
Переменная: | canvasWidth |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
width | Integer | Ширина |
Высота холста![](anchor.svg)
Высота холста в пикселях для SVG-изображения. Значение устанавливается при загрузке SVG-файла и может быть изменено. До загрузки файла значение 0
означает неограниченное вертикальное растяжение, а высота холста будет равна высоте области просмотра.
Переменная: | canvasHeight |
Записи: | 1 |
Формат записи:
Поле | Тип поля | Описание поля |
width | Integer | Высота |