From 3c94296658292a1b4e6e89ba816103680856d30b Mon Sep 17 00:00:00 2001 From: johanzhu Date: Wed, 14 Aug 2024 18:09:28 +0800 Subject: [PATCH 1/6] Feat/add spine doc (#2334) feat: add spine doc --- docs/zh/graphics/2D/spine/runtime.md | 21 ++++++++++++++++----- 1 file changed, 16 insertions(+), 5 deletions(-) diff --git a/docs/zh/graphics/2D/spine/runtime.md b/docs/zh/graphics/2D/spine/runtime.md index edc7157984..b7c5b7ef5a 100644 --- a/docs/zh/graphics/2D/spine/runtime.md +++ b/docs/zh/graphics/2D/spine/runtime.md @@ -35,12 +35,23 @@ await engine.resourceManager.load({ ``` 若未添加至场景中，则需要在代码中手动加载，步骤如下： -1. 首先，需要找到 Spine 动画的资产链接，点击 Galacean 编辑器的下载按钮，选择 project URL，拷贝 project.json 后打开，找到上传的 spine 动画文件（skel / json）： +1. 首先下载编辑器项目 -Project export panel +注意：`Uploadd Assets to CDN` 选项，如果勾选，则是通过 cdn 链接来加载动画；如果未勾选，则是通过本地文件相对路径加载动画。 + +Project export panel + +2. 找到 spine 资产文件 + +下载项目到本地后，打开 project.json 文件，找到 url 属性并打开。 +如果上一步勾选了`Uploadd Assets to CDN`选项，那么可以在 json 文件中找到spine 资产链接： + +Find spine assset + +如果上一步未勾选`Uploadd Assets to CDN`选项，可以在本地 `public 文件夹`中找到 spine 资产。加载时，使用相对路径作为链接即可。 + +Find spine assset -找到 spine 资产文件 json 或 skel： -Spine skeleton data file 2. 使用 resourceManager 加载 @@ -51,7 +62,7 @@ import { SpineAnimationRenderer } from '@galacean/engine-spine'; // 加载并得到 spine 资源 const spineResource = await engine.resourceManager.load( { - url: 'https://galacean.spineboy.json', // 编辑器资产 + url: 'https://galacean.raptor.json', // 或者是文件的相对路径 url: '../public/raptor.json"' type: 'spine', // 必须指定加载器类型为 spine }, ); From cdc75d1b0549c45e79ccafc88387bd93da493135 Mon Sep 17 00:00:00 2001 From: ChenMo Date: Sun, 18 Aug 2024 15:54:46 +0800 Subject: [PATCH 2/6] Update README.md --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 60f6c6fa8c..1f09cbd46e 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,7 @@ [![codecov](https://codecov.io/gh/galacean/engine/branch/main/graph/badge.svg?token=KR2UBKE3OX)](https://codecov.io/gh/galacean/engine) [Galacean](https://galacean.antgroup.com/editor) is a **web-first** and **mobile-first** high-performance real-time interactive engine. Use **component system design** and pursue ease of use and light weight. Developers can independently use and write Typescript scripts to develop projects using pure code. +![image](https://github.com/user-attachments/assets/057c2c99-85a8-4ace-a268-c70daa1a449e) ## Features From f3400c8373bdfb272cfc156b4df1ae52b419aef7 Mon Sep 17 00:00:00 2001 From: ChenMo Date: Sun, 18 Aug 2024 15:55:51 +0800 Subject: [PATCH 3/6] Update README.md --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 1f09cbd46e..2ec72f6d37 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,7 @@ [![codecov](https://codecov.io/gh/galacean/engine/branch/main/graph/badge.svg?token=KR2UBKE3OX)](https://codecov.io/gh/galacean/engine) [Galacean](https://galacean.antgroup.com/editor) is a **web-first** and **mobile-first** high-performance real-time interactive engine. Use **component system design** and pursue ease of use and light weight. Developers can independently use and write Typescript scripts to develop projects using pure code. + ![image](https://github.com/user-attachments/assets/057c2c99-85a8-4ace-a268-c70daa1a449e) ## Features From aea19122a80d2fa4601c4f2a146dd3032fb136ad Mon Sep 17 00:00:00 2001 From: JujieX <67930474+JujieX@users.noreply.github.com> Date: Tue, 20 Aug 2024 18:08:24 +0800 Subject: [PATCH 4/6] Fix particleRenderer enable startFrame (#2333) * feat: enable startFrame --- .../particleRenderer-textureSheetAnimation.ts | 79 +++++++++++++++++++ e2e/config.ts | 5 ++ ...particleRenderer-textureSheetAnimation.jpg | 3 + .../core/src/particle/ParticleGenerator.ts | 21 +++-- .../modules/TextureSheetAnimationModule.ts | 12 ++- .../texture_sheet_animation_module.glsl | 15 ++-- 6 files changed, 114 insertions(+), 21 deletions(-) create mode 100644 e2e/case/particleRenderer-textureSheetAnimation.ts create mode 100644 e2e/fixtures/originImage/Particle_particleRenderer-textureSheetAnimation.jpg diff --git a/e2e/case/particleRenderer-textureSheetAnimation.ts b/e2e/case/particleRenderer-textureSheetAnimation.ts new file mode 100644 index 0000000000..3099ca3165 --- /dev/null +++ b/e2e/case/particleRenderer-textureSheetAnimation.ts @@ -0,0 +1,79 @@ +/** + * @title Particle TextureSheetAnimation + * @category Particle + */ +import { + AssetType, + BlendMode, + Camera, + Color, + Logger, + ParticleCurveMode, + ParticleMaterial, + ParticleRenderer, + Vector3, + WebGLEngine, + Vector2, + BoxShape, + Entity +} from "@galacean/engine"; +import { initScreenshot, updateForE2E } from "./.mockForE2E"; + +// Create engine +WebGLEngine.create({ + canvas: "canvas" +}).then((engine) => { + Logger.enable(); + engine.canvas.resizeByClientSize(); + const scene = engine.sceneManager.activeScene; + + const ambientLight = scene.ambientLight; + ambientLight.diffuseSolidColor.set(0.8, 0.8, 1, 1); + ambientLight.diffuseIntensity = 0.5; + + const rootEntity = scene.createRootEntity(); + scene.background.solidColor = new Color(25 / 255, 25 / 255, 112 / 255, 1); + + // Create camera + const cameraEntity = rootEntity.createChild("camera_entity"); + cameraEntity.transform.position = new Vector3(0, 10, 30); + const camera = cameraEntity.addComponent(Camera); + camera.fieldOfView = 60; + + engine.run(); + + engine.resourceManager + .load({ + url: "https://mdn.alipayobjects.com/huamei_qbugvr/afts/img/A*5EyLSqmA7q0AAAAAAAAAAAAADtKFAQ/original", + type: AssetType.Texture2D + }) + .then((texture) => { + const particleEntity = new Entity(engine); + const particleRenderer = particleEntity.addComponent(ParticleRenderer); + + const material = new ParticleMaterial(engine); + material.baseColor = new Color(1.0, 1.0, 1.0, 1.0); + material.blendMode = BlendMode.Additive; + material.baseTexture = texture; + particleRenderer.setMaterial(material); + + particleRenderer.generator.useAutoRandomSeed = false; + + const shape = new BoxShape(); + shape.size.set(22, 1, 0); + particleRenderer.generator.emission.shape = shape; + + const { textureSheetAnimation } = particleRenderer.generator; + textureSheetAnimation.enabled = true; + textureSheetAnimation.tiling = new Vector2(5, 3); + + textureSheetAnimation.frameOverTime.mode = ParticleCurveMode.TwoConstants; + textureSheetAnimation.frameOverTime.constantMin = 0; + textureSheetAnimation.frameOverTime.constantMax = 3 / 15; + + cameraEntity.addChild(particleEntity); + + updateForE2E(engine, 500); + initScreenshot(engine, camera); + }); +}); diff --git a/e2e/config.ts b/e2e/config.ts index 8aae126bfb..c8d2d9ab88 100644 --- a/e2e/config.ts +++ b/e2e/config.ts @@ -189,6 +189,11 @@ export const E2E_CONFIG = { category: "Particle", caseFileName: "particleRenderer-dream", threshold: 0.3 + }, + textureSheetAnimation: { + category: "Particle", + caseFileName: "particleRenderer-textureSheetAnimation", + threshold: 0.3 } }, PostProcess: { diff --git a/e2e/fixtures/originImage/Particle_particleRenderer-textureSheetAnimation.jpg b/e2e/fixtures/originImage/Particle_particleRenderer-textureSheetAnimation.jpg new file mode 100644 index 0000000000..72e9551cab --- /dev/null +++ b/e2e/fixtures/originImage/Particle_particleRenderer-textureSheetAnimation.jpg @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:a6f67df682bf50422dc3d5c4c48b82f88be39f8359f01ac2d98398dd49e701f5 +size 43859 diff --git a/packages/core/src/particle/ParticleGenerator.ts b/packages/core/src/particle/ParticleGenerator.ts index da3a70bfbd..f7e74dad42 100644 --- a/packages/core/src/particle/ParticleGenerator.ts +++ b/packages/core/src/particle/ParticleGenerator.ts @@ -806,12 +806,21 @@ export class ParticleGenerator { } // Simulation UV - if (this.textureSheetAnimation.enabled) { - const tillingInfo = this.textureSheetAnimation._tillingInfo; - instanceVertices[offset + ParticleBufferUtils.simulationUVOffset] = tillingInfo.x; - instanceVertices[offset + 35] = tillingInfo.y; - instanceVertices[offset + 36] = 0; - instanceVertices[offset + 37] = 0; + if (textureSheetAnimation.enabled) { + const { frameOverTime } = textureSheetAnimation; + const { x, y, z } = textureSheetAnimation._tillingInfo; + + let tileRow = 0; + if (frameOverTime.mode === ParticleCurveMode.Constant || frameOverTime.mode === ParticleCurveMode.TwoConstants) { + tileRow = + Math.floor(frameOverTime.evaluate(undefined, textureSheetAnimation._frameOverTimeRand.random()) * z) * x; + } + const tileRowIndex = Math.floor(tileRow); + + instanceVertices[offset + ParticleBufferUtils.simulationUVOffset] = x; + instanceVertices[offset + 35] = y; + instanceVertices[offset + 36] = tileRow - tileRowIndex; + instanceVertices[offset + 37] = tileRowIndex * y; } else { instanceVertices[offset + ParticleBufferUtils.simulationUVOffset] = 1; instanceVertices[offset + 35] = 1; diff --git a/packages/core/src/particle/modules/TextureSheetAnimationModule.ts b/packages/core/src/particle/modules/TextureSheetAnimationModule.ts index 39ffbe7412..a75470911c 100644 --- a/packages/core/src/particle/modules/TextureSheetAnimationModule.ts +++ b/packages/core/src/particle/modules/TextureSheetAnimationModule.ts @@ -16,14 +16,12 @@ export class TextureSheetAnimationModule extends ParticleGeneratorModule { private static readonly _frameCurveMacro = ShaderMacro.getByName("RENDERER_TSA_FRAME_CURVE"); private static readonly _frameRandomCurvesMacro = ShaderMacro.getByName("RENDERER_TSA_FRAME_RANDOM_CURVES"); - private static readonly _cycleCountProperty = ShaderProperty.getByName("renderer_TSACycles"); - private static readonly _tillingParamsProperty = ShaderProperty.getByName("renderer_TSATillingParams"); private static readonly _frameMinCurveProperty = ShaderProperty.getByName("renderer_TSAFrameMinCurve"); private static readonly _frameMaxCurveProperty = ShaderProperty.getByName("renderer_TSAFrameMaxCurve"); - /** Start frame of the texture sheet. */ - @deepClone - readonly startFrame = new ParticleCompositeCurve(0); + private static readonly _cycleCountProperty = ShaderProperty.getByName("renderer_TSACycles"); + private static readonly _tillingParamsProperty = ShaderProperty.getByName("renderer_TSATillingParams"); + /** Frame over time curve of the texture sheet. */ @deepClone readonly frameOverTime = new ParticleCompositeCurve(new ParticleCurve(new CurveKey(0, 0), new CurveKey(1, 1))); @@ -42,7 +40,7 @@ export class TextureSheetAnimationModule extends ParticleGeneratorModule { @deepClone private _tiling = new Vector2(1, 1); @ignoreClone - private _textureSheetMacro: ShaderMacro; + private _frameCurveMacro: ShaderMacro; /** * Tiling of the texture sheet. @@ -78,7 +76,7 @@ export class TextureSheetAnimationModule extends ParticleGeneratorModule { } } - this._textureSheetMacro = this._enableMacro(shaderData, this._textureSheetMacro, frameMacro); + this._frameCurveMacro = this._enableMacro(shaderData, this._frameCurveMacro, frameMacro); } /** diff --git a/packages/core/src/shaderlib/particle/texture_sheet_animation_module.glsl b/packages/core/src/shaderlib/particle/texture_sheet_animation_module.glsl index 37b458d585..42fb287d73 100644 --- a/packages/core/src/shaderlib/particle/texture_sheet_animation_module.glsl +++ b/packages/core/src/shaderlib/particle/texture_sheet_animation_module.glsl @@ -2,10 +2,10 @@ uniform float renderer_TSACycles; uniform vec3 renderer_TSATillingParams; // x:subU y:subV z:tileCount uniform vec2 renderer_TSAFrameMaxCurve[4]; // x:time y:value -#endif -#ifdef RENDERER_TSA_FRAME_RANDOM_CURVES - uniform vec2 renderer_TSAFrameMinCurve[4]; // x:time y:value + #ifdef RENDERER_TSA_FRAME_RANDOM_CURVES + uniform vec2 renderer_TSAFrameMinCurve[4]; // x:time y:value + #endif #endif vec2 computeParticleUV(in vec2 uv, in float normalizedAge) { @@ -13,17 +13,16 @@ vec2 computeParticleUV(in vec2 uv, in float normalizedAge) { float scaledNormalizedAge = normalizedAge * renderer_TSACycles; float cycleNormalizedAge = scaledNormalizedAge - floor(scaledNormalizedAge); float normalizedFrame = evaluateParticleCurve(renderer_TSAFrameMaxCurve, cycleNormalizedAge); - #ifdef RENDERER_TSA_FRAME_RANDOM_CURVES normalizedFrame = mix(evaluateParticleCurve(renderer_TSAFrameMinCurve, cycleNormalizedAge), normalizedFrame, a_Random1.x); #endif float frame = floor(normalizedFrame * renderer_TSATillingParams.z); - float totalULength = frame * renderer_TSATillingParams.x; - float floorTotalULength = floor(totalULength); - uv.x += totalULength - floorTotalULength; - uv.y += floorTotalULength * renderer_TSATillingParams.y; + float tileRow = frame * renderer_TSATillingParams.x; + float floorTotalULength = floor(tileRow); + uv.x += tileRow - tileRowIndex; + uv.y += tileRowIndex * renderer_TSATillingParams.y; #endif return uv; From f127a849c9395d005d8146d45b7b5cc4a90713e5 Mon Sep 17 00:00:00 2001 From: GuoLei1990 Date: Tue, 20 Aug 2024 18:10:38 +0800 Subject: [PATCH 5/6] "v1.3.7" --- packages/core/package.json | 2 +- packages/design/package.json | 2 +- packages/galacean/package.json | 2 +- packages/loader/package.json | 2 +- packages/math/package.json | 2 +- packages/physics-lite/package.json | 2 +- packages/physics-physx/package.json | 2 +- packages/rhi-webgl/package.json | 2 +- packages/shader-lab/package.json | 2 +- packages/xr-webxr/package.json | 2 +- packages/xr/package.json | 2 +- 11 files changed, 11 insertions(+), 11 deletions(-) diff --git a/packages/core/package.json b/packages/core/package.json index e5c9810dd1..02f84790cd 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@galacean/engine-core", - "version": "1.3.6", + "version": "1.3.7", "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org" diff --git a/packages/design/package.json b/packages/design/package.json index 304ce254a9..81d7e85457 100644 --- a/packages/design/package.json +++ b/packages/design/package.json @@ -1,6 +1,6 @@ { "name": "@galacean/engine-design", - "version": "1.3.6", + "version": "1.3.7", "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org" diff --git a/packages/galacean/package.json b/packages/galacean/package.json index f799d0814d..c689639aac 100644 --- a/packages/galacean/package.json +++ b/packages/galacean/package.json @@ -1,6 +1,6 @@ { "name": "@galacean/engine", - "version": "1.3.6", + "version": "1.3.7", "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org" diff --git a/packages/loader/package.json b/packages/loader/package.json index c70ca85fc1..d34aea5919 100644 --- a/packages/loader/package.json +++ b/packages/loader/package.json @@ -1,6 +1,6 @@ { "name": "@galacean/engine-loader", - "version": "1.3.6", + "version": "1.3.7", "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org" diff --git a/packages/math/package.json b/packages/math/package.json index 5a59d8d8d7..801a58260a 100644 --- a/packages/math/package.json +++ b/packages/math/package.json @@ -1,6 +1,6 @@ { "name": "@galacean/engine-math", - "version": "1.3.6", + "version": "1.3.7", "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org" diff --git a/packages/physics-lite/package.json b/packages/physics-lite/package.json index 56ce12b86b..43207cef2f 100644 --- a/packages/physics-lite/package.json +++ b/packages/physics-lite/package.json @@ -1,6 +1,6 @@ { "name": "@galacean/engine-physics-lite", - "version": "1.3.6", + "version": "1.3.7", "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org" diff --git a/packages/physics-physx/package.json b/packages/physics-physx/package.json index 8972ddd9c7..e795be40fc 100644 --- a/packages/physics-physx/package.json +++ b/packages/physics-physx/package.json @@ -1,6 +1,6 @@ { "name": "@galacean/engine-physics-physx", - "version": "1.3.6", + "version": "1.3.7", "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org" diff --git a/packages/rhi-webgl/package.json b/packages/rhi-webgl/package.json index eea6f813be..f783c1984f 100644 --- a/packages/rhi-webgl/package.json +++ b/packages/rhi-webgl/package.json @@ -1,6 +1,6 @@ { "name": "@galacean/engine-rhi-webgl", - "version": "1.3.6", + "version": "1.3.7", "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org" diff --git a/packages/shader-lab/package.json b/packages/shader-lab/package.json index a75be99c15..8b3c331d72 100644 --- a/packages/shader-lab/package.json +++ b/packages/shader-lab/package.json @@ -1,6 +1,6 @@ { "name": "@galacean/engine-shader-lab", - "version": "1.3.6", + "version": "1.3.7", "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org" diff --git a/packages/xr-webxr/package.json b/packages/xr-webxr/package.json index a51a7bfe02..17b2467f83 100644 --- a/packages/xr-webxr/package.json +++ b/packages/xr-webxr/package.json @@ -1,6 +1,6 @@ { "name": "@galacean/engine-xr-webxr", - "version": "1.3.6", + "version": "1.3.7", "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org" diff --git a/packages/xr/package.json b/packages/xr/package.json index a5f7f276d1..b9ce47a228 100644 --- a/packages/xr/package.json +++ b/packages/xr/package.json @@ -1,6 +1,6 @@ { "name": "@galacean/engine-xr", - "version": "1.3.6", + "version": "1.3.7", "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org" From 22f80f053723809c7ebf228c3a6c029a7ed89d16 Mon Sep 17 00:00:00 2001 From: singlecoder Date: Tue, 20 Aug 2024 19:29:02 +0800 Subject: [PATCH 6/6] fix(demo): fix video demo error in ios, video will show full screen (#2352) --- examples/video-background.ts | 1 + examples/video-transparent.ts | 1 + 2 files changed, 2 insertions(+) diff --git a/examples/video-background.ts b/examples/video-background.ts index 4003a6f061..2e6d2748ea 100644 --- a/examples/video-background.ts +++ b/examples/video-background.ts @@ -92,6 +92,7 @@ void main() { dom.crossOrigin = "anonymous"; dom.loop = true; dom.muted = true; + dom.playsInline = true; dom.play(); // create video background diff --git a/examples/video-transparent.ts b/examples/video-transparent.ts index ea636ebd08..dba05a03df 100644 --- a/examples/video-transparent.ts +++ b/examples/video-transparent.ts @@ -112,6 +112,7 @@ WebGLEngine.create({ canvas: "canvas" }).then((engine) => { dom.crossOrigin = "anonymous"; dom.loop = true; dom.muted = true; + dom.playsInline = true; dom.play(); // create video texture