Ресурс типа texture представляет собой изображение, которое применяется к объектам 3D-сцены для добавления деталей и визуальных эффектов. В PlayCanvas текстуры могут быть использованы для покрытия поверхностей моделей, создания фонов или создания различных эффектов (например, отражений, нормальных карт и т. д.).
Для работы с текстурами необходимо загрузить их в систему PlayCanvas.
Это можно сделать с помощью стандартных методов загрузки,
предоставляемых движком. Текстуры могут быть загружены как изображения
форматов .png, .jpg, .tiff,
.dds и другие.
Пример кода для загрузки текстуры:
var texture = new pc.Texture(graphicsDevice, {
width: 256,
height: 256
});
В PlayCanvas текстура может быть использована в качестве диффузной карты (основного покрытия) или быть частью более сложных шейдеров.
Material представляет собой абстракцию, которая связывает текстуры и другие параметры (например, освещенность, отражение) с 3D-объектом. Материалы PlayCanvas используют шейдеры для обработки визуальных данных.
В PlayCanvas можно создать материал с помощью конструктора
pc.Material. Материал можно настраивать, задавая различные
параметры, такие как цвет, текстуры и физические свойства (например,
глянец или шероховатость). Чтобы применить материал к модели, необходимо
использовать метод setMaterial.
Пример создания материала:
var material = new pc.Material();
material.diffuse = new pc.Color(1, 0, 0); // красный цвет
material.update();
При создании материала можно добавить текстуры для диффузной карты, карты нормалей, карты отражений и других карт.
Модели в PlayCanvas представляют собой 3D-геометрию, которая
используется для отображения объектов на сцене. Модели могут быть
загружены в движок из форматов, таких как .fbx,
.obj, .gltf и других.
Для загрузки моделей PlayCanvas предоставляет несколько методов.
Самым популярным способом является использование функции
assets.load(), которая позволяет загружать модели и затем
применить их к объектам сцены.
Пример кода для загрузки модели:
var asset = new pc.Asset('model', 'model', {
url: 'models/my_model.gltf'
});
app.assets.load(asset);
asset.ready(function () {
var modelEntity = new pc.Entity();
modelEntity.addComponent('model', {
type: 'asset',
asset: asset
});
app.root.addChild(modelEntity);
});
Модели в PlayCanvas могут включать анимации, текстуры и материалы. После загрузки модели её компоненты могут быть использованы для взаимодействия с другими частями сцены.
Анимации в PlayCanvas обеспечивают динамическое изменение объектов сцены. Они могут быть использованы для анимации движения, изменения текстур, изменения масштаба объектов и прочего.
PlayCanvas поддерживает два основных типа анимаций: костную анимацию (skeletal animation) и анимирование свойств (property animation). Костная анимация изменяет положение, ориентацию и масштаб костей персонажа, в то время как анимация свойств может изменять любые другие параметры объекта.
Пример анимации позиции объекта:
var anim = new pc.AnimationComponent();
anim.addCurve('position', new pc.CurveSet([
new pc.CurveKey(0, new pc.Vec3(0, 0, 0)),
new pc.CurveKey(1, new pc.Vec3(10, 0, 0))
]));
entity.addComponent('animation');
entity.animation.play('position');
Звуковые ресурсы в PlayCanvas включают в себя различные типы аудио, такие как фоновые музыкальные треки и эффекты, привязанные к действиям в сцене.
Для работы с аудио в PlayCanvas используется компонент
audioSource, который может быть привязан к любому объекту
сцены. С помощью этого компонента можно воспроизводить аудиофайлы,
управлять их громкостью и другими параметрами.
Пример использования:
var sound = new pc.Asset('sound', 'audio', {
url: 'sounds/my_sound.mp3'
});
app.assets.load(sound);
sound.ready(function () {
var audioSource = entity.addComponent('audioSource', {
sound: sound
});
audioSource.play();
});
Ресурс типа script представляет собой JavaScript-код, который выполняется в рамках сцены. Скрипты могут управлять поведением объектов, взаимодействием с пользователем и производить другие действия.
Для добавления скриптов к объекту необходимо создать компонент
script. Скрипты могут быть написаны в виде отдельных
файлов, которые затем подключаются к объектам.
Пример скрипта:
var MyScript = pc.createScript('myScript');
MyScript.prototype.initialize = function() {
console.log('Скрипт инициализирован');
};
После написания скрипта его необходимо добавить к сущности:
entity.addComponent('script');
entity.script.create('myScript');
Ресурс json в PlayCanvas используется для работы с данными в формате JSON. Этот тип ресурса часто используется для хранения информации, такой как настройки, карты уровней или другие данные, которые должны быть загружены в сцену.
Для загрузки JSON-файлов используется стандартный метод
assets.load():
var jsonAsset = new pc.Asset('levelData', 'json', {
url: 'data/level1.json'
});
app.assets.load(jsonAsset);
jsonAsset.ready(function () {
var levelData = jsonAsset.resource;
console.log(levelData);
});
JSON-ресурсы могут быть использованы для хранения любых структурированных данных и затем обработаны в скриптах.
Ресурс типа binary представляет собой двоичные данные. Это может быть полезно, например, для хранения сжатых текстур, моделей или других файлов в формате, не предназначенном для работы с текстом.
Для загрузки бинарных данных в PlayCanvas также используется метод
assets.load():
var binaryAsset = new pc.Asset('dataFile', 'binary', {
url: 'data/file.bin'
});
app.assets.load(binaryAsset);
binaryAsset.ready(function () {
var data = binaryAsset.resource;
console.log(data);
});
Бинарные данные могут быть использованы для работы с нестандартными файлами или специфичными форматами данных.
Ресурс font в PlayCanvas используется для отображения текста на экране с помощью векторных шрифтов. Эти ресурсы могут быть использованы для создания UI-элементов, отображающих текст, или для отображения текста в 3D-пространстве.
Шрифты можно добавить как ресурсы типа font. PlayCanvas
поддерживает работу с TrueType и OpenType шрифтами.
Пример использования шрифта:
var font = new pc.Asset('font', 'font', {
url: 'fonts/myFont.ttf'
});
app.assets.load(font);
font.ready(function () {
var text = new pc.Entity();
text.addComponent('text', {
fontAsset: font,
text: 'Hello, PlayCanvas!',
color: new pc.Color(1, 1, 1)
});
app.root.addChild(text);
});
Ресурсы типа shader позволяют пользователю создавать и применять свои собственные шейдеры для визуальных эффектов. В PlayCanvas поддерживается создание как фрагментных, так и вершинных шейдеров.
Шейдеры могут быть написаны вручную, а затем загружены как ресурсы. Создание шейдера требует использования GLSL или HLSL для описания поведения.
Пример создания простого шейдера:
var shader = new pc.Shader(graphicsDevice, {
attributes: {
aPosition: pc.SEMANTIC_POSITION
},
vshader: `
attribute vec3 aPosition;
void main(void) {
gl_Position = vec4(aPosition, 1.0);
}
`,
fshader: `
void main(void) {
gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0); // Красный цвет
}
`
});
Созданный шейдер может быть применён к материалу, который затем будет использован для объекта сцены.