1# SceneResource
2本模块提供3D图形中常用的基本资源类型。
3
4> **说明:**
5> - 本模块首批接口从API version 12开始支持,后续版本的新增接口,采用上角标标记接口的起始版本。
6
7## 导入模块
8```ts
9import { SceneResourceType, SceneResource, Shader, MaterialType, Material, ShaderMaterial,
10  SubMesh, Mesh, Animation, EnvironmentBackgroundType, Environment, Image } from '@kit.ArkGraphics3D';
11```
12## SceneResourceType
13场景资源类型枚举,对场景中的资源进行分类。
14
15**系统能力:** SystemCapability.ArkUi.Graphics3D
16
17| 名称 | 值 | 说明 |
18| ---- | ---- | ---- |
19| UNKNOWN | 0 | 未定义类型。 |
20| NODE | 1 | 结点类型。 |
21| ENVIRONMENT | 2 | 环境类型。 |
22| MATERIAL | 3 | 材质类型。 |
23| MESH | 4 | 网格类型。 |
24| ANIMATION | 5 | 动画类型。 |
25| SHADER | 6 | 着色器类型。 |
26| IMAGE | 7 | 图片类型。 |
27
28## SceneResource
29用于表示场景中的资源。
30
31### 属性
32
33**系统能力:** SystemCapability.ArkUi.Graphics3D
34
35| 名称 | 类型 | 只读 | 可选 | 说明 |
36| ---- | ---- | ---- | ---- | ---- |
37| name | string | 否 | 否 | 名称,没有特殊格式要求。 |
38| resourceType | [SceneResourceType](#sceneresourcetype) | 是 | 否 | 场景资源类型,默认值为undefined。|
39| uri | [ResourceStr](../apis-arkui/arkui-ts/ts-types.md#resourcestr) | 是 | 是 | 需要加载的资源,默认值为undefined。|
40
41### destroy
42destroy(): void
43
44销毁场景资源,释放所有关联的资源或引用,一旦被释放,资源就不能被再次使用或访问。
45
46**系统能力:** SystemCapability.ArkUi.Graphics3D
47
48**示例:**
49```ts
50import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
51  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';
52
53function destroy() : void {
54  let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
55  scene.then(async (result: Scene) => {
56    if (result) {
57      let sceneFactory: SceneResourceFactory = result.getResourceFactory();
58      let sceneResourceParameter: SceneResourceParameters = { name: "shaderResource",
59        uri: $rawfile("shaders/custom_shader/custom_material_sample.shader") };
60      let shader: Promise<Shader> = sceneFactory.createShader(sceneResourceParameter);
61      shader.then(async (shaderResult:Shader) => {
62         // 释放资源
63         shaderResult.destroy();
64      });
65    }
66  });
67}
68```
69
70## Shader
71着色器,继承自[SceneResource](#sceneresource)。
72
73### 属性
74
75**系统能力:** SystemCapability.ArkUi.Graphics3D
76
77| 名称 | 类型 | 只读 | 可选 | 说明 |
78| ---- | ---- | ---- | ---- | ---- |
79| inputs | Record<string, number \| Vec2 \| Vec3 \| Vec4 \| Image> | 是 | 否 | 着色器输入。 |
80
81## MaterialType
82场景中物体材质类型枚举。
83
84**系统能力:** SystemCapability.ArkUi.Graphics3D
85
86| 名称 | 值 | 说明 |
87| ---- | ---- | ---- |
88| SHADER | 1 | 材质由着色器定义。 |
89
90## Material
91材质类型,继承自[SceneResource](#sceneresource)。
92### 属性
93
94**系统能力:** SystemCapability.ArkUi.Graphics3D
95
96| 名称 | 类型 | 只读 | 可选 | 说明 |
97| ---- | ---- | ---- | ---- | ---- |
98| materialType | [MaterialType](#materialtype) | 是 | 否 | 材质类型。 |
99
100## ShaderMaterial
101着色器材质,继承自[Material](#material)。
102### 属性
103
104**系统能力:** SystemCapability.ArkUi.Graphics3D
105
106| 名称 | 类型 | 只读 | 可选 | 说明 |
107| ---- | ---- | ---- | ---- | ---- |
108| colorShader | [Shader](#shader) | 否 | 是 | 着色器,默认值为undefined。 |
109
110## SubMesh
111子网格类型。
112### 属性
113
114**系统能力:** SystemCapability.ArkUi.Graphics3D
115
116| 名称 | 类型 | 只读 | 可选 | 说明 |
117| ---- | ---- | ---- | ---- | ---- |
118| name | string | 否 | 否 | 名称,没有特殊格式要求。 |
119| material | [Material](#material) | 否 | 否 | 材质。 |
120| aabb | [Aabb](js-apis-inner-scene-types.md#aabb) | 是 | 否 | 轴对齐边界盒。 |
121
122## Mesh
123网格类型,继承自[SceneResource](#sceneresource)。
124### 属性
125
126**系统能力:** SystemCapability.ArkUi.Graphics3D
127
128| 名称 | 类型 | 只读 | 可选 | 说明 |
129| ---- | ---- | ---- | ---- | ---- |
130| subMeshes | [SubMesh](#submesh)[] | 是 | 否 | 子网格数组。 |
131| aabb | [Aabb](js-apis-inner-scene-types.md#aabb) | 是 | 否 | 轴对齐包围盒。|
132| materialOverride | [Material](#material) | 否 | 是 | 材质,默认为空。 |
133
134## Animation
135动画类型,继承自[SceneResource](#sceneresource)。
136### 属性
137
138**系统能力:** SystemCapability.ArkUi.Graphics3D
139
140| 名称 | 类型 | 只读 | 可选 | 说明 |
141| ---- | ---- | ---- | ---- | ---- |
142| enabled | boolean | 否 | 否 | 动画是否使能,true表示可以播放动画,false表示不可以播放动画。 |
143| duration | number | 是 | 否 | 动画持续时间,取值范围大于等于0。 |
144| running | boolean | 是 | 否 | 动画运行状态, true表示动画正在播放,false表示动画停止播放。 |
145| progress | number | 是 | 否 | 动画进度状态,取值区间为[0, 1]。 |
146
147### onFinished
148onFinished(callback: Callback\<void>): void
149
150动画播放结束时执行的的回调函数,动画播放完成或者finish操作会触发这个回调。
151
152**系统能力:** SystemCapability.ArkUi.Graphics3D
153
154**参数:**
155| 参数名 | 类型 | 必填 | 说明 |
156| ---- | ---- | ---- | ---- |
157| callback | Callback\<void> | 是 | 回调函数,返回值为空。 |
158
159**示例:**
160```ts
161import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
162  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';
163
164function onFinished() : void {
165  let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
166  scene.then(async (result: Scene) => {
167    if (result) {
168      let anim: Animation = result.animations[0];
169      // 注册回调函数
170      anim.onFinished(()=>{
171        console.info("onFinished");
172      });
173    }
174  });
175}
176```
177
178### onStarted
179onStarted(callback: Callback\<void>): void
180
181当动画开始播放时执行的回调函数,start操作以及restart操作也会触发这个回调。
182
183**参数:**
184| 参数名 | 类型 | 必填 | 说明 |
185| ---- | ---- | ---- | ---- |
186| callback | Callback\<void> | 是 | 回调函数,返回值为空。 |
187
188动画开始时会执行传入的回调函数。
189
190**系统能力:** SystemCapability.ArkUi.Graphics3D
191
192**示例:**
193```ts
194import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
195  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';
196
197function onStarted() : void {
198  let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
199  scene.then(async (result: Scene) => {
200    if (result) {
201      let anim: Animation = result.animations[0];
202      // 注册回调函数
203      anim.onStarted(()=>{
204        console.info("onStarted");
205      });
206    }
207  });
208}
209```
210
211### pause
212pause(): void
213
214将动画暂停,动画的播放进度保持在当前状态。
215
216**系统能力:** SystemCapability.ArkUi.Graphics3D
217
218**示例:**
219```ts
220import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
221  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';
222
223function pause() : void {
224  let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
225  scene.then(async (result: Scene) => {
226    if (result) {
227      let anim: Animation = result.animations[0];
228      // 暂停动画
229      anim.pause();
230    }
231  });
232}
233```
234
235### restart
236restart(): void
237
238从动画的起点开始播放动画。
239
240**系统能力:** SystemCapability.ArkUi.Graphics3D
241
242**示例:**
243```ts
244import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
245  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';
246
247function restart() : void {
248  let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
249  scene.then(async (result: Scene) => {
250    if (result) {
251      let anim: Animation = result.animations[0];
252      // 重启动画
253      anim.restart();
254    }
255  });
256}
257```
258
259### seek
260seek(position: number): void
261
262从指定位置开始播放动画。
263
264**系统能力:** SystemCapability.ArkUi.Graphics3D
265
266**参数:**
267| 参数名 | 类型 | 必填 | 说明 |
268| ---- | ---- | ---- | ---- |
269| position | number | 是 | 要重新播放动画的起始位置,取值区间为[0, 1]。 |
270
271**示例:**
272```ts
273import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
274  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';
275
276function seek() : void {
277  let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
278  scene.then(async (result: Scene) => {
279    if (result) {
280      let anim: Animation = result.animations[0];
281      // 指定动画的播放进度到10%
282      anim.seek(0.1);
283    }
284  });
285}
286```
287
288### start
289start(): void
290
291基于当前进度开始播放一个动画。
292
293**系统能力:** SystemCapability.ArkUi.Graphics3D
294
295**示例:**
296```ts
297import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
298  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';
299
300function start() : void {
301  let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
302  scene.then(async (result: Scene) => {
303    if (result) {
304      let anim: Animation = result.animations[0];
305      // 开始动画
306      anim.start();
307    }
308  });
309}
310```
311
312### stop
313stop(): void
314
315停止播放一个动画,并将动画的进度设置到未开始状态。
316
317**系统能力:** SystemCapability.ArkUi.Graphics3D
318
319**示例:**
320```ts
321import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
322  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';
323
324function stop() : void {
325  let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
326  scene.then(async (result: Scene) => {
327    if (result) {
328      let anim: Animation = result.animations[0];
329      // 停止播放动画,并将动画的进度设置到未开始状态
330      anim.stop();
331    }
332  });
333}
334```
335
336### finish
337finish(): void
338
339直接跳转到动画的最后,并将动画的进度设置到已结束状态。
340
341**系统能力:** SystemCapability.ArkUi.Graphics3D
342
343```ts
344import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters,
345  LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D';
346
347function finish() : void {
348  let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf"));
349  scene.then(async (result: Scene) => {
350    if (result) {
351      let anim: Animation = result.animations[0];
352      // 直接跳转到动画的最后,并将动画的进度设置到已结束状态。
353      anim.finish();
354    }
355  });
356}
357```
358
359## EnvironmentBackgroundType
360环境背景类型枚举。
361
362**系统能力:** SystemCapability.ArkUi.Graphics3D
363
364| 名称 | 值 | 说明 |
365| ---- | ---- | ---- |
366| BACKGROUND_NONE | 0 | 无背景。|
367| BACKGROUND_IMAGE | 1 | 图片背景。 |
368| BACKGROUND_CUBEMAP | 2 | 立方体贴图背景。|
369| BACKGROUND_EQUIRECTANGULAR | 3 | 等距矩形背景。 |
370
371## Environment
372环境类型,继承自[SceneResource](#sceneresource)。
373### 属性
374
375**系统能力:** SystemCapability.ArkUi.Graphics3D
376
377| 名称 | 类型 | 只读 | 可选 | 说明 |
378| ---- | ---- | ---- | ---- | ---- |
379| backgroundType | [EnvironmentBackgroundType](#environmentbackgroundtype) | 否 | 否 | 环境背景类型。 |
380| indirectDiffuseFactor | [Vec4](js-apis-inner-scene-types.md#vec4) | 否 | 否 | 间接散射系数。 |
381| indirectSpecularFactor | [Vec4](js-apis-inner-scene-types.md#vec4) | 否 | 否 | 间接反射系数。 |
382| environmentMapFactor | [Vec4](js-apis-inner-scene-types.md#vec4) | 否 | 否 | 环境地图系数。 |
383| environmentImage | [Image](#image) \| null | 否 | 是 | 环境图片,默认为undefined。 |
384| radianceImage | [Image](#image) \| null | 否 | 是 | 辐射图片,默认为undefined。 |
385| irradianceCoefficients | [Vec3](js-apis-inner-scene-types.md#vec3)[] | 否 | 是 | 辐射系数,默认为undefined。 |
386
387## Image
388图片类型,继承自[SceneResource](#sceneresource)。
389### 属性
390
391**系统能力:** SystemCapability.ArkUi.Graphics3D
392
393| 名称 | 类型 | 只读 | 可选 | 说明 |
394| ---- | ---- | ---- | ---- | ---- |
395| width | number | 是 | 否 | 图片宽度,取值范围大于0。 |
396| height | number | 是 | 否 | 图片高度,取值范围大于0。 |
397