Использование графики с полотном, SVG и CSS3 (HTML)
[ Эта статья адресована разработчикам приложений среды выполнения Windows для Windows 8.x и Windows Phone 8.x. В случае разработки приложений для Windows 10 см. раздел последняя документация]
Этот раздел содержит сведения об использовании графики в приложении Магазина Windows с помощью JavaScript.
В этом разделе
| Тема | Описание |
|---|---|
Элемент полотна создает на вашей странице прямоугольное растровое полотно, на котором вы можете на лету рисовать графические изображения с использованием JavaScript. Полотна отлично подходят для создания игр и для тех случаев, когда нужно создавать графику в реальном времени или периодически изменять ее. |
|
Элемент полотна — это доступная для рисования область документа HTML, на которой средствами JavaScript можно создавать графические объекты, такие как анимации, диаграммы и игры. В этом разделе приводится описание действий, которые необходимо выполнить, чтобы анимировать простой рисунок с помощью элемента полотна. Эти сведения помогут вам приступить к работе. |
|
Фигуры и линии можно рисовать не только сплошными цветами. Градиент, используемый на полотне, по сути представляет собой тип значения цвета, поэтому его можно применять к свойствам fillStyle и strokeStyle. Градиенты позволяют создавать направленное изменение насыщенности или цвета изображения. Это полезно при создании фоновых изображений, отображения высоты на картах и во всех случаях, когда нужно добавить эффекты света и тени на поверхности. Градиенты оптимизируют веб-приложения, поскольку позволяют создавать такие эффекты без использования изображений и минимизируют ресурсы полосы пропускания и время, требуемые для загрузки. А создание градиентов путем программирования упрощает их масштабирование и повторное использование. |
|
Элемент полотна — это доступная для рисования область документа HTML, на которой средствами JavaScript можно создавать графические объекты, такие как анимации, диаграммы и игры. В этом разделе приводится описание действий, которые необходимо выполнить, чтобы отобразить изображение с помощью элемента полотна. Эти сведения помогут вам приступить к работе. |
Вы можете использовать полотна CSS и SVG в приложениях Магазина Windows, чтобы добавить быструю и легкую векторную графику и анимировать пользовательский интерфейс.
Почти любую векторную графику можно нарисовать, используя SVG или Canvas, но иногда, в зависимости от задачи, разработчику или компьютеру нужно выполнить значительно больший объем работы.
Двухмерные преобразования каскадных таблиц стилей уровня 3 (CSS3), позволяют вам преобразовывать, т. е. перемещать, поворачивать, масштабировать и наклонять объекты в двухмерном пространстве. Трехмерные преобразования CSS3 поддерживают такие же преобразования в трехмерном пространстве с дополнительной возможностью моделировать глубину с помощью преобразования перспективы.
Когда по отдельности задано несколько преобразований, результаты преобразований суммируются с учетом порядка их применения.