From 5cd6f6bc6a63b11be837bb4b71e66cd3b47c20be Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Feb 2025 01:00:05 +0800 Subject: [PATCH 001/105] =?UTF-8?q?=E6=96=B0=E5=A2=9E=20=E7=89=88=E6=9C=AC?= =?UTF-8?q?=E5=8F=B7=20=E7=9B=91=E5=90=AC=E7=9D=80=E8=89=B2=E5=99=A8?= =?UTF-8?q?=E4=BB=A3=E7=A0=81=E5=8F=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/data/IFragmentState.ts | 2 +- src/data/IRenderObject.ts | 2 ++ src/data/IRenderPipeline.ts | 2 ++ src/data/IVertexState.ts | 2 +- 4 files changed, 6 insertions(+), 2 deletions(-) diff --git a/src/data/IFragmentState.ts b/src/data/IFragmentState.ts index 65a346a..1fa702d 100644 --- a/src/data/IFragmentState.ts +++ b/src/data/IFragmentState.ts @@ -10,7 +10,7 @@ export interface IFragmentState /** * 着色器代码。 */ - readonly code: string; + code: string; /** * A list of {@link GPUColorTargetState} defining the formats and behaviors of the color targets diff --git a/src/data/IRenderObject.ts b/src/data/IRenderObject.ts index 69e532f..90102cc 100644 --- a/src/data/IRenderObject.ts +++ b/src/data/IRenderObject.ts @@ -59,6 +59,8 @@ export interface IRenderObject * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements */ readonly drawIndexed?: IDrawIndexed; + + _version?: number; } /** diff --git a/src/data/IRenderPipeline.ts b/src/data/IRenderPipeline.ts index 5b20fd0..9e63afa 100644 --- a/src/data/IRenderPipeline.ts +++ b/src/data/IRenderPipeline.ts @@ -37,4 +37,6 @@ export interface IRenderPipeline * 深度模板阶段描述。 */ readonly depthStencil?: IDepthStencilState; + + _version?: number; } diff --git a/src/data/IVertexState.ts b/src/data/IVertexState.ts index 8503d5c..628f27b 100644 --- a/src/data/IVertexState.ts +++ b/src/data/IVertexState.ts @@ -6,5 +6,5 @@ export interface IVertexState /** * 着色器代码。 */ - readonly code: string; + code: string; } \ No newline at end of file -- Gitee From bf3ced0059835e42182903580a70b7d67962fe02 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Feb 2025 22:07:30 +0800 Subject: [PATCH 002/105] vertexFormatMap --- src/Macro.ts | 119 +++++++++++++++++++++++ src/consts/vertexFormatMap.ts | 178 ++++++++++++++++++++++++++++++++++ src/data/IColorTargetState.ts | 2 +- src/data/IPrimitiveState.ts | 8 +- src/data/IRenderObject.ts | 13 ++- src/index.ts | 3 +- src/utils/VertexAttribute.ts | 27 ++++++ 7 files changed, 345 insertions(+), 5 deletions(-) create mode 100644 src/Macro.ts create mode 100644 src/consts/vertexFormatMap.ts create mode 100644 src/utils/VertexAttribute.ts diff --git a/src/Macro.ts b/src/Macro.ts new file mode 100644 index 0000000..eabd78e --- /dev/null +++ b/src/Macro.ts @@ -0,0 +1,119 @@ +/** + * 着色器宏定义 + */ +export interface ShaderMacro +{ + /** + * UV中的U缩放 + */ + SCALEU: number; + + /** + * UV中的V放 + */ + SCALEV: number; + + /** + * 光源数量 + */ + NUM_LIGHT: number; + + /** + * 点光源数量 + */ + NUM_POINTLIGHT: number; + + /** + * 方向光源数量 + */ + NUM_DIRECTIONALLIGHT: number; + + /** + * 生成投影的方向光源数量 + */ + NUM_DIRECTIONALLIGHT_CASTSHADOW: number; + + /** + * 生成投影的点光源数量 + */ + NUM_POINTLIGHT_CASTSHADOW: number; + + /** + * 聚光灯光源数量 + */ + NUM_SPOT_LIGHTS: number; + + /** + * 生成投影的聚光灯光源数量 + */ + NUM_SPOT_LIGHTS_CASTSHADOW: number; + + /** + * 骨骼关节数量 + */ + NUM_SKELETONJOINT: number; + /** + * + */ + RotationOrder: number; + /** + * 是否有漫反射贴图 + */ + HAS_DIFFUSE_SAMPLER: boolean; + /** + * 是否有法线贴图 + */ + HAS_NORMAL_SAMPLER: boolean; + /** + * 是否有镜面反射光泽图 + */ + HAS_SPECULAR_SAMPLER: boolean; + /** + * 是否有环境贴图 + */ + HAS_AMBIENT_SAMPLER: boolean; + /** + * 是否有骨骼动画 + */ + HAS_SKELETON_ANIMATION: boolean; + /** + * 是否有粒子动画 + */ + HAS_PARTICLE_ANIMATOR: boolean; + /** + * 是否为点渲染模式 + */ + IS_POINTS_MODE: boolean; + /** + * 是否有地形方法 + */ + HAS_TERRAIN_METHOD: boolean; + /** + * 使用合并地形贴图 + */ + USE_TERRAIN_MERGE: boolean; + /** + * 环境映射函数 + */ + HAS_ENV_METHOD: boolean; + + /** + * 是否卡通渲染 + */ + IS_CARTOON: Boolean; + + /** + * 是否抗锯齿 + */ + cartoon_Anti_aliasing: Boolean; + + /** + * 是否启用粒子系统纹理表动画模块 + */ + ENABLED_PARTICLE_SYSTEM_textureSheetAnimation: Boolean; + + /** + * 是否有颜色顶点数据 + */ + HAS_a_color: Boolean; +} diff --git a/src/consts/vertexFormatMap.ts b/src/consts/vertexFormatMap.ts new file mode 100644 index 0000000..d49e750 --- /dev/null +++ b/src/consts/vertexFormatMap.ts @@ -0,0 +1,178 @@ + +/** + * 顶点格式信息映射。 + */ +export const vertexFormatMap: Record = { + "uint8x2": { "numComponents": 2, "type": "UNSIGNED_BYTE", "normalized": false, "dataType": "unsigned int", "byteSize": 2, "wgslType": "vec2", "typedArrayConstructor": Uint8Array }, + "uint8x4": { "numComponents": 4, "type": "UNSIGNED_BYTE", "normalized": false, "dataType": "unsigned int", "byteSize": 4, "wgslType": "vec4", "typedArrayConstructor": Uint8Array }, + "sint8x2": { "numComponents": 2, "type": "BYTE", "normalized": false, "dataType": "signed int", "byteSize": 2, "wgslType": "vec2", "typedArrayConstructor": Int8Array }, + "sint8x4": { "numComponents": 4, "type": "BYTE", "normalized": false, "dataType": "signed int", "byteSize": 4, "wgslType": "vec4", "typedArrayConstructor": Int8Array }, + "unorm8x2": { "numComponents": 2, "type": "UNSIGNED_BYTE", "normalized": true, "dataType": "unsigned normalized", "byteSize": 2, "wgslType": "vec2", "typedArrayConstructor": Uint8Array }, + "unorm8x4": { "numComponents": 4, "type": "UNSIGNED_BYTE", "normalized": true, "dataType": "unsigned normalized", "byteSize": 4, "wgslType": "vec4", "typedArrayConstructor": Uint8Array }, + "snorm8x2": { "numComponents": 2, "type": "BYTE", "normalized": true, "dataType": "signed normalized", "byteSize": 2, "wgslType": "vec2", "typedArrayConstructor": Int8Array }, + "snorm8x4": { "numComponents": 4, "type": "BYTE", "normalized": true, "dataType": "signed normalized", "byteSize": 4, "wgslType": "vec4", "typedArrayConstructor": Int8Array }, + "uint16x2": { "numComponents": 2, "type": "UNSIGNED_SHORT", "normalized": false, "dataType": "unsigned int", "byteSize": 4, "wgslType": "vec2", "typedArrayConstructor": Uint16Array }, + "uint16x4": { "numComponents": 4, "type": "UNSIGNED_SHORT", "normalized": false, "dataType": "unsigned int", "byteSize": 8, "wgslType": "vec4", "typedArrayConstructor": Uint16Array }, + "sint16x2": { "numComponents": 2, "type": "SHORT", "normalized": false, "dataType": "signed int", "byteSize": 4, "wgslType": "vec2", "typedArrayConstructor": Int16Array }, + "sint16x4": { "numComponents": 4, "type": "SHORT", "normalized": false, "dataType": "signed int", "byteSize": 8, "wgslType": "vec4", "typedArrayConstructor": Int16Array }, + "unorm16x2": { "numComponents": 2, "type": "UNSIGNED_SHORT", "normalized": true, "dataType": "unsigned normalized", "byteSize": 4, "wgslType": "vec2", "typedArrayConstructor": Uint16Array }, + "unorm16x4": { "numComponents": 4, "type": "UNSIGNED_SHORT", "normalized": true, "dataType": "unsigned normalized", "byteSize": 8, "wgslType": "vec4", "typedArrayConstructor": Uint16Array }, + "snorm16x2": { "numComponents": 2, "type": "SHORT", "normalized": true, "dataType": "signed normalized", "byteSize": 4, "wgslType": "vec2", "typedArrayConstructor": Int16Array }, + "snorm16x4": { "numComponents": 4, "type": "SHORT", "normalized": true, "dataType": "signed normalized", "byteSize": 8, "wgslType": "vec4", "typedArrayConstructor": Int16Array }, + "float16x2": { "numComponents": 2, "type": "HALF_FLOAT", "normalized": false, "dataType": "float", "byteSize": 4, "wgslType": "vec2", "typedArrayConstructor": undefined, }, + "float16x4": { "numComponents": 4, "type": "HALF_FLOAT", "normalized": false, "dataType": "float", "byteSize": 8, "wgslType": "vec4", "typedArrayConstructor": undefined, }, + "float32": { "numComponents": 1, "type": "FLOAT", "normalized": false, "dataType": "float", "byteSize": 4, "wgslType": "f32", "typedArrayConstructor": Float32Array }, + "float32x2": { "numComponents": 2, "type": "FLOAT", "normalized": false, "dataType": "float", "byteSize": 8, "wgslType": "vec2", "typedArrayConstructor": Float32Array }, + "float32x3": { "numComponents": 3, "type": "FLOAT", "normalized": false, "dataType": "float", "byteSize": 12, "wgslType": "vec3", "typedArrayConstructor": Float32Array }, + "float32x4": { "numComponents": 4, "type": "FLOAT", "normalized": false, "dataType": "float", "byteSize": 16, "wgslType": "vec4", "typedArrayConstructor": Float32Array }, + "uint32": { "numComponents": 1, "type": "UNSIGNED_INT", "normalized": false, "dataType": "unsigned int", "byteSize": 4, "wgslType": "u32", "typedArrayConstructor": Uint32Array }, + "uint32x2": { "numComponents": 2, "type": "UNSIGNED_INT", "normalized": false, "dataType": "unsigned int", "byteSize": 8, "wgslType": "vec2", "typedArrayConstructor": Uint32Array }, + "uint32x3": { "numComponents": 3, "type": "UNSIGNED_INT", "normalized": false, "dataType": "unsigned int", "byteSize": 12, "wgslType": "vec3", "typedArrayConstructor": Uint32Array }, + "uint32x4": { "numComponents": 4, "type": "UNSIGNED_INT", "normalized": false, "dataType": "unsigned int", "byteSize": 16, "wgslType": "vec4", "typedArrayConstructor": Uint32Array }, + "sint32": { "numComponents": 1, "type": "INT", "normalized": false, "dataType": "signed int", "byteSize": 4, "wgslType": "i32", "typedArrayConstructor": Int32Array }, + "sint32x2": { "numComponents": 2, "type": "INT", "normalized": false, "dataType": "signed int", "byteSize": 8, "wgslType": "vec2", "typedArrayConstructor": Int32Array }, + "sint32x3": { "numComponents": 3, "type": "INT", "normalized": false, "dataType": "signed int", "byteSize": 12, "wgslType": "vec3", "typedArrayConstructor": Int32Array }, + "sint32x4": { "numComponents": 4, "type": "INT", "normalized": false, "dataType": "signed int", "byteSize": 16, "wgslType": "vec4", "typedArrayConstructor": Int32Array }, + "unorm10-10-10-2": { "numComponents": 4, "type": "UNSIGNED_INT_2_10_10_10_REV", "normalized": true, "dataType": "unsigned normalized", "byteSize": 4, "wgslType": "vec4", "typedArrayConstructor": Int32Array } +} + +/** + * 有类型数组构造器。 + */ +export type TypedArrayConstructor = Int8ArrayConstructor | Uint8ArrayConstructor | Int16ArrayConstructor | Uint16ArrayConstructor | Int32ArrayConstructor | Uint32ArrayConstructor | Float32ArrayConstructor; + +/** + * WebGPU顶点格式 + */ +export type GPUVertexFormat = + + | "uint8x2" + | "uint8x4" + | "sint8x2" + | "sint8x4" + | "unorm8x2" + | "unorm8x4" + | "snorm8x2" + | "snorm8x4" + | "uint16x2" + | "uint16x4" + | "sint16x2" + | "sint16x4" + | "unorm16x2" + | "unorm16x4" + | "snorm16x2" + | "snorm16x4" + | "float16x2" + | "float16x4" + | "float32" + | "float32x2" + | "float32x3" + | "float32x4" + | "uint32" + | "uint32x2" + | "uint32x3" + | "uint32x4" + | "sint32" + | "sint32x2" + | "sint32x3" + | "sint32x4" + | "unorm10-10-10-2"; + +/** + * GPU顶点数据类型 + */ +export type IVertexDataType = + | "unsigned int" + | "signed int" + | "unsigned normalized" + | "signed normalized" + | "float" + ; + +/** + * 顶点数据在WGSL中的类型。 + */ +export type WGSLVertexType = + | "vec2" + | "vec4" + | "vec2" + | "vec4" + | "vec2" + | "vec4" + | "vec2" + | "vec4" + | "f32" + | "vec3" + | "u32" + | "vec3" + | "i32" + | "vec3" + ; + +/** + * 属性缓冲数据类型 + * + * A GLenum specifying the data type of each component in the array. Possible values: + * + * * gl.BYTE: signed 8-bit integer, with values in [-128, 127] + * * gl.SHORT: signed 16-bit integer, with values in [-32768, 32767] + * * gl.UNSIGNED_BYTE: unsigned 8-bit integer, with values in [0, 255] + * * gl.UNSIGNED_SHORT: unsigned 16-bit integer, with values in [0,65535] + * * gl.FLOAT: 32-bit IEEE floating point number + * + * When using a WebGL 2 context, the following values are available additionally: + * + * * gl.HALF_FLOAT: 16-bit IEEE floating point number + * * gl.INT: 32-bit signed binary integer + * * gl.UNSIGNED_INT: 32-bit unsigned binary integer + * * gl.INT_2_10_10_10_REV: 32-bit signed integer with values in [-512, 511] + * * gl.UNSIGNED_INT_2_10_10_10_REV: 32-bit unsigned integer with values in [0, 1023] + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/vertexAttribPointer + */ +export type IGLVertexAttributeTypes = "FLOAT" | "BYTE" | "SHORT" | "UNSIGNED_BYTE" | "UNSIGNED_SHORT" // WebGL1 + | "HALF_FLOAT" | "INT" | "UNSIGNED_INT" | "INT_2_10_10_10_REV" | "UNSIGNED_INT_2_10_10_10_REV"; // WebGL2 + + +/** + * 顶点格式信息 + */ +export type IVertexFormatInfo = { + + /** + * 部件数量。 + */ + numComponents: 1 | 2 | 3 | 4, + + /** + * 属性缓冲数据类型 + * + * 默认从Buffer数据中获取，如果未取到则默认为 "FLOAT" 。 + */ + type: IGLVertexAttributeTypes; + + /** + * 数据类型。 + */ + dataType: IVertexDataType, + + /** + * 所占字节尺寸。 + */ + byteSize: 2 | 4 | 8 | 12 | 16, + + /** + * 在着色器中对应类型。 + */ + wgslType: WGSLVertexType, + + /** + * 对应类型数组构造器。 + */ + typedArrayConstructor: TypedArrayConstructor, + + /** + * 是否标准化。 + */ + normalized: boolean; +}; diff --git a/src/data/IColorTargetState.ts b/src/data/IColorTargetState.ts index 3337795..27071ee 100644 --- a/src/data/IColorTargetState.ts +++ b/src/data/IColorTargetState.ts @@ -15,7 +15,7 @@ export interface IColorTargetState * * 默认 `undefined`，表示不进行混合。 */ - readonly blend?: IBlendState; + blend?: IBlendState; /** * 控制那些颜色分量是否可以被写入到颜色中。 diff --git a/src/data/IPrimitiveState.ts b/src/data/IPrimitiveState.ts index ba7b43b..5bc28db 100644 --- a/src/data/IPrimitiveState.ts +++ b/src/data/IPrimitiveState.ts @@ -17,8 +17,14 @@ export interface IPrimitiveState * * `triangle-strip` 绘制三角形条带。 * * 默认 `triangle-list` ,默认每三个顶点绘制一个三角形。 + * + * 图形拓扑结构。 + * + * 以下仅在WebGL生效 + * * LINE_LOOP 绘制循环连线。 + * * TRIANGLE_FAN 绘制三角扇形。 */ - readonly topology?: IPrimitiveTopology; + topology?: IPrimitiveTopology; /** * Defines which polygon orientation will be culled, if any. diff --git a/src/data/IRenderObject.ts b/src/data/IRenderObject.ts index 90102cc..8a19fea 100644 --- a/src/data/IRenderObject.ts +++ b/src/data/IRenderObject.ts @@ -1,3 +1,4 @@ +import { ShaderMacro } from "../Macro"; import { IRenderPipeline } from "./IRenderPipeline"; import { IScissorRect } from "./IScissorRect"; import { IVertexAttributes } from "./IVertexAttributes"; @@ -29,7 +30,7 @@ export interface IRenderObject /** * 渲染管线描述。 */ - readonly pipeline: IRenderPipeline; + pipeline: IRenderPipeline; /** * 顶点属性数据映射。 @@ -61,6 +62,11 @@ export interface IRenderObject readonly drawIndexed?: IDrawIndexed; _version?: number; + + /** + * shader 中的 宏 + */ + shaderMacro?: ShaderMacro; } /** @@ -164,5 +170,8 @@ export interface IBufferBinding readonly bufferView?: TypedArray; } -export type IUniformDataItem = number | number[] | number[][] | TypedArray | TypedArray[]; +export type IUniformDataItem = number | number[] | number[][] | TypedArray | TypedArray[] + | { toArray(): number[] | Float32Array } + | { toArray(): number[] | Float32Array }[] + ; export type IBufferBindingItem = IUniformDataItem | { [key: string]: IBufferBindingItem }; \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index 98fdad1..1703228 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,3 +1,5 @@ +export * from "./consts/vertexFormatMap"; + export * from "./data/IBlendComponent"; export * from "./data/IBlendState"; export * from "./data/IBuffer"; @@ -31,4 +33,3 @@ export * from "./data/UnReadonly"; export * from "./utils/getBlendConstantColor"; export * from "./utils/getTexImageSourceSize"; export * from "./utils/getTextureBytesPerPixel"; - diff --git a/src/utils/VertexAttribute.ts b/src/utils/VertexAttribute.ts new file mode 100644 index 0000000..67772a9 --- /dev/null +++ b/src/utils/VertexAttribute.ts @@ -0,0 +1,27 @@ +import { IVertexAttribute, IVertexFormat } from "../data/IVertexAttributes"; + +export class VertexAttribute +{ + static getAttributeCount(attribute: IVertexAttribute) + { + if (attribute.stepMode === "instance") + { + return 1; + } + + attribute.data + attribute.offset + attribute.format + attribute.arrayStride + attribute.stepMode + + const itemSize = this.getAttributeItemSize(attribute.format); + + + } + + static getAttributeItemSize(format: IVertexFormat) + { + return 0; + } +} -- Gitee From d89d33f11b30ebc1b6756a27f98c7b232b619589 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Feb 2025 22:35:17 +0800 Subject: [PATCH 003/105] VertexAttribute.getVertexCount --- src/consts/vertexFormatMap.ts | 46 ++++------------------------------- src/data/IPrimitiveState.ts | 3 +++ src/data/IVertexAttributes.ts | 3 +++ src/index.ts | 1 + src/utils/VertexAttribute.ts | 30 ++++++++++++----------- 5 files changed, 28 insertions(+), 55 deletions(-) diff --git a/src/consts/vertexFormatMap.ts b/src/consts/vertexFormatMap.ts index d49e750..dfc4d0d 100644 --- a/src/consts/vertexFormatMap.ts +++ b/src/consts/vertexFormatMap.ts @@ -1,8 +1,9 @@ +import { IVertexFormat } from "../data/IVertexAttributes"; /** - * 顶点格式信息映射。 + * 顶点属性格式信息映射。 */ -export const vertexFormatMap: Record = { +export const vertexFormatMap: Record = { "uint8x2": { "numComponents": 2, "type": "UNSIGNED_BYTE", "normalized": false, "dataType": "unsigned int", "byteSize": 2, "wgslType": "vec2", "typedArrayConstructor": Uint8Array }, "uint8x4": { "numComponents": 4, "type": "UNSIGNED_BYTE", "normalized": false, "dataType": "unsigned int", "byteSize": 4, "wgslType": "vec4", "typedArrayConstructor": Uint8Array }, "sint8x2": { "numComponents": 2, "type": "BYTE", "normalized": false, "dataType": "signed int", "byteSize": 2, "wgslType": "vec2", "typedArrayConstructor": Int8Array }, @@ -41,43 +42,6 @@ export const vertexFormatMap: Record = { */ export type TypedArrayConstructor = Int8ArrayConstructor | Uint8ArrayConstructor | Int16ArrayConstructor | Uint16ArrayConstructor | Int32ArrayConstructor | Uint32ArrayConstructor | Float32ArrayConstructor; -/** - * WebGPU顶点格式 - */ -export type GPUVertexFormat = - - | "uint8x2" - | "uint8x4" - | "sint8x2" - | "sint8x4" - | "unorm8x2" - | "unorm8x4" - | "snorm8x2" - | "snorm8x4" - | "uint16x2" - | "uint16x4" - | "sint16x2" - | "sint16x4" - | "unorm16x2" - | "unorm16x4" - | "snorm16x2" - | "snorm16x4" - | "float16x2" - | "float16x4" - | "float32" - | "float32x2" - | "float32x3" - | "float32x4" - | "uint32" - | "uint32x2" - | "uint32x3" - | "uint32x4" - | "sint32" - | "sint32x2" - | "sint32x3" - | "sint32x4" - | "unorm10-10-10-2"; - /** * GPU顶点数据类型 */ @@ -135,9 +99,9 @@ export type IGLVertexAttributeTypes = "FLOAT" | "BYTE" | "SHORT" | "UNSIGNED_BYT /** - * 顶点格式信息 + * 顶点属性格式信息 */ -export type IVertexFormatInfo = { +export type IVertexAttributeFormatInfo = { /** * 部件数量。 diff --git a/src/data/IPrimitiveState.ts b/src/data/IPrimitiveState.ts index 5bc28db..41ec6b2 100644 --- a/src/data/IPrimitiveState.ts +++ b/src/data/IPrimitiveState.ts @@ -47,6 +47,9 @@ export interface IPrimitiveState readonly frontFace?: IFrontFace; } +/** + * 图元拓扑结构。 + */ export type IPrimitiveTopology = IPrimitiveTopologyMap[keyof IPrimitiveTopologyMap]; export interface IPrimitiveTopologyMap diff --git a/src/data/IVertexAttributes.ts b/src/data/IVertexAttributes.ts index 4d399fc..d934df2 100644 --- a/src/data/IVertexAttributes.ts +++ b/src/data/IVertexAttributes.ts @@ -56,6 +56,9 @@ export type IVertexDataTypes = | Float32Array | Uint8Array | Int8Array; +/** + * 顶点数据格式。 + */ export type IVertexFormat = | "uint8x2" | "uint8x4" diff --git a/src/index.ts b/src/index.ts index 1703228..f2efba3 100644 --- a/src/index.ts +++ b/src/index.ts @@ -33,3 +33,4 @@ export * from "./data/UnReadonly"; export * from "./utils/getBlendConstantColor"; export * from "./utils/getTexImageSourceSize"; export * from "./utils/getTextureBytesPerPixel"; +export * from "./utils/VertexAttribute"; diff --git a/src/utils/VertexAttribute.ts b/src/utils/VertexAttribute.ts index 67772a9..c49be9f 100644 --- a/src/utils/VertexAttribute.ts +++ b/src/utils/VertexAttribute.ts @@ -1,27 +1,29 @@ -import { IVertexAttribute, IVertexFormat } from "../data/IVertexAttributes"; +import { vertexFormatMap as vertexAttributeFormatMap } from "../consts/vertexFormatMap"; +import { IVertexAttribute } from "../data/IVertexAttributes"; export class VertexAttribute { - static getAttributeCount(attribute: IVertexAttribute) + /** + * 获取顶点属性数据的顶点数量。 + * + * @param attribute 顶点属性数据。 + * @returns + */ + static getVertexCount(attribute: IVertexAttribute) { if (attribute.stepMode === "instance") { return 1; } - attribute.data - attribute.offset - attribute.format - attribute.arrayStride - attribute.stepMode + // 单个顶点属性数据尺寸。 + const attributeSize = vertexAttributeFormatMap[attribute.format].byteSize; + const offset = attribute.offset || 0; + // 一个顶点数据尺寸，可能包括多个顶点属性（例如一个position 和 uv 共 3*4 + 2*4 = 20 字节）。 + const arrayStride = attribute.arrayStride || attributeSize; - const itemSize = this.getAttributeItemSize(attribute.format); + const attributeCount = (attribute.data.byteLength - offset) / arrayStride; - - } - - static getAttributeItemSize(format: IVertexFormat) - { - return 0; + return attributeCount; } } -- Gitee From d0df8f0adaf618a2504ed14bcb6f49b647e11f8d Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 21 Feb 2025 22:50:18 +0800 Subject: [PATCH 004/105] IRenderObject.draw: IDrawVertex | IDrawIndexed --- src/data/IRenderObject.ts | 24 +++++++++++++++--------- 1 file changed, 15 insertions(+), 9 deletions(-) diff --git a/src/data/IRenderObject.ts b/src/data/IRenderObject.ts index 8a19fea..071cc23 100644 --- a/src/data/IRenderObject.ts +++ b/src/data/IRenderObject.ts @@ -48,18 +48,11 @@ export interface IRenderObject readonly uniforms?: IUniforms; /** - * 根据顶点数据绘制图元。 + * 绘制。 * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex */ - readonly drawVertex?: IDrawVertex; - - /** - * 根据索引数据绘制图元。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements - */ - readonly drawIndexed?: IDrawIndexed; + readonly draw: IDrawVertex | IDrawIndexed; _version?: number; @@ -84,6 +77,11 @@ export type IIndicesDataTypes = Uint16Array | Uint32Array; */ export interface IDrawVertex { + /** + * 数据类型。 + */ + readonly __type: "DrawVertex"; + /** * The number of vertices to draw. */ @@ -106,9 +104,17 @@ export interface IDrawVertex /** * 根据索引数据绘制图元。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements + * @see GPURenderCommandsMixin.drawIndexed */ export interface IDrawIndexed { + /** + * 数据类型。 + */ + readonly __type: "DrawIndexed"; + /** * The number of indices to draw. * -- Gitee From 2f06447793ccc8336762ed8899a5a1501ba4a8f9 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 21 Feb 2025 23:01:47 +0800 Subject: [PATCH 005/105] gpuFragmentState && --- src/data/IRenderObject.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/data/IRenderObject.ts b/src/data/IRenderObject.ts index 071cc23..46796c3 100644 --- a/src/data/IRenderObject.ts +++ b/src/data/IRenderObject.ts @@ -52,7 +52,7 @@ export interface IRenderObject * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex */ - readonly draw: IDrawVertex | IDrawIndexed; + readonly draw: IDraw; _version?: number; @@ -62,6 +62,8 @@ export interface IRenderObject shaderMacro?: ShaderMacro; } +export type IDraw = IDrawVertex | IDrawIndexed; + /** * 顶点索引数据类型。 */ -- Gitee From 60f77a25454392257d47c0972905fe63d4f54159 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 21 Feb 2025 23:38:37 +0800 Subject: [PATCH 006/105] IRenderObject.geometry: IGeometry --- src/data/IGeometry.ts | 109 +++++++++++++++++++++++++++++ src/data/IRenderObject.ts | 142 ++------------------------------------ src/data/IUniforms.ts | 46 ++++++++++++ src/index.ts | 3 + 4 files changed, 162 insertions(+), 138 deletions(-) create mode 100644 src/data/IGeometry.ts create mode 100644 src/data/IUniforms.ts diff --git a/src/data/IGeometry.ts b/src/data/IGeometry.ts new file mode 100644 index 0000000..fec47ea --- /dev/null +++ b/src/data/IGeometry.ts @@ -0,0 +1,109 @@ +import { IVertexAttributes } from "./IVertexAttributes"; + +/** + * 几何数据。 + * + * 包含以下数据： + * - 顶点属性数据 + * - 顶点索引数据 + * - 如何渲染 + * - 拓扑结构 + * - 正面 + */ +export interface IGeometry +{ + /** + * 顶点属性数据映射。 + */ + vertices?: IVertexAttributes; + + /** + * 顶点索引数据。 + */ + indices?: IIndicesDataTypes; + + /** + * 绘制。 + */ + readonly draw: IDraw; +} + +/** + * 顶点索引数据类型。 + */ +export type IIndicesDataTypes = Uint16Array | Uint32Array; + +/** + * 绘制图形。 + */ +export type IDraw = IDrawVertex | IDrawIndexed; + +/** + * Draws primitives. + * + * 根据顶点数据绘制图元。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex + * @see GPURenderCommandsMixin.draw + */ +export interface IDrawVertex +{ + /** + * 数据类型。 + */ + readonly __type: "DrawVertex"; + + /** + * The number of vertices to draw. + */ + readonly vertexCount: number; + + /** + * The number of instances to draw. + * + * 默认为 1 。 + */ + readonly instanceCount?: number; + + /** + * Offset into the vertex buffers, in vertices, to begin drawing from. + * + * 默认为 0。 + */ + readonly firstVertex?: number; +} + +/** + * 根据索引数据绘制图元。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements + * @see GPURenderCommandsMixin.drawIndexed + */ +export interface IDrawIndexed +{ + /** + * 数据类型。 + */ + readonly __type: "DrawIndexed"; + + /** + * The number of indices to draw. + * + * 绘制的顶点索引数量。 + */ + readonly indexCount: number; + + /** + * The number of instances to draw. + * + * 默认为 1 。 + */ + readonly instanceCount?: number; + + /** + * Offset into the index buffer, in indices, begin drawing from. + * + * 默认为 0 。 + */ + readonly firstIndex?: number; +} diff --git a/src/data/IRenderObject.ts b/src/data/IRenderObject.ts index 46796c3..f443b1c 100644 --- a/src/data/IRenderObject.ts +++ b/src/data/IRenderObject.ts @@ -1,9 +1,9 @@ import { ShaderMacro } from "../Macro"; +import { IGeometry } from "./IGeometry"; import { IRenderPipeline } from "./IRenderPipeline"; import { IScissorRect } from "./IScissorRect"; -import { IVertexAttributes } from "./IVertexAttributes"; +import { IUniforms } from "./IUniforms"; import { IViewport } from "./IViewport"; -import { TypedArray } from "./TypedArray"; /** * 渲染对象，包含一次渲染时包含的所有数据。 @@ -33,27 +33,15 @@ export interface IRenderObject pipeline: IRenderPipeline; /** - * 顶点属性数据映射。 + * 渲染几何数据。 */ - vertices?: IVertexAttributes; - - /** - * 顶点索引数据。 - */ - indices?: IIndicesDataTypes; + geometry: IGeometry; /** * Uniform变量数据 */ readonly uniforms?: IUniforms; - /** - * 绘制。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex - */ - readonly draw: IDraw; - _version?: number; /** @@ -61,125 +49,3 @@ export interface IRenderObject */ shaderMacro?: ShaderMacro; } - -export type IDraw = IDrawVertex | IDrawIndexed; - -/** - * 顶点索引数据类型。 - */ -export type IIndicesDataTypes = Uint16Array | Uint32Array; - -/** - * Draws primitives. - * - * 根据顶点数据绘制图元。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex - * @see GPURenderCommandsMixin.draw - */ -export interface IDrawVertex -{ - /** - * 数据类型。 - */ - readonly __type: "DrawVertex"; - - /** - * The number of vertices to draw. - */ - readonly vertexCount: number; - - /** - * The number of instances to draw. - * - * 默认为 1 。 - */ - readonly instanceCount?: number; - - /** - * Offset into the vertex buffers, in vertices, to begin drawing from. - * - * 默认为 0。 - */ - readonly firstVertex?: number; -} - -/** - * 根据索引数据绘制图元。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements - * @see GPURenderCommandsMixin.drawIndexed - */ -export interface IDrawIndexed -{ - /** - * 数据类型。 - */ - readonly __type: "DrawIndexed"; - - /** - * The number of indices to draw. - * - * 绘制的顶点索引数量。 - */ - readonly indexCount: number; - - /** - * The number of instances to draw. - * - * 默认为 1 。 - */ - readonly instanceCount?: number; - - /** - * Offset into the index buffer, in indices, begin drawing from. - * - * 默认为 0 。 - */ - readonly firstIndex?: number; -} - -/** - * Uniform 类型 - */ -export type IUniformType = IUniformTypeMap[keyof IUniformTypeMap]; - -/** - * Uniform 数据 - */ -export interface IUniforms -{ - [key: string]: IUniformType; -} - -export interface IUniformTypeMap -{ - /** - * 缓冲区绑定。 - */ - IBufferBinding: IBufferBinding; -} - -/** - * 缓冲区绑定。 - * - * WebGL 统一块(Uniform Block) 数据 - * WebGPU 缓冲区绑定（GPUBufferBinding） - * - * @see GPUBufferBinding - */ -export interface IBufferBinding -{ - [name: string]: IBufferBindingItem; - - /** - * 如果未设置引擎将自动生成。 - */ - readonly bufferView?: TypedArray; -} - -export type IUniformDataItem = number | number[] | number[][] | TypedArray | TypedArray[] - | { toArray(): number[] | Float32Array } - | { toArray(): number[] | Float32Array }[] - ; -export type IBufferBindingItem = IUniformDataItem | { [key: string]: IBufferBindingItem }; \ No newline at end of file diff --git a/src/data/IUniforms.ts b/src/data/IUniforms.ts new file mode 100644 index 0000000..fadb2a7 --- /dev/null +++ b/src/data/IUniforms.ts @@ -0,0 +1,46 @@ +import { TypedArray } from "./TypedArray"; + +/** + * Uniform 类型 + */ +export type IUniformType = IUniformTypeMap[keyof IUniformTypeMap]; + +/** + * Uniform 数据 + */ +export interface IUniforms +{ + [key: string]: IUniformType; +} + +export interface IUniformTypeMap +{ + /** + * 缓冲区绑定。 + */ + IBufferBinding: IBufferBinding; +} + +/** + * 缓冲区绑定。 + * + * WebGL 统一块(Uniform Block) 数据 + * WebGPU 缓冲区绑定（GPUBufferBinding） + * + * @see GPUBufferBinding + */ +export interface IBufferBinding +{ + [name: string]: IBufferBindingItem; + + /** + * 如果未设置引擎将自动生成。 + */ + readonly bufferView?: TypedArray; +} + +export type IUniformDataItem = number | number[] | number[][] | TypedArray | TypedArray[] + | { toArray(): number[] | Float32Array } + | { toArray(): number[] | Float32Array }[] + ; +export type IBufferBindingItem = IUniformDataItem | { [key: string]: IBufferBindingItem }; \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index f2efba3..46fe096 100644 --- a/src/index.ts +++ b/src/index.ts @@ -11,6 +11,7 @@ export * from "./data/ICopyBufferToBuffer"; export * from "./data/ICopyTextureToTexture"; export * from "./data/IDepthStencilState"; export * from "./data/IFragmentState"; +export * from "./data/IGeometry"; export * from "./data/IPrimitiveState"; export * from "./data/IRenderObject"; export * from "./data/IRenderPass"; @@ -24,6 +25,7 @@ export * from "./data/IStencilFaceState"; export * from "./data/ISubmit"; export * from "./data/ITexture"; export * from "./data/ITextureView"; +export * from "./data/IUniforms"; export * from "./data/IVertexAttributes"; export * from "./data/IVertexState"; export * from "./data/IViewport"; @@ -34,3 +36,4 @@ export * from "./utils/getBlendConstantColor"; export * from "./utils/getTexImageSourceSize"; export * from "./utils/getTextureBytesPerPixel"; export * from "./utils/VertexAttribute"; + -- Gitee From fac644d54207eafc546d55913e82838540a6d42d Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 00:15:28 +0800 Subject: [PATCH 007/105] IGeometry.primitive?: IPrimitiveState --- src/data/IGeometry.ts | 8 ++++++++ src/data/IRenderPipeline.ts | 7 ------- 2 files changed, 8 insertions(+), 7 deletions(-) diff --git a/src/data/IGeometry.ts b/src/data/IGeometry.ts index fec47ea..016a914 100644 --- a/src/data/IGeometry.ts +++ b/src/data/IGeometry.ts @@ -1,3 +1,4 @@ +import { IPrimitiveState } from "./IPrimitiveState"; import { IVertexAttributes } from "./IVertexAttributes"; /** @@ -12,6 +13,13 @@ import { IVertexAttributes } from "./IVertexAttributes"; */ export interface IGeometry { + /** + * Describes the primitive-related properties of the pipeline. + * + * 图元拓扑结构。 + */ + readonly primitive?: IPrimitiveState; + /** * 顶点属性数据映射。 */ diff --git a/src/data/IRenderPipeline.ts b/src/data/IRenderPipeline.ts index 9e63afa..27b5b68 100644 --- a/src/data/IRenderPipeline.ts +++ b/src/data/IRenderPipeline.ts @@ -16,13 +16,6 @@ export interface IRenderPipeline */ readonly label?: string; - /** - * Describes the primitive-related properties of the pipeline. - * - * 图元拓扑结构。 - */ - readonly primitive?: IPrimitiveState; - /** * 顶点着色器阶段描述。 */ -- Gitee From 92fc2f63a072fdb7c4906898c3753fccdb394a89 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 01:19:30 +0800 Subject: [PATCH 008/105] Geometry --- src/consts/vertexFormatMap.ts | 2 +- src/data/{IGeometry.ts => Geometry.ts} | 75 +++++++++++++++++-- src/data/IRenderObject.ts | 4 +- src/data/IRenderPipeline.ts | 2 +- .../{IPrimitiveState.ts => PrimitiveState.ts} | 8 +- ...ertexAttributes.ts => VertexAttributes.ts} | 33 +++++++- src/index.ts | 7 +- src/utils/VertexAttribute.ts | 29 ------- 8 files changed, 109 insertions(+), 51 deletions(-) rename src/data/{IGeometry.ts => Geometry.ts} (50%) rename src/data/{IPrimitiveState.ts => PrimitiveState.ts} (91%) rename src/data/{IVertexAttributes.ts => VertexAttributes.ts} (64%) delete mode 100644 src/utils/VertexAttribute.ts diff --git a/src/consts/vertexFormatMap.ts b/src/consts/vertexFormatMap.ts index dfc4d0d..6442e89 100644 --- a/src/consts/vertexFormatMap.ts +++ b/src/consts/vertexFormatMap.ts @@ -1,4 +1,4 @@ -import { IVertexFormat } from "../data/IVertexAttributes"; +import { IVertexFormat } from "../data/VertexAttributes"; /** * 顶点属性格式信息映射。 diff --git a/src/data/IGeometry.ts b/src/data/Geometry.ts similarity index 50% rename from src/data/IGeometry.ts rename to src/data/Geometry.ts index 016a914..0fe18c3 100644 --- a/src/data/IGeometry.ts +++ b/src/data/Geometry.ts @@ -1,5 +1,5 @@ -import { IPrimitiveState } from "./IPrimitiveState"; -import { IVertexAttributes } from "./IVertexAttributes"; +import { PrimitiveState } from "./PrimitiveState"; +import { VertexAttribute, VertexAttributes } from "./VertexAttributes"; /** * 几何数据。 @@ -9,21 +9,20 @@ import { IVertexAttributes } from "./IVertexAttributes"; * - 顶点索引数据 * - 如何渲染 * - 拓扑结构 - * - 正面 */ -export interface IGeometry +export class Geometry { /** * Describes the primitive-related properties of the pipeline. * * 图元拓扑结构。 */ - readonly primitive?: IPrimitiveState; + primitive?: PrimitiveState = new PrimitiveState(); /** * 顶点属性数据映射。 */ - vertices?: IVertexAttributes; + vertices?: VertexAttributes = {}; /** * 顶点索引数据。 @@ -33,7 +32,69 @@ export interface IGeometry /** * 绘制。 */ - readonly draw: IDraw; + get draw(): IDraw + { + if (this._draw) return this._draw; + + const instanceCount = this.getInstanceCount(); + + if (this.indices) + { + return { + __type: "DrawIndexed", + indexCount: this.indices.length, + firstIndex: 0, + instanceCount, + }; + } + + return { + __type: "DrawVertex", + vertexCount: this.getNumVertex(), + instanceCount, + }; + } + set draw(value: IDraw) + { + this._draw = value; + } + protected _draw?: IDraw; + + /** + * 获取顶点数量。 + * + * @returns 顶点数量。 + */ + getNumVertex?() + { + const attributes = this.vertices; + const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => v.stepMode !== "instance"); + + const count = VertexAttribute.getVertexCount(vertexList[0]); + + // 验证所有顶点属性数据的顶点数量一致。 + console.assert(vertexList.length > 0 && vertexList.every((v) => count === VertexAttribute.getVertexCount(v))); + + return count; + } + + /** + * 获取实例数量。 + * + * @returns 实例数量。 + */ + getInstanceCount?() + { + const attributes = this.vertices; + const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => v.stepMode === "instance"); + + const count = VertexAttribute.getVertexCount(vertexList[0]); + + // 验证所有顶点属性数据的顶点数量一致。 + console.assert(vertexList.length > 0 && vertexList.every((v) => count === VertexAttribute.getVertexCount(v))); + + return count; + } } /** diff --git a/src/data/IRenderObject.ts b/src/data/IRenderObject.ts index f443b1c..1fd00e9 100644 --- a/src/data/IRenderObject.ts +++ b/src/data/IRenderObject.ts @@ -1,5 +1,5 @@ import { ShaderMacro } from "../Macro"; -import { IGeometry } from "./IGeometry"; +import { Geometry } from "./Geometry"; import { IRenderPipeline } from "./IRenderPipeline"; import { IScissorRect } from "./IScissorRect"; import { IUniforms } from "./IUniforms"; @@ -35,7 +35,7 @@ export interface IRenderObject /** * 渲染几何数据。 */ - geometry: IGeometry; + geometry: Geometry; /** * Uniform变量数据 diff --git a/src/data/IRenderPipeline.ts b/src/data/IRenderPipeline.ts index 27b5b68..1e4e3a6 100644 --- a/src/data/IRenderPipeline.ts +++ b/src/data/IRenderPipeline.ts @@ -1,6 +1,6 @@ import { IDepthStencilState } from "./IDepthStencilState"; import { IFragmentState } from "./IFragmentState"; -import { IPrimitiveState } from "./IPrimitiveState"; +import { PrimitiveState } from "./PrimitiveState"; import { IVertexState } from "./IVertexState"; /** diff --git a/src/data/IPrimitiveState.ts b/src/data/PrimitiveState.ts similarity index 91% rename from src/data/IPrimitiveState.ts rename to src/data/PrimitiveState.ts index 41ec6b2..f774d38 100644 --- a/src/data/IPrimitiveState.ts +++ b/src/data/PrimitiveState.ts @@ -5,7 +5,7 @@ * * `stripIndexFormat` 将由引擎自动设置。 */ -export interface IPrimitiveState +export class PrimitiveState { /** * The type of primitive to be constructed from the vertex inputs. @@ -24,7 +24,7 @@ export interface IPrimitiveState * * LINE_LOOP 绘制循环连线。 * * TRIANGLE_FAN 绘制三角扇形。 */ - topology?: IPrimitiveTopology; + topology?: IPrimitiveTopology = "triangle-list"; /** * Defines which polygon orientation will be culled, if any. @@ -37,14 +37,14 @@ export interface IPrimitiveState * * `front` 剔除正面 * * `back` 剔除背面 */ - readonly cullFace?: ICullFace; + cullFace?: ICullFace = "none"; /** * Defines which polygons are considered front-facing. * * 正向方向。默认 "ccw"，表示三角形逆时针方向为正面。 */ - readonly frontFace?: IFrontFace; + frontFace?: IFrontFace = "ccw"; } /** diff --git a/src/data/IVertexAttributes.ts b/src/data/VertexAttributes.ts similarity index 64% rename from src/data/IVertexAttributes.ts rename to src/data/VertexAttributes.ts index d934df2..36ba160 100644 --- a/src/data/IVertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -1,15 +1,17 @@ +import { vertexFormatMap } from "../consts/vertexFormatMap"; + /** * 顶点属性数据映射。 */ -export interface IVertexAttributes +export class VertexAttributes { - [name: string]: IVertexAttribute; + [name: string]: VertexAttribute; } /** * 顶点属性数据。 */ -export interface IVertexAttribute +export class VertexAttribute { /** * 顶点数据。 @@ -43,6 +45,31 @@ export interface IVertexAttribute * 默认 `"vertex"` 。 */ readonly stepMode?: IVertexStepMode; + + + /** + * 获取顶点属性数据的顶点数量。 + * + * @param attribute 顶点属性数据。 + * @returns + */ + static getVertexCount(attribute: VertexAttribute) + { + if (attribute.stepMode === "instance") + { + return 1; + } + + // 单个顶点属性数据尺寸。 + const attributeSize = vertexFormatMap[attribute.format].byteSize; + const offset = attribute.offset || 0; + // 一个顶点数据尺寸，可能包括多个顶点属性（例如一个position 和 uv 共 3*4 + 2*4 = 20 字节）。 + const arrayStride = attribute.arrayStride || attributeSize; + + const attributeCount = (attribute.data.byteLength - offset) / arrayStride; + + return attributeCount; + } } export type IVertexStepMode = "vertex" | "instance"; diff --git a/src/index.ts b/src/index.ts index 46fe096..0e3f997 100644 --- a/src/index.ts +++ b/src/index.ts @@ -11,8 +11,8 @@ export * from "./data/ICopyBufferToBuffer"; export * from "./data/ICopyTextureToTexture"; export * from "./data/IDepthStencilState"; export * from "./data/IFragmentState"; -export * from "./data/IGeometry"; -export * from "./data/IPrimitiveState"; +export * from "./data/Geometry"; +export * from "./data/PrimitiveState"; export * from "./data/IRenderObject"; export * from "./data/IRenderPass"; export * from "./data/IRenderPassColorAttachment"; @@ -26,7 +26,7 @@ export * from "./data/ISubmit"; export * from "./data/ITexture"; export * from "./data/ITextureView"; export * from "./data/IUniforms"; -export * from "./data/IVertexAttributes"; +export * from "./data/VertexAttributes"; export * from "./data/IVertexState"; export * from "./data/IViewport"; export * from "./data/TypedArray"; @@ -35,5 +35,4 @@ export * from "./data/UnReadonly"; export * from "./utils/getBlendConstantColor"; export * from "./utils/getTexImageSourceSize"; export * from "./utils/getTextureBytesPerPixel"; -export * from "./utils/VertexAttribute"; diff --git a/src/utils/VertexAttribute.ts b/src/utils/VertexAttribute.ts deleted file mode 100644 index c49be9f..0000000 --- a/src/utils/VertexAttribute.ts +++ /dev/null @@ -1,29 +0,0 @@ -import { vertexFormatMap as vertexAttributeFormatMap } from "../consts/vertexFormatMap"; -import { IVertexAttribute } from "../data/IVertexAttributes"; - -export class VertexAttribute -{ - /** - * 获取顶点属性数据的顶点数量。 - * - * @param attribute 顶点属性数据。 - * @returns - */ - static getVertexCount(attribute: IVertexAttribute) - { - if (attribute.stepMode === "instance") - { - return 1; - } - - // 单个顶点属性数据尺寸。 - const attributeSize = vertexAttributeFormatMap[attribute.format].byteSize; - const offset = attribute.offset || 0; - // 一个顶点数据尺寸，可能包括多个顶点属性（例如一个position 和 uv 共 3*4 + 2*4 = 20 字节）。 - const arrayStride = attribute.arrayStride || attributeSize; - - const attributeCount = (attribute.data.byteLength - offset) / arrayStride; - - return attributeCount; - } -} -- Gitee From 875da52361c59d7308a63dfd1feb26008b74ebda Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 01:22:37 +0800 Subject: [PATCH 009/105] Geometry --- src/data/PrimitiveState.ts | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/data/PrimitiveState.ts b/src/data/PrimitiveState.ts index f774d38..edba6da 100644 --- a/src/data/PrimitiveState.ts +++ b/src/data/PrimitiveState.ts @@ -61,6 +61,11 @@ export interface IPrimitiveTopologyMap "triangle-strip": "triangle-strip", } +/** + * * `FRONT_AND_BACK` 剔除正面与背面，仅在WebGL中生效！ + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/cullFace + */ export type ICullFace = ICullFaceMap[keyof ICullFaceMap]; export interface ICullFaceMap @@ -70,4 +75,7 @@ export interface ICullFaceMap "back": "back", } +/** + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/frontFace + */ export type IFrontFace = "ccw" | "cw"; \ No newline at end of file -- Gitee From 71268748b0d79cdb1ceadb022a1f40cd14c25565 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 01:30:02 +0800 Subject: [PATCH 010/105] BlendComponent BlendState Buffer --- src/data/{IBlendComponent.ts => BlendComponent.ts} | 8 ++++---- src/data/{IBlendState.ts => BlendState.ts} | 12 ++++++------ src/data/{IBuffer.ts => Buffer.ts} | 2 +- src/data/IColorTargetState.ts | 4 ++-- src/data/ICopyBufferToBuffer.ts | 6 +++--- src/index.ts | 12 ++++++------ src/utils/getBlendConstantColor.ts | 4 ++-- 7 files changed, 24 insertions(+), 24 deletions(-) rename src/data/{IBlendComponent.ts => BlendComponent.ts} (90%) rename src/data/{IBlendState.ts => BlendState.ts} (65%) rename src/data/{IBuffer.ts => Buffer.ts} (98%) diff --git a/src/data/IBlendComponent.ts b/src/data/BlendComponent.ts similarity index 90% rename from src/data/IBlendComponent.ts rename to src/data/BlendComponent.ts index 708c8c3..a380806 100644 --- a/src/data/IBlendComponent.ts +++ b/src/data/BlendComponent.ts @@ -10,7 +10,7 @@ * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpucolortargetstate */ -export interface IBlendComponent +export class BlendComponent { /** * 混合方式。 @@ -21,7 +21,7 @@ export interface IBlendComponent * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/blendEquation */ - readonly operation?: IBlendOperation; + readonly operation?: IBlendOperation = "add"; /** * 源混合因子。 @@ -30,7 +30,7 @@ export interface IBlendComponent * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/blendFunc */ - readonly srcFactor?: IBlendFactor; + readonly srcFactor?: IBlendFactor = "one"; /** * 目标混合因子。 @@ -39,7 +39,7 @@ export interface IBlendComponent * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/blendFunc */ - readonly dstFactor?: IBlendFactor; + readonly dstFactor?: IBlendFactor = "zero"; } export type IBlendOperation = "add" | "subtract" | "reverse-subtract" | "min" | "max"; diff --git a/src/data/IBlendState.ts b/src/data/BlendState.ts similarity index 65% rename from src/data/IBlendState.ts rename to src/data/BlendState.ts index a4b9516..4f5387a 100644 --- a/src/data/IBlendState.ts +++ b/src/data/BlendState.ts @@ -1,4 +1,4 @@ -import { IBlendComponent } from "./IBlendComponent"; +import { BlendComponent } from "./BlendComponent"; import { IColor } from "./IRenderPassColorAttachment"; /** @@ -10,27 +10,27 @@ import { IColor } from "./IRenderPassColorAttachment"; * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpublendstate */ -export interface IBlendState +export class BlendState { /** * 混合时使用的常量值，默认为 [0,0,0,0]。 * - * 当 {@link IBlendComponent.srcFactor} {@link IBlendComponent.dstFactor} 取值为 "constant" 或者 "one-minus-constant" 时生效。 + * 当 {@link BlendComponent.srcFactor} {@link BlendComponent.dstFactor} 取值为 "constant" 或者 "one-minus-constant" 时生效。 * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/blendColor * @see https://gpuweb.github.io/gpuweb/#dom-renderstate-blendconstant-slot * * 注：只取 renderPipeline.fragment?.targets?.[0]?.blend.constantColor 值。 */ - readonly constantColor?: IColor; + readonly constantColor?: IColor = [0, 0, 0, 0]; /** * 为颜色通道定义相应渲染目标的混合行为。 */ - readonly color?: IBlendComponent; + readonly color?: BlendComponent = new BlendComponent(); /** * 为alpha通道定义相应渲染目标的混合行为。 */ - readonly alpha?: IBlendComponent; + readonly alpha?: BlendComponent = new BlendComponent(); } diff --git a/src/data/IBuffer.ts b/src/data/Buffer.ts similarity index 98% rename from src/data/IBuffer.ts rename to src/data/Buffer.ts index 42d170c..91d6006 100644 --- a/src/data/IBuffer.ts +++ b/src/data/Buffer.ts @@ -9,7 +9,7 @@ import { TypedArray } from "./TypedArray"; * * {@link GPUBuffer} */ -export interface IBuffer +export class Buffer { /** * 标签。 diff --git a/src/data/IColorTargetState.ts b/src/data/IColorTargetState.ts index 27071ee..dae90b2 100644 --- a/src/data/IColorTargetState.ts +++ b/src/data/IColorTargetState.ts @@ -1,4 +1,4 @@ -import { IBlendState } from "./IBlendState"; +import { BlendState } from "./BlendState"; /** * 属性 `format` 将由渲染通道中附件给出。 @@ -15,7 +15,7 @@ export interface IColorTargetState * * 默认 `undefined`，表示不进行混合。 */ - blend?: IBlendState; + blend?: BlendState; /** * 控制那些颜色分量是否可以被写入到颜色中。 diff --git a/src/data/ICopyBufferToBuffer.ts b/src/data/ICopyBufferToBuffer.ts index b5ed934..399d2c9 100644 --- a/src/data/ICopyBufferToBuffer.ts +++ b/src/data/ICopyBufferToBuffer.ts @@ -1,4 +1,4 @@ -import { IBuffer } from "./IBuffer"; +import { Buffer } from "./Buffer"; /** * GPU缓冲区之间拷贝。 @@ -16,7 +16,7 @@ export interface ICopyBufferToBuffer /** * 源缓冲区。 */ - source: IBuffer, + source: Buffer, /** * 默认为0。 @@ -26,7 +26,7 @@ export interface ICopyBufferToBuffer /** * 目标缓冲区。 */ - destination: IBuffer, + destination: Buffer, /** * 默认为0。 diff --git a/src/index.ts b/src/index.ts index 0e3f997..aed83e4 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,8 +1,9 @@ export * from "./consts/vertexFormatMap"; -export * from "./data/IBlendComponent"; -export * from "./data/IBlendState"; -export * from "./data/IBuffer"; +export * from "./data/BlendComponent"; +export * from "./data/BlendState"; +export * from "./data/Geometry"; +export * from "./data/Buffer"; export * from "./data/ICanvasContext"; export * from "./data/ICanvasTexture"; export * from "./data/IColorTargetState"; @@ -11,8 +12,6 @@ export * from "./data/ICopyBufferToBuffer"; export * from "./data/ICopyTextureToTexture"; export * from "./data/IDepthStencilState"; export * from "./data/IFragmentState"; -export * from "./data/Geometry"; -export * from "./data/PrimitiveState"; export * from "./data/IRenderObject"; export * from "./data/IRenderPass"; export * from "./data/IRenderPassColorAttachment"; @@ -26,11 +25,12 @@ export * from "./data/ISubmit"; export * from "./data/ITexture"; export * from "./data/ITextureView"; export * from "./data/IUniforms"; -export * from "./data/VertexAttributes"; export * from "./data/IVertexState"; export * from "./data/IViewport"; +export * from "./data/PrimitiveState"; export * from "./data/TypedArray"; export * from "./data/UnReadonly"; +export * from "./data/VertexAttributes"; export * from "./utils/getBlendConstantColor"; export * from "./utils/getTexImageSourceSize"; diff --git a/src/utils/getBlendConstantColor.ts b/src/utils/getBlendConstantColor.ts index 1622841..607c2f9 100644 --- a/src/utils/getBlendConstantColor.ts +++ b/src/utils/getBlendConstantColor.ts @@ -1,4 +1,4 @@ -import { IBlendState } from "../data/IBlendState"; +import { BlendState } from "../data/BlendState"; import { IColor } from "../data/IRenderPassColorAttachment"; /** @@ -7,7 +7,7 @@ import { IColor } from "../data/IRenderPassColorAttachment"; * @param blend * @returns */ -export function getBlendConstantColor(blend: IBlendState): IColor +export function getBlendConstantColor(blend: BlendState): IColor { if (!blend) return undefined; -- Gitee From 8099a9c6f85730e0e70a43d78543f94937b4d22e Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 01:38:02 +0800 Subject: [PATCH 011/105] CanvasContext CanvasTexture ColorTargetState CommandEncoder --- .../{ICanvasContext.ts => CanvasContext.ts} | 2 +- .../{ICanvasTexture.ts => CanvasTexture.ts} | 6 +++--- ...IColorTargetState.ts => ColorTargetState.ts} | 6 +++--- .../{ICommandEncoder.ts => CommandEncoder.ts} | 17 +++++++++-------- src/data/IFragmentState.ts | 4 ++-- src/data/ISubmit.ts | 4 ++-- src/index.ts | 8 ++++---- 7 files changed, 24 insertions(+), 23 deletions(-) rename src/data/{ICanvasContext.ts => CanvasContext.ts} (90%) rename src/data/{ICanvasTexture.ts => CanvasTexture.ts} (49%) rename src/data/{IColorTargetState.ts => ColorTargetState.ts} (85%) rename src/data/{ICommandEncoder.ts => CommandEncoder.ts} (93%) diff --git a/src/data/ICanvasContext.ts b/src/data/CanvasContext.ts similarity index 90% rename from src/data/ICanvasContext.ts rename to src/data/CanvasContext.ts index a913f23..dca9588 100644 --- a/src/data/ICanvasContext.ts +++ b/src/data/CanvasContext.ts @@ -3,7 +3,7 @@ * @see HTMLCanvasElement.getContext * @see GPUCanvasContext.configure */ -export interface ICanvasContext +export class CanvasContext { /** * 画布id diff --git a/src/data/ICanvasTexture.ts b/src/data/CanvasTexture.ts similarity index 49% rename from src/data/ICanvasTexture.ts rename to src/data/CanvasTexture.ts index a36e23a..f67eb5b 100644 --- a/src/data/ICanvasTexture.ts +++ b/src/data/CanvasTexture.ts @@ -1,11 +1,11 @@ -import { ICanvasContext } from "./ICanvasContext"; +import { CanvasContext } from "./CanvasContext"; /** * 画布纹理，从画布的WebGPU上下文获取纹理 * * 注：只在WebGPU上支持。 */ -export interface ICanvasTexture +export class CanvasTexture { - context: ICanvasContext; + context: CanvasContext; } diff --git a/src/data/IColorTargetState.ts b/src/data/ColorTargetState.ts similarity index 85% rename from src/data/IColorTargetState.ts rename to src/data/ColorTargetState.ts index dae90b2..fc392c9 100644 --- a/src/data/IColorTargetState.ts +++ b/src/data/ColorTargetState.ts @@ -5,7 +5,7 @@ import { BlendState } from "./BlendState"; * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpucolortargetstate */ -export interface IColorTargetState +export class ColorTargetState { /** * The blending behavior for this color target. If left undefined, disables blending for this @@ -15,7 +15,7 @@ export interface IColorTargetState * * 默认 `undefined`，表示不进行混合。 */ - blend?: BlendState; + blend?: BlendState = new BlendState(); /** * 控制那些颜色分量是否可以被写入到颜色中。 @@ -26,7 +26,7 @@ export interface IColorTargetState * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/colorMask */ - readonly writeMask?: IWriteMask; + readonly writeMask?: IWriteMask = [true, true, true, true]; } export type IWriteMask = [red: boolean, green: boolean, blue: boolean, alpha: boolean]; diff --git a/src/data/ICommandEncoder.ts b/src/data/CommandEncoder.ts similarity index 93% rename from src/data/ICommandEncoder.ts rename to src/data/CommandEncoder.ts index d255c22..f1681b0 100644 --- a/src/data/ICommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -7,16 +7,23 @@ import { IRenderPass } from "./IRenderPass"; * * @see https://developer.mozilla.org/en-US/docs/Web/API/GPUCommandEncoder */ -export interface ICommandEncoder +export class CommandEncoder { /** * 通道编码器列表。 * * 包括计算通道编码器、渲染通道编码器 以及 GPU中缓存与纹理之间拷贝。 */ - passEncoders: IPassEncoder[]; + passEncoders: IPassEncoder[] = []; } +/** + * 通道编码器。 + * + * 如需扩展 IPassEncoder ，请在 IPassEncoderMap 中进行添加。 + */ +export type IPassEncoder = IPassEncoderMap[keyof IPassEncoderMap]; + /** * 如需扩展 IPassEncoder ，请在 IPassEncoderMap 中进行添加。 */ @@ -35,9 +42,3 @@ export interface IPassEncoderMap ICopyBufferToBuffer: ICopyBufferToBuffer; } -/** - * 通道编码器。 - * - * 如需扩展 IPassEncoder ，请在 IPassEncoderMap 中进行添加。 - */ -export type IPassEncoder = IPassEncoderMap[keyof IPassEncoderMap]; diff --git a/src/data/IFragmentState.ts b/src/data/IFragmentState.ts index 1fa702d..0a0d8b0 100644 --- a/src/data/IFragmentState.ts +++ b/src/data/IFragmentState.ts @@ -1,4 +1,4 @@ -import { IColorTargetState } from "./IColorTargetState"; +import { ColorTargetState } from "./ColorTargetState"; /** * 片段着色器阶段描述。 @@ -20,5 +20,5 @@ export interface IFragmentState * * 注：WebGL中没法分别对每个颜色附件进行设置，统一使用第一项（targets[0]）设置！ */ - readonly targets?: readonly IColorTargetState[]; + readonly targets?: readonly ColorTargetState[]; } diff --git a/src/data/ISubmit.ts b/src/data/ISubmit.ts index 35d8ffb..0f6f0b1 100644 --- a/src/data/ISubmit.ts +++ b/src/data/ISubmit.ts @@ -1,4 +1,4 @@ -import { ICommandEncoder } from "./ICommandEncoder"; +import { CommandEncoder } from "./CommandEncoder"; /** * 一次 GPU 提交。 @@ -10,5 +10,5 @@ export interface ISubmit /** * 命令编码器列表。 */ - commandEncoders: ICommandEncoder[]; + commandEncoders: CommandEncoder[]; } diff --git a/src/index.ts b/src/index.ts index aed83e4..153bfe5 100644 --- a/src/index.ts +++ b/src/index.ts @@ -4,10 +4,10 @@ export * from "./data/BlendComponent"; export * from "./data/BlendState"; export * from "./data/Geometry"; export * from "./data/Buffer"; -export * from "./data/ICanvasContext"; -export * from "./data/ICanvasTexture"; -export * from "./data/IColorTargetState"; -export * from "./data/ICommandEncoder"; +export * from "./data/CanvasContext"; +export * from "./data/CanvasTexture"; +export * from "./data/ColorTargetState"; +export * from "./data/CommandEncoder"; export * from "./data/ICopyBufferToBuffer"; export * from "./data/ICopyTextureToTexture"; export * from "./data/IDepthStencilState"; -- Gitee From 62dacf75010383c86b68b7b4969d685301d991ac Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 01:50:39 +0800 Subject: [PATCH 012/105] CopyBufferToBuffer CopyTextureToTexture DepthStencilState FragmentState --- src/data/CommandEncoder.ts | 8 ++++---- ...ufferToBuffer.ts => CopyBufferToBuffer.ts} | 12 +++++------ ...reToTexture.ts => CopyTextureToTexture.ts} | 10 +++++----- ...thStencilState.ts => DepthStencilState.ts} | 20 +++++++++---------- .../{IFragmentState.ts => FragmentState.ts} | 4 ++-- src/data/IRenderPipeline.ts | 8 ++++---- src/data/IStencilFaceState.ts | 2 +- src/index.ts | 8 ++++---- 8 files changed, 36 insertions(+), 36 deletions(-) rename src/data/{ICopyBufferToBuffer.ts => CopyBufferToBuffer.ts} (68%) rename src/data/{ICopyTextureToTexture.ts => CopyTextureToTexture.ts} (86%) rename src/data/{IDepthStencilState.ts => DepthStencilState.ts} (80%) rename src/data/{IFragmentState.ts => FragmentState.ts} (86%) diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index f1681b0..f669863 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -1,5 +1,5 @@ -import { ICopyBufferToBuffer } from "./ICopyBufferToBuffer"; -import { ICopyTextureToTexture } from "./ICopyTextureToTexture"; +import { CopyBufferToBuffer } from "./CopyBufferToBuffer"; +import { CopyTextureToTexture } from "./CopyTextureToTexture"; import { IRenderPass } from "./IRenderPass"; /** @@ -37,8 +37,8 @@ export interface IPassEncoderMap /** * 纹理之间拷贝。 */ - ICopyTextureToTexture: ICopyTextureToTexture; + ICopyTextureToTexture: CopyTextureToTexture; - ICopyBufferToBuffer: ICopyBufferToBuffer; + ICopyBufferToBuffer: CopyBufferToBuffer; } diff --git a/src/data/ICopyBufferToBuffer.ts b/src/data/CopyBufferToBuffer.ts similarity index 68% rename from src/data/ICopyBufferToBuffer.ts rename to src/data/CopyBufferToBuffer.ts index 399d2c9..26b1f58 100644 --- a/src/data/ICopyBufferToBuffer.ts +++ b/src/data/CopyBufferToBuffer.ts @@ -6,32 +6,32 @@ import { Buffer } from "./Buffer"; * {@link WebGL2RenderingContextBase.copyBufferSubData} * {@link GPUCommandEncoder.copyBufferToBuffer} */ -export interface ICopyBufferToBuffer +export class CopyBufferToBuffer { /** * 数据类型。 */ - readonly __type: "CopyBufferToBuffer"; + readonly __type: "CopyBufferToBuffer" = "CopyBufferToBuffer"; /** * 源缓冲区。 */ - source: Buffer, + source: Buffer; /** * 默认为0。 */ - sourceOffset?: number, + sourceOffset?: number = 0; /** * 目标缓冲区。 */ - destination: Buffer, + destination: Buffer; /** * 默认为0。 */ - destinationOffset?: number, + destinationOffset?: number = 0; /** * 默认为源缓冲区尺寸。 diff --git a/src/data/ICopyTextureToTexture.ts b/src/data/CopyTextureToTexture.ts similarity index 86% rename from src/data/ICopyTextureToTexture.ts rename to src/data/CopyTextureToTexture.ts index 00d9f3d..33b1f6e 100644 --- a/src/data/ICopyTextureToTexture.ts +++ b/src/data/CopyTextureToTexture.ts @@ -6,22 +6,22 @@ import { ITextureLike } from "./ITextureView"; * * {@link GPUCommandEncoder.copyTextureToTexture} */ -export interface ICopyTextureToTexture +export class CopyTextureToTexture { /** * 数据类型。 */ - readonly __type: "CopyTextureToTexture"; + readonly __type: "CopyTextureToTexture" = "CopyTextureToTexture"; /** * Combined with `copySize`, defines the region of the source texture subresources. */ - source: IImageCopyTexture, + source: ImageCopyTexture; /** * Combined with `copySize`, defines the region of the destination texture subresources. */ - destination: IImageCopyTexture, + destination: ImageCopyTexture; /** * 拷贝的尺寸。 @@ -35,7 +35,7 @@ export interface ICopyTextureToTexture * {@link GPUCommandEncoder.copyTextureToTexture} * {@link GPUImageCopyTexture} */ -export interface IImageCopyTexture +export class ImageCopyTexture { /** * Texture to copy to/from. diff --git a/src/data/IDepthStencilState.ts b/src/data/DepthStencilState.ts similarity index 80% rename from src/data/IDepthStencilState.ts rename to src/data/DepthStencilState.ts index e5b0913..6342a95 100644 --- a/src/data/IDepthStencilState.ts +++ b/src/data/DepthStencilState.ts @@ -9,7 +9,7 @@ import { ICompareFunction, IStencilFaceState } from "./IStencilFaceState"; * * @see https://www.orillusion.com/zh/webgpu.html#depth-stencil-state */ -export interface IDepthStencilState +export class DepthStencilState { /** * 指示这个 GPURenderPipeline 是否可以修改 depthStencilAttachment 深度值。 @@ -18,7 +18,7 @@ export interface IDepthStencilState * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/depthMask */ - readonly depthWriteEnabled?: boolean; + readonly depthWriteEnabled?: boolean = true; /** * 用于测试片元深度与 depthStencilAttachment 深度值的比较操作。 @@ -27,21 +27,21 @@ export interface IDepthStencilState * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/depthFunc */ - readonly depthCompare?: ICompareFunction; + readonly depthCompare?: ICompareFunction = "less"; /** * 定义了如何为朝前的图元执行模板比较和操作。 * * 默认为 {}。 */ - readonly stencilFront?: IStencilFaceState; + readonly stencilFront?: IStencilFaceState = new IStencilFaceState(); /** * 定义了如何为朝后的图元执行模板比较和操作。 * * 默认为 {}。 */ - readonly stencilBack?: IStencilFaceState; + readonly stencilBack?: IStencilFaceState = new IStencilFaceState(); /** * 模板测试时如果使用 "replace" ，则使用该值填充模板值。 @@ -53,21 +53,21 @@ export interface IDepthStencilState * * @see https://www.orillusion.com/zh/webgpu.html#dom-gpurenderpassencoder-setstencilreference */ - readonly stencilReference?: number; + readonly stencilReference?: number = 0; /** * 掩码控制在执行模板比较测试时读取哪些 depthStencilAttachment 模板值位。 * * 默认为 0xFFFFFFFF 。 */ - readonly stencilReadMask?: number; + readonly stencilReadMask?: number = 0xFFFFFFFF; /** * 掩码控制可以写入哪些 depthStencilAttachment 模板值位。 * * 默认为 0xFFFFFFFF 。 */ - readonly stencilWriteMask?: number; + readonly stencilWriteMask?: number = 0xFFFFFFFF; /** * 添加到每个片元的恒定深度偏差。 @@ -76,7 +76,7 @@ export interface IDepthStencilState * * 对应WebGL中的 WebGLRenderingContextBase.polygonOffset 函数的 units 参数。 */ - readonly depthBias?: number; + readonly depthBias?: number = 0; /** * 与片元的斜率成比例的深度偏差。 @@ -85,5 +85,5 @@ export interface IDepthStencilState * * 对应WebGL中的 WebGLRenderingContextBase.polygonOffset 函数的 factor 参数。 */ - readonly depthBiasSlopeScale?: number; + readonly depthBiasSlopeScale?: number = 0; } diff --git a/src/data/IFragmentState.ts b/src/data/FragmentState.ts similarity index 86% rename from src/data/IFragmentState.ts rename to src/data/FragmentState.ts index 0a0d8b0..eb9e945 100644 --- a/src/data/IFragmentState.ts +++ b/src/data/FragmentState.ts @@ -5,7 +5,7 @@ import { ColorTargetState } from "./ColorTargetState"; * * {@link GPUFragmentState} */ -export interface IFragmentState +export class FragmentState { /** * 着色器代码。 @@ -20,5 +20,5 @@ export interface IFragmentState * * 注：WebGL中没法分别对每个颜色附件进行设置，统一使用第一项（targets[0]）设置！ */ - readonly targets?: readonly ColorTargetState[]; + readonly targets?: readonly ColorTargetState[] = []; } diff --git a/src/data/IRenderPipeline.ts b/src/data/IRenderPipeline.ts index 1e4e3a6..2d09737 100644 --- a/src/data/IRenderPipeline.ts +++ b/src/data/IRenderPipeline.ts @@ -1,5 +1,5 @@ -import { IDepthStencilState } from "./IDepthStencilState"; -import { IFragmentState } from "./IFragmentState"; +import { DepthStencilState } from "./DepthStencilState"; +import { FragmentState } from "./FragmentState"; import { PrimitiveState } from "./PrimitiveState"; import { IVertexState } from "./IVertexState"; @@ -24,12 +24,12 @@ export interface IRenderPipeline /** * 片段着色器阶段描述。 */ - readonly fragment?: IFragmentState; + readonly fragment?: FragmentState; /** * 深度模板阶段描述。 */ - readonly depthStencil?: IDepthStencilState; + readonly depthStencil?: DepthStencilState; _version?: number; } diff --git a/src/data/IStencilFaceState.ts b/src/data/IStencilFaceState.ts index 02d254d..65a914b 100644 --- a/src/data/IStencilFaceState.ts +++ b/src/data/IStencilFaceState.ts @@ -3,7 +3,7 @@ * * @see https://www.orillusion.com/zh/webgpu.html#dictdef-gpustencilfacestate */ -export interface IStencilFaceState +export class IStencilFaceState { /** * 在测试片元与 depthStencilAttachment 模板值时使用的 GPUCompareFunction。 diff --git a/src/index.ts b/src/index.ts index 153bfe5..88eae72 100644 --- a/src/index.ts +++ b/src/index.ts @@ -8,10 +8,10 @@ export * from "./data/CanvasContext"; export * from "./data/CanvasTexture"; export * from "./data/ColorTargetState"; export * from "./data/CommandEncoder"; -export * from "./data/ICopyBufferToBuffer"; -export * from "./data/ICopyTextureToTexture"; -export * from "./data/IDepthStencilState"; -export * from "./data/IFragmentState"; +export * from "./data/CopyBufferToBuffer"; +export * from "./data/CopyTextureToTexture"; +export * from "./data/DepthStencilState"; +export * from "./data/FragmentState"; export * from "./data/IRenderObject"; export * from "./data/IRenderPass"; export * from "./data/IRenderPassColorAttachment"; -- Gitee From ff8a9e2eed55e5da95f970d11dfaf3ca987c5fa0 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 02:31:40 +0800 Subject: [PATCH 013/105] RenderObject --- src/Macro.ts | 2 +- src/data/BlendState.ts | 2 +- src/data/CommandEncoder.ts | 4 +- src/data/CopyTextureToTexture.ts | 4 +- src/data/DepthStencilState.ts | 6 +-- src/data/IUniforms.ts | 12 ++--- src/data/IVertexState.ts | 2 +- .../{IRenderObject.ts => RenderObject.ts} | 18 ++++---- src/data/{IRenderPass.ts => RenderPass.ts} | 14 +++--- ...chment.ts => RenderPassColorAttachment.ts} | 10 ++--- ...ts => RenderPassDepthStencilAttachment.ts} | 14 +++--- ...sDescriptor.ts => RenderPassDescriptor.ts} | 12 ++--- .../{IRenderPipeline.ts => RenderPipeline.ts} | 3 +- src/data/{ISampler.ts => Sampler.ts} | 24 +++++----- src/data/{IScissorRect.ts => ScissorRect.ts} | 12 ++--- ...tencilFaceState.ts => StencilFaceState.ts} | 10 ++--- src/data/{ISubmit.ts => Submit.ts} | 2 +- src/data/{ITexture.ts => Texture.ts} | 6 +-- src/data/{ITextureView.ts => TextureView.ts} | 44 +++++++++---------- src/index.ts | 26 +++++------ src/utils/getBlendConstantColor.ts | 2 +- src/utils/getTexImageSourceSize.ts | 2 +- src/utils/getTextureBytesPerPixel.ts | 2 +- 23 files changed, 116 insertions(+), 117 deletions(-) rename src/data/{IRenderObject.ts => RenderObject.ts} (63%) rename src/data/{IRenderPass.ts => RenderPass.ts} (62%) rename src/data/{IRenderPassColorAttachment.ts => RenderPassColorAttachment.ts} (89%) rename src/data/{IRenderPassDepthStencilAttachment.ts => RenderPassDepthStencilAttachment.ts} (76%) rename src/data/{IRenderPassDescriptor.ts => RenderPassDescriptor.ts} (70%) rename src/data/{IRenderPipeline.ts => RenderPipeline.ts} (87%) rename src/data/{ISampler.ts => Sampler.ts} (89%) rename src/data/{IScissorRect.ts => ScissorRect.ts} (88%) rename src/data/{IStencilFaceState.ts => StencilFaceState.ts} (80%) rename src/data/{ISubmit.ts => Submit.ts} (90%) rename src/data/{ITexture.ts => Texture.ts} (98%) rename src/data/{ITextureView.ts => TextureView.ts} (82%) diff --git a/src/Macro.ts b/src/Macro.ts index eabd78e..6f66343 100644 --- a/src/Macro.ts +++ b/src/Macro.ts @@ -1,7 +1,7 @@ /** * 着色器宏定义 */ -export interface ShaderMacro +export class ShaderMacro { /** * UV中的U缩放 diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index 4f5387a..fe302c7 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -1,5 +1,5 @@ import { BlendComponent } from "./BlendComponent"; -import { IColor } from "./IRenderPassColorAttachment"; +import { IColor } from "./RenderPassColorAttachment"; /** * 混合状态。 diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index f669863..f56e01f 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -1,6 +1,6 @@ import { CopyBufferToBuffer } from "./CopyBufferToBuffer"; import { CopyTextureToTexture } from "./CopyTextureToTexture"; -import { IRenderPass } from "./IRenderPass"; +import { RenderPass } from "./RenderPass"; /** * 命令编码器。 @@ -32,7 +32,7 @@ export interface IPassEncoderMap /** * 渲染通道。 */ - IRenderPass: IRenderPass; + IRenderPass: RenderPass; /** * 纹理之间拷贝。 diff --git a/src/data/CopyTextureToTexture.ts b/src/data/CopyTextureToTexture.ts index 33b1f6e..852d432 100644 --- a/src/data/CopyTextureToTexture.ts +++ b/src/data/CopyTextureToTexture.ts @@ -1,5 +1,5 @@ -import { ITextureOrigin, ITextureSize } from "./ITexture"; -import { ITextureLike } from "./ITextureView"; +import { ITextureOrigin, ITextureSize } from "./Texture"; +import { ITextureLike } from "./TextureView"; /** * GPU纹理间拷贝。 diff --git a/src/data/DepthStencilState.ts b/src/data/DepthStencilState.ts index 6342a95..785d82b 100644 --- a/src/data/DepthStencilState.ts +++ b/src/data/DepthStencilState.ts @@ -1,4 +1,4 @@ -import { ICompareFunction, IStencilFaceState } from "./IStencilFaceState"; +import { ICompareFunction, StencilFaceState } from "./StencilFaceState"; /** * 深度模板阶段描述。 @@ -34,14 +34,14 @@ export class DepthStencilState * * 默认为 {}。 */ - readonly stencilFront?: IStencilFaceState = new IStencilFaceState(); + readonly stencilFront?: StencilFaceState = new StencilFaceState(); /** * 定义了如何为朝后的图元执行模板比较和操作。 * * 默认为 {}。 */ - readonly stencilBack?: IStencilFaceState = new IStencilFaceState(); + readonly stencilBack?: StencilFaceState = new StencilFaceState(); /** * 模板测试时如果使用 "replace" ，则使用该值填充模板值。 diff --git a/src/data/IUniforms.ts b/src/data/IUniforms.ts index fadb2a7..fa2c673 100644 --- a/src/data/IUniforms.ts +++ b/src/data/IUniforms.ts @@ -1,18 +1,18 @@ import { TypedArray } from "./TypedArray"; -/** - * Uniform 类型 - */ -export type IUniformType = IUniformTypeMap[keyof IUniformTypeMap]; - /** * Uniform 数据 */ -export interface IUniforms +export class Uniforms { [key: string]: IUniformType; } +/** + * Uniform 类型 + */ +export type IUniformType = IUniformTypeMap[keyof IUniformTypeMap]; + export interface IUniformTypeMap { /** diff --git a/src/data/IVertexState.ts b/src/data/IVertexState.ts index 628f27b..767552d 100644 --- a/src/data/IVertexState.ts +++ b/src/data/IVertexState.ts @@ -1,7 +1,7 @@ /** * 顶点着色器阶段描述。 */ -export interface IVertexState +export class IVertexState { /** * 着色器代码。 diff --git a/src/data/IRenderObject.ts b/src/data/RenderObject.ts similarity index 63% rename from src/data/IRenderObject.ts rename to src/data/RenderObject.ts index 1fd00e9..bac5c7f 100644 --- a/src/data/IRenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,19 +1,19 @@ import { ShaderMacro } from "../Macro"; import { Geometry } from "./Geometry"; -import { IRenderPipeline } from "./IRenderPipeline"; -import { IScissorRect } from "./IScissorRect"; -import { IUniforms } from "./IUniforms"; +import { ScissorRect } from "./ScissorRect"; +import { Uniforms } from "./IUniforms"; import { IViewport } from "./IViewport"; +import { RenderPipeline } from "./RenderPipeline"; /** * 渲染对象，包含一次渲染时包含的所有数据。 */ -export interface IRenderObject +export class RenderObject { /** * 数据类型。 */ - readonly __type?: "RenderObject"; + readonly __type?: "RenderObject" = "RenderObject"; /** * 视窗。 @@ -25,12 +25,12 @@ export interface IRenderObject /** * 光栅化阶段中使用的剪刀矩形。 */ - scissorRect?: IScissorRect; + scissorRect?: ScissorRect; /** * 渲染管线描述。 */ - pipeline: IRenderPipeline; + pipeline: RenderPipeline; /** * 渲染几何数据。 @@ -40,12 +40,12 @@ export interface IRenderObject /** * Uniform变量数据 */ - readonly uniforms?: IUniforms; + readonly uniforms?: Uniforms = new Uniforms(); _version?: number; /** * shader 中的 宏 */ - shaderMacro?: ShaderMacro; + shaderMacro?: ShaderMacro = new ShaderMacro(); } diff --git a/src/data/IRenderPass.ts b/src/data/RenderPass.ts similarity index 62% rename from src/data/IRenderPass.ts rename to src/data/RenderPass.ts index 1d90e48..26ad707 100644 --- a/src/data/IRenderPass.ts +++ b/src/data/RenderPass.ts @@ -1,27 +1,27 @@ -import { IRenderObject } from "./IRenderObject"; -import { IRenderPassDescriptor } from "./IRenderPassDescriptor"; +import { RenderPassDescriptor } from "./RenderPassDescriptor"; +import { RenderObject } from "./RenderObject"; /** * WebGL渲染通道 * * 包含渲染通道描述以及需要渲染的对象列表。 */ -export interface IRenderPass +export class RenderPass { /** * 数据类型。 */ - readonly __type?: "RenderPass"; + readonly __type?: "RenderPass" = "RenderPass"; /** * 渲染通道描述 */ - readonly descriptor?: IRenderPassDescriptor; + readonly descriptor?: RenderPassDescriptor = new RenderPassDescriptor(); /** * 渲染对象列表 */ - readonly renderObjects?: readonly IRenderPassObject[]; + readonly renderObjects?: readonly IRenderPassObject[] = []; // /** // * 渲染不被遮挡查询结果。具体数据保存在各子项的"result"属性中。 @@ -35,5 +35,5 @@ export type IRenderPassObject = IRenderPassObjectMap[keyof IRenderPassObjectMap] export interface IRenderPassObjectMap { - IRenderObject: IRenderObject; + IRenderObject: RenderObject; } \ No newline at end of file diff --git a/src/data/IRenderPassColorAttachment.ts b/src/data/RenderPassColorAttachment.ts similarity index 89% rename from src/data/IRenderPassColorAttachment.ts rename to src/data/RenderPassColorAttachment.ts index 45e8fd0..d6740a9 100644 --- a/src/data/IRenderPassColorAttachment.ts +++ b/src/data/RenderPassColorAttachment.ts @@ -1,9 +1,9 @@ -import { ITextureView } from "./ITextureView"; +import { TextureView } from "./TextureView"; /** * 渲染通道颜色附件。 */ -export interface IRenderPassColorAttachment +export class RenderPassColorAttachment { /** * 颜色附件视图。 @@ -18,7 +18,7 @@ export interface IRenderPassColorAttachment * 注：引擎运行中该属性可能是 IGLRenderbuffer 类型，用于处理多重采样。 * */ - readonly view?: ITextureView; + readonly view?: TextureView = new TextureView(); /** * 清除后填充值。 @@ -37,7 +37,7 @@ export interface IRenderPassColorAttachment * They are converted [$to a texel value of texture format$] matching the render attachment. * If conversion fails, a validation error is generated. */ - readonly clearValue?: IColor; + readonly clearValue?: IColor = [0, 0, 0, 0]; /** * 是否清除颜色附件。 @@ -54,7 +54,7 @@ export interface IRenderPassColorAttachment * executing the render pass. * Note: It is recommended to prefer clearing; see {@link GPULoadOp#"clear"} for details. */ - readonly loadOp?: ILoadOp; + readonly loadOp?: ILoadOp = "clear"; } export type IColor = [red: number, green: number, blue: number, alpha: number]; diff --git a/src/data/IRenderPassDepthStencilAttachment.ts b/src/data/RenderPassDepthStencilAttachment.ts similarity index 76% rename from src/data/IRenderPassDepthStencilAttachment.ts rename to src/data/RenderPassDepthStencilAttachment.ts index dd3b3c5..7b8587d 100644 --- a/src/data/IRenderPassDepthStencilAttachment.ts +++ b/src/data/RenderPassDepthStencilAttachment.ts @@ -1,9 +1,9 @@ -import { ITextureView } from "./ITextureView"; +import { TextureView } from "./TextureView"; /** * 深度模板附件。 */ -export interface IRenderPassDepthStencilAttachment +export class RenderPassDepthStencilAttachment { /** * 深度附件视图。 @@ -13,7 +13,7 @@ export interface IRenderPassDepthStencilAttachment * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/framebufferRenderbuffer * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/framebufferTexture2D */ - readonly view?: ITextureView; + readonly view?: TextureView = new TextureView(); /** * 清除后填充深度值。 @@ -22,7 +22,7 @@ export interface IRenderPassDepthStencilAttachment * * @see https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/clearDepth */ - readonly depthClearValue?: number; + readonly depthClearValue?: number = 1; /** * 是否清除深度值。 @@ -31,7 +31,7 @@ export interface IRenderPassDepthStencilAttachment * * @see https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/clear */ - readonly depthLoadOp?: "load" | "clear"; + readonly depthLoadOp?: "load" | "clear" = "load"; /** * 清除后填充模板值。 @@ -40,7 +40,7 @@ export interface IRenderPassDepthStencilAttachment * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/clearStencil */ - readonly stencilClearValue?: number; + readonly stencilClearValue?: number = 0; /** * 是否清除模板值。 @@ -49,5 +49,5 @@ export interface IRenderPassDepthStencilAttachment * * @see https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/clear */ - readonly stencilLoadOp?: "load" | "clear"; + readonly stencilLoadOp?: "load" | "clear" = "load"; } \ No newline at end of file diff --git a/src/data/IRenderPassDescriptor.ts b/src/data/RenderPassDescriptor.ts similarity index 70% rename from src/data/IRenderPassDescriptor.ts rename to src/data/RenderPassDescriptor.ts index a8331ca..6a099e0 100644 --- a/src/data/IRenderPassDescriptor.ts +++ b/src/data/RenderPassDescriptor.ts @@ -1,10 +1,10 @@ -import { IRenderPassColorAttachment } from "./IRenderPassColorAttachment"; -import { IRenderPassDepthStencilAttachment } from "./IRenderPassDepthStencilAttachment"; +import { RenderPassColorAttachment } from "./RenderPassColorAttachment"; +import { RenderPassDepthStencilAttachment } from "./RenderPassDepthStencilAttachment"; /** * 渲染通道描述 */ -export interface IRenderPassDescriptor +export class RenderPassDescriptor { /** * 标签。 @@ -16,14 +16,14 @@ export interface IRenderPassDescriptor /** * 颜色附件 */ - readonly colorAttachments?: readonly IRenderPassColorAttachment[]; + readonly colorAttachments?: readonly RenderPassColorAttachment[] = []; /** * 深度模板附件。 * * 当使用深度附件时，必须设置，使用默认值可设置为 `{}` 。 */ - readonly depthStencilAttachment?: IRenderPassDepthStencilAttachment; + readonly depthStencilAttachment?: RenderPassDepthStencilAttachment; /** * 采用次数。 @@ -37,5 +37,5 @@ export interface IRenderPassDescriptor * WebGPU: * 是否开启多重采样。WebGPU貌似只支持4重采样。如果在颜色附件中没有给出支持多重采样的纹理时则引擎将会自动为其添加。 */ - readonly sampleCount?: 4; + readonly sampleCount?: 4 = 4; } \ No newline at end of file diff --git a/src/data/IRenderPipeline.ts b/src/data/RenderPipeline.ts similarity index 87% rename from src/data/IRenderPipeline.ts rename to src/data/RenderPipeline.ts index 2d09737..a97298b 100644 --- a/src/data/IRenderPipeline.ts +++ b/src/data/RenderPipeline.ts @@ -1,12 +1,11 @@ import { DepthStencilState } from "./DepthStencilState"; import { FragmentState } from "./FragmentState"; -import { PrimitiveState } from "./PrimitiveState"; import { IVertexState } from "./IVertexState"; /** * 渲染管线。 */ -export interface IRenderPipeline +export class RenderPipeline { /** diff --git a/src/data/ISampler.ts b/src/data/Sampler.ts similarity index 89% rename from src/data/ISampler.ts rename to src/data/Sampler.ts index d7ce1a9..f451728 100644 --- a/src/data/ISampler.ts +++ b/src/data/Sampler.ts @@ -1,4 +1,4 @@ -import { ICompareFunction } from "./IStencilFaceState"; +import { ICompareFunction } from "./StencilFaceState"; /** * 纹理采样器。 @@ -10,7 +10,7 @@ import { ICompareFunction } from "./IStencilFaceState"; * @see https://www.orillusion.com/zh/webgpu.html#dictdef-gpusamplerdescriptor * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter */ -export interface ISampler +export class Sampler { /** * 标签。 @@ -27,7 +27,7 @@ export interface ISampler * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_wrap_s * @see https://gpuweb.github.io/gpuweb/#dom-gpusamplerdescriptor-addressmodeu */ - addressModeU?: IAddressMode; + addressModeU?: IAddressMode = "repeat"; /** * 用于指定纹理在垂直方向（即T或V坐标轴）上的寻址模式。 @@ -37,7 +37,7 @@ export interface ISampler * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_wrap_t * @see https://gpuweb.github.io/gpuweb/#dom-gpusamplerdescriptor-addressmodev */ - addressModeV?: IAddressMode; + addressModeV?: IAddressMode = "repeat"; /** * 用于指定纹理在深度方向（即R或W坐标轴）上的寻址模式。用于3D纹理或者纹理数组。 @@ -47,7 +47,7 @@ export interface ISampler * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_wrap_r * @see https://gpuweb.github.io/gpuweb/#dom-gpusamplerdescriptor-addressmodew */ - addressModeW?: IAddressMode; + addressModeW?: IAddressMode = "repeat"; /** * 指定样本足迹小于或等于一个纹素时的采样行为 @@ -57,19 +57,19 @@ export interface ISampler * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-magfilter * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_mag_filter */ - magFilter?: IFilterMode; + magFilter?: IFilterMode = "nearest"; /** * 指定样本足迹大于一个纹素时的采样行为。 * * 默认 "nearest"。 * - * 注：WebGL中如果使用mipmap相关值时需要设置 {@link ISampler.mipmapFilter} 值。 + * 注：WebGL中如果使用mipmap相关值时需要设置 {@link Sampler.mipmapFilter} 值。 * * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-minfilter * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_min_filter */ - minFilter?: IFilterMode; + minFilter?: IFilterMode = "nearest"; /** * 指定在 mipmap 级别之间进行采样的行为。 @@ -79,7 +79,7 @@ export interface ISampler * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-mipmapfilter * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_min_filter */ - mipmapFilter?: IMipmapFilterMode; + mipmapFilter?: IMipmapFilterMode = "nearest"; /** * 指定采样器使用的最大各向异性值夹具。 @@ -92,21 +92,21 @@ export interface ISampler * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-maxanisotropy * @see https://developer.mozilla.org/en-US/docs/Web/API/EXT_texture_filter_anisotropic */ - maxAnisotropy?: number; + maxAnisotropy?: number = 1; /** * 采样时使用的最小Lod等级。 * * 默认 0。 */ - lodMinClamp?: number; + lodMinClamp?: number = 0; /** * 采样时使用的最大Lod等级。 * * 默认 16 。 */ - lodMaxClamp?: number; + lodMaxClamp?: number = 16; /** * 涉及纹理比较操作时需提供，采样器将是具有指定 GPUCompareFunction 的比较采样器。 diff --git a/src/data/IScissorRect.ts b/src/data/ScissorRect.ts similarity index 88% rename from src/data/IScissorRect.ts rename to src/data/ScissorRect.ts index 73bc0f5..3afa933 100644 --- a/src/data/IScissorRect.ts +++ b/src/data/ScissorRect.ts @@ -17,7 +17,7 @@ * @see https://www.orillusion.com/zh/webgpu.html#dom-gpurenderpassencoder-setscissorrect * */ -export interface IScissorRect +export class ScissorRect { /** * 是否为Y轴朝上。 @@ -26,7 +26,7 @@ export interface IScissorRect * * 默认为 ture。 */ - readonly isYup?: boolean; + readonly isYup?: boolean = true; /** * 剪刀盒横向坐标（像素）。 @@ -35,7 +35,7 @@ export interface IScissorRect * * 默认为 0 。 */ - readonly x: number, + readonly x?: number = 0; /** * 剪刀盒纵向坐标（像素）。 @@ -44,7 +44,7 @@ export interface IScissorRect * * 默认为 0 。 */ - readonly y: number, + readonly y?: number = 0; /** * 剪刀盒宽度（像素）。 @@ -53,7 +53,7 @@ export interface IScissorRect * * 默认为画布宽度或者渲染通道的附件宽度。 */ - readonly width: number, + readonly width: number; /** * 剪刀盒高度（像素）。 @@ -62,5 +62,5 @@ export interface IScissorRect * * 默认为画布高度或者渲染通道的附件高度。 */ - readonly height: number, + readonly height: number; } diff --git a/src/data/IStencilFaceState.ts b/src/data/StencilFaceState.ts similarity index 80% rename from src/data/IStencilFaceState.ts rename to src/data/StencilFaceState.ts index 65a914b..a9c4247 100644 --- a/src/data/IStencilFaceState.ts +++ b/src/data/StencilFaceState.ts @@ -3,35 +3,35 @@ * * @see https://www.orillusion.com/zh/webgpu.html#dictdef-gpustencilfacestate */ -export class IStencilFaceState +export class StencilFaceState { /** * 在测试片元与 depthStencilAttachment 模板值时使用的 GPUCompareFunction。 * * 默认为 "always"。 */ - readonly compare?: ICompareFunction; + readonly compare?: ICompareFunction = "always"; /** * 如果片元模板比较测试（由 compare 描述）失败，则执行的 GPUStencilOperation。 * * 默认为 "keep"。 */ - readonly failOp?: IStencilOperation; + readonly failOp?: IStencilOperation = "keep"; /** * 如果由 depthCompare 描述的片元深度比较失败，则执行的 GPUStencilOperation。 * * 默认为 "keep"。 */ - readonly depthFailOp?: IStencilOperation; + readonly depthFailOp?: IStencilOperation = "keep"; /** * 如果片元模板比较测试通过，则执行由compare描述的GPUStencilOperation。 * * 默认为 "keep"。 */ - readonly passOp?: IStencilOperation; + readonly passOp?: IStencilOperation = "keep"; } export type ICompareFunction = "never" | "less" | "equal" | "less-equal" | "greater" | "not-equal" | "greater-equal" | "always"; diff --git a/src/data/ISubmit.ts b/src/data/Submit.ts similarity index 90% rename from src/data/ISubmit.ts rename to src/data/Submit.ts index 0f6f0b1..fa3cbcd 100644 --- a/src/data/ISubmit.ts +++ b/src/data/Submit.ts @@ -5,7 +5,7 @@ import { CommandEncoder } from "./CommandEncoder"; * * @see https://developer.mozilla.org/en-US/docs/Web/API/GPUQueue/submit */ -export interface ISubmit +export class Submit { /** * 命令编码器列表。 diff --git a/src/data/ITexture.ts b/src/data/Texture.ts similarity index 98% rename from src/data/ITexture.ts rename to src/data/Texture.ts index 7050cbc..864b83f 100644 --- a/src/data/ITexture.ts +++ b/src/data/Texture.ts @@ -1,7 +1,7 @@ /** * 纹理 */ -export interface ITexture +export class Texture { /** * 标签。 @@ -55,12 +55,12 @@ export interface ITexture * * WebGL中不支持 "1d" "cube-array"。 */ - readonly dimension?: ITextureDimension; + readonly dimension?: ITextureDimension = "2d"; /** * 纹理格式。 默认为 "rgba8unorm"， */ - readonly format?: ITextureFormat; + readonly format?: ITextureFormat = "rgba8unorm"; /** * The number of mip levels the texture will contain. diff --git a/src/data/ITextureView.ts b/src/data/TextureView.ts similarity index 82% rename from src/data/ITextureView.ts rename to src/data/TextureView.ts index 51b076b..c0b6dee 100644 --- a/src/data/ITextureView.ts +++ b/src/data/TextureView.ts @@ -1,27 +1,9 @@ -import { ITexture } from "./ITexture"; - -/** - * 如需扩展 ITextureLike，则需在 ITextureMap 中添加类型。 - */ -export interface ITextureLikeMap -{ - /** - * 正常纹理。 - */ - ITexture: ITexture; -} - -/** - * 类似纹理，包含画布纹理以及正常纹理。 - * - * 如需扩展 ITextureLike，则需在 ITextureMap 中添加类型。 - */ -export type ITextureLike = ITextureLikeMap[keyof ITextureLikeMap]; +import { Texture } from "./Texture"; /** * 纹理视图。 */ -export interface ITextureView +export class TextureView { /** * 标签。 @@ -40,12 +22,30 @@ export interface ITextureView * * 默认为 0。 */ - readonly baseMipLevel?: number; + readonly baseMipLevel?: number = 0; /** * 3d纹理的深度索引、纹理数组中的层次、立方体纹理的面索引。 * * 默认为 0。 */ - readonly baseArrayLayer?: number; + readonly baseArrayLayer?: number = 0; +} + +/** + * 类似纹理，包含画布纹理以及正常纹理。 + * + * 如需扩展 ITextureLike，则需在 ITextureMap 中添加类型。 + */ +export type ITextureLike = ITextureLikeMap[keyof ITextureLikeMap]; + +/** + * 如需扩展 ITextureLike，则需在 ITextureMap 中添加类型。 + */ +export interface ITextureLikeMap +{ + /** + * 正常纹理。 + */ + Texture: Texture; } \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index 88eae72..a696d6f 100644 --- a/src/index.ts +++ b/src/index.ts @@ -2,7 +2,6 @@ export * from "./consts/vertexFormatMap"; export * from "./data/BlendComponent"; export * from "./data/BlendState"; -export * from "./data/Geometry"; export * from "./data/Buffer"; export * from "./data/CanvasContext"; export * from "./data/CanvasTexture"; @@ -12,22 +11,23 @@ export * from "./data/CopyBufferToBuffer"; export * from "./data/CopyTextureToTexture"; export * from "./data/DepthStencilState"; export * from "./data/FragmentState"; -export * from "./data/IRenderObject"; -export * from "./data/IRenderPass"; -export * from "./data/IRenderPassColorAttachment"; -export * from "./data/IRenderPassDepthStencilAttachment"; -export * from "./data/IRenderPassDescriptor"; -export * from "./data/IRenderPipeline"; -export * from "./data/ISampler"; -export * from "./data/IScissorRect"; -export * from "./data/IStencilFaceState"; -export * from "./data/ISubmit"; -export * from "./data/ITexture"; -export * from "./data/ITextureView"; +export * from "./data/Geometry"; export * from "./data/IUniforms"; export * from "./data/IVertexState"; export * from "./data/IViewport"; export * from "./data/PrimitiveState"; +export * from "./data/RenderObject"; +export * from "./data/RenderPass"; +export * from "./data/RenderPassColorAttachment"; +export * from "./data/RenderPassDepthStencilAttachment"; +export * from "./data/RenderPassDescriptor"; +export * from "./data/RenderPipeline"; +export * from "./data/Sampler"; +export * from "./data/ScissorRect"; +export * from "./data/StencilFaceState"; +export * from "./data/Submit"; +export * from "./data/Texture"; +export * from "./data/TextureView"; export * from "./data/TypedArray"; export * from "./data/UnReadonly"; export * from "./data/VertexAttributes"; diff --git a/src/utils/getBlendConstantColor.ts b/src/utils/getBlendConstantColor.ts index 607c2f9..d8585ff 100644 --- a/src/utils/getBlendConstantColor.ts +++ b/src/utils/getBlendConstantColor.ts @@ -1,5 +1,5 @@ import { BlendState } from "../data/BlendState"; -import { IColor } from "../data/IRenderPassColorAttachment"; +import { IColor } from "../data/RenderPassColorAttachment"; /** * 当混合系数用到了混合常量值时设置混合常量值。 diff --git a/src/utils/getTexImageSourceSize.ts b/src/utils/getTexImageSourceSize.ts index cd2114a..880d908 100644 --- a/src/utils/getTexImageSourceSize.ts +++ b/src/utils/getTexImageSourceSize.ts @@ -1,4 +1,4 @@ -import { IImageSize } from "../data/ITexture"; +import { IImageSize } from "../data/Texture"; /** * 获取纹理的图片资源尺寸。 diff --git a/src/utils/getTextureBytesPerPixel.ts b/src/utils/getTextureBytesPerPixel.ts index ebf9051..df111eb 100644 --- a/src/utils/getTextureBytesPerPixel.ts +++ b/src/utils/getTextureBytesPerPixel.ts @@ -1,4 +1,4 @@ -import { ITextureFormat } from "../data/ITexture"; +import { ITextureFormat } from "../data/Texture"; /** * 获取纹理每个像素占用的字节数量。 -- Gitee From 9fe8e6e02a1fee7d5185bef9a4e435cf0cc6e879 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 02:44:24 +0800 Subject: [PATCH 014/105] Uniforms VertexState Viewport BufferBinding --- src/data/{IUniforms.ts => BufferBinding.ts} | 27 +++----------------- src/data/RenderObject.ts | 6 ++--- src/data/RenderPipeline.ts | 4 +-- src/data/Uniforms.ts | 23 +++++++++++++++++ src/data/{IVertexState.ts => VertexState.ts} | 2 +- src/data/{IViewport.ts => Viewport.ts} | 12 ++++----- src/index.ts | 7 ++--- 7 files changed, 42 insertions(+), 39 deletions(-) rename src/data/{IUniforms.ts => BufferBinding.ts} (62%) create mode 100644 src/data/Uniforms.ts rename src/data/{IVertexState.ts => VertexState.ts} (80%) rename src/data/{IViewport.ts => Viewport.ts} (89%) diff --git a/src/data/IUniforms.ts b/src/data/BufferBinding.ts similarity index 62% rename from src/data/IUniforms.ts rename to src/data/BufferBinding.ts index fa2c673..e3c2d93 100644 --- a/src/data/IUniforms.ts +++ b/src/data/BufferBinding.ts @@ -1,26 +1,5 @@ import { TypedArray } from "./TypedArray"; -/** - * Uniform 数据 - */ -export class Uniforms -{ - [key: string]: IUniformType; -} - -/** - * Uniform 类型 - */ -export type IUniformType = IUniformTypeMap[keyof IUniformTypeMap]; - -export interface IUniformTypeMap -{ - /** - * 缓冲区绑定。 - */ - IBufferBinding: IBufferBinding; -} - /** * 缓冲区绑定。 * @@ -29,13 +8,13 @@ export interface IUniformTypeMap * * @see GPUBufferBinding */ -export interface IBufferBinding +export class BufferBinding { [name: string]: IBufferBindingItem; /** * 如果未设置引擎将自动生成。 - */ + */ readonly bufferView?: TypedArray; } @@ -43,4 +22,4 @@ export type IUniformDataItem = number | number[] | number[][] | TypedArray | Typ | { toArray(): number[] | Float32Array } | { toArray(): number[] | Float32Array }[] ; -export type IBufferBindingItem = IUniformDataItem | { [key: string]: IBufferBindingItem }; \ No newline at end of file +export type IBufferBindingItem = IUniformDataItem | { [key: string]: IBufferBindingItem }; diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index bac5c7f..fe87be7 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,8 +1,8 @@ import { ShaderMacro } from "../Macro"; import { Geometry } from "./Geometry"; import { ScissorRect } from "./ScissorRect"; -import { Uniforms } from "./IUniforms"; -import { IViewport } from "./IViewport"; +import { Uniforms } from "./Uniforms"; +import { Viewport } from "./Viewport"; import { RenderPipeline } from "./RenderPipeline"; /** @@ -20,7 +20,7 @@ export class RenderObject * * 描述渲染在画布的哪个区域，默认整个画布。 */ - viewport?: IViewport; + viewport?: Viewport; /** * 光栅化阶段中使用的剪刀矩形。 diff --git a/src/data/RenderPipeline.ts b/src/data/RenderPipeline.ts index a97298b..3255060 100644 --- a/src/data/RenderPipeline.ts +++ b/src/data/RenderPipeline.ts @@ -1,6 +1,6 @@ import { DepthStencilState } from "./DepthStencilState"; import { FragmentState } from "./FragmentState"; -import { IVertexState } from "./IVertexState"; +import { VertexState } from "./VertexState"; /** * 渲染管线。 @@ -18,7 +18,7 @@ export class RenderPipeline /** * 顶点着色器阶段描述。 */ - readonly vertex: IVertexState; + readonly vertex: VertexState; /** * 片段着色器阶段描述。 diff --git a/src/data/Uniforms.ts b/src/data/Uniforms.ts new file mode 100644 index 0000000..d0812fc --- /dev/null +++ b/src/data/Uniforms.ts @@ -0,0 +1,23 @@ +import { BufferBinding, IBufferBindingItem } from "./BufferBinding"; + +/** + * Uniform 数据 + */ +export class Uniforms +{ + [key: string]: IUniformType; +} + +/** + * Uniform 类型 + */ +export type IUniformType = IUniformTypeMap[keyof IUniformTypeMap]; + +export interface IUniformTypeMap +{ + /** + * 缓冲区绑定。 + */ + IBufferBinding: BufferBinding; + IBufferBindingItem: IBufferBindingItem; +} diff --git a/src/data/IVertexState.ts b/src/data/VertexState.ts similarity index 80% rename from src/data/IVertexState.ts rename to src/data/VertexState.ts index 767552d..122479a 100644 --- a/src/data/IVertexState.ts +++ b/src/data/VertexState.ts @@ -1,7 +1,7 @@ /** * 顶点着色器阶段描述。 */ -export class IVertexState +export class VertexState { /** * 着色器代码。 diff --git a/src/data/IViewport.ts b/src/data/Viewport.ts similarity index 89% rename from src/data/IViewport.ts rename to src/data/Viewport.ts index d8c49a1..68951c1 100644 --- a/src/data/IViewport.ts +++ b/src/data/Viewport.ts @@ -17,7 +17,7 @@ * @see https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-setviewport * */ -export interface IViewport +export class Viewport { /** * 是否为Y轴朝上。 @@ -26,7 +26,7 @@ export interface IViewport * * 默认为 ture。 */ - isYup?: boolean; + isYup?: boolean = true; /** * 视窗水平坐标（像素）。 @@ -35,7 +35,7 @@ export interface IViewport * * 默认为 0 。 */ - x: number, + x?: number = 0; /** * 视窗垂直坐标（像素）。 @@ -44,7 +44,7 @@ export interface IViewport * * 默认为 0 。 */ - y: number, + y?: number = 0; /** * 视窗宽度（像素）。 @@ -53,7 +53,7 @@ export interface IViewport * * 默认为画布宽度或者渲染通道的附件宽度。 */ - width: number, + width: number; /** * 视窗高度（像素）。 @@ -62,5 +62,5 @@ export interface IViewport * * 默认为画布高度或者渲染通道的附件高度。 */ - height: number, + height: number; } diff --git a/src/index.ts b/src/index.ts index a696d6f..07e3cf1 100644 --- a/src/index.ts +++ b/src/index.ts @@ -3,6 +3,7 @@ export * from "./consts/vertexFormatMap"; export * from "./data/BlendComponent"; export * from "./data/BlendState"; export * from "./data/Buffer"; +export * from "./data/BufferBinding"; export * from "./data/CanvasContext"; export * from "./data/CanvasTexture"; export * from "./data/ColorTargetState"; @@ -12,9 +13,6 @@ export * from "./data/CopyTextureToTexture"; export * from "./data/DepthStencilState"; export * from "./data/FragmentState"; export * from "./data/Geometry"; -export * from "./data/IUniforms"; -export * from "./data/IVertexState"; -export * from "./data/IViewport"; export * from "./data/PrimitiveState"; export * from "./data/RenderObject"; export * from "./data/RenderPass"; @@ -29,8 +27,11 @@ export * from "./data/Submit"; export * from "./data/Texture"; export * from "./data/TextureView"; export * from "./data/TypedArray"; +export * from "./data/Uniforms"; export * from "./data/UnReadonly"; export * from "./data/VertexAttributes"; +export * from "./data/VertexState"; +export * from "./data/Viewport"; export * from "./utils/getBlendConstantColor"; export * from "./utils/getTexImageSourceSize"; -- Gitee From 8b2ad04a7094925ca28825e962adacd33a6ef287 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 02:59:18 +0800 Subject: [PATCH 015/105] BlendState.getBlendConstantColor?(): IColor --- src/data/BlendComponent.ts | 19 ++++++++++++ src/data/BlendState.ts | 48 ++++++++++++++++++++++++++++++ src/index.ts | 1 - src/utils/getBlendConstantColor.ts | 32 -------------------- 4 files changed, 67 insertions(+), 33 deletions(-) delete mode 100644 src/utils/getBlendConstantColor.ts diff --git a/src/data/BlendComponent.ts b/src/data/BlendComponent.ts index a380806..9419f91 100644 --- a/src/data/BlendComponent.ts +++ b/src/data/BlendComponent.ts @@ -12,6 +12,7 @@ */ export class BlendComponent { + /** * 混合方式。 * @@ -40,6 +41,24 @@ export class BlendComponent * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/blendFunc */ readonly dstFactor?: IBlendFactor = "zero"; + + constructor(blend?: BlendComponent) + { + if (!blend) return; + + if (blend.operation) this.operation = blend.operation; + if (blend.srcFactor) this.srcFactor = blend.srcFactor; + if (blend.dstFactor) this.dstFactor = blend.dstFactor; + } + + static getInstance(alpha: BlendComponent): BlendComponent + { + if (alpha === undefined) return undefined; + + if (alpha instanceof BlendComponent) return alpha; + + return new BlendComponent(alpha); + } } export type IBlendOperation = "add" | "subtract" | "reverse-subtract" | "min" | "max"; diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index fe302c7..e71e2d8 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -33,4 +33,52 @@ export class BlendState * 为alpha通道定义相应渲染目标的混合行为。 */ readonly alpha?: BlendComponent = new BlendComponent(); + + constructor(blend?: BlendState) + { + if (!blend) return; + + if (blend.constantColor) this.constantColor = blend.constantColor; + if (blend.color) this.color = BlendComponent.getInstance(blend.color); + if (blend.alpha) this.alpha = BlendComponent.getInstance(blend.alpha); + } + + /** + * 当混合系数用到了混合常量值时设置混合常量值。 + * + * @param blend + * @returns + */ + getBlendConstantColor?(): IColor + { + const { color, alpha, constantColor } = this; + + // 当混合系数用到了混合常量值时设置混合常量值。 + if (0 + || color?.srcFactor === "constant" + || color?.srcFactor === "one-minus-constant" + || color?.dstFactor === "constant" + || color?.dstFactor === "one-minus-constant" + || alpha?.srcFactor === "constant" + || alpha?.srcFactor === "one-minus-constant" + || alpha?.dstFactor === "constant" + || alpha?.dstFactor === "one-minus-constant" + ) + { + return constantColor ?? [0, 0, 0, 0]; + } + + return undefined; + } + + static getInstance(blend: BlendState): BlendState + { + if (!blend) return undefined; + + if (blend instanceof BlendState) + { + return blend; + } + return new BlendState(blend); + } } diff --git a/src/index.ts b/src/index.ts index 07e3cf1..6ca5223 100644 --- a/src/index.ts +++ b/src/index.ts @@ -33,7 +33,6 @@ export * from "./data/VertexAttributes"; export * from "./data/VertexState"; export * from "./data/Viewport"; -export * from "./utils/getBlendConstantColor"; export * from "./utils/getTexImageSourceSize"; export * from "./utils/getTextureBytesPerPixel"; diff --git a/src/utils/getBlendConstantColor.ts b/src/utils/getBlendConstantColor.ts deleted file mode 100644 index d8585ff..0000000 --- a/src/utils/getBlendConstantColor.ts +++ /dev/null @@ -1,32 +0,0 @@ -import { BlendState } from "../data/BlendState"; -import { IColor } from "../data/RenderPassColorAttachment"; - -/** - * 当混合系数用到了混合常量值时设置混合常量值。 - * - * @param blend - * @returns - */ -export function getBlendConstantColor(blend: BlendState): IColor -{ - if (!blend) return undefined; - - const { color, alpha, constantColor } = blend; - - // 当混合系数用到了混合常量值时设置混合常量值。 - if (0 - || color?.srcFactor === "constant" - || color?.srcFactor === "one-minus-constant" - || color?.dstFactor === "constant" - || color?.dstFactor === "one-minus-constant" - || alpha?.srcFactor === "constant" - || alpha?.srcFactor === "one-minus-constant" - || alpha?.dstFactor === "constant" - || alpha?.dstFactor === "one-minus-constant" - ) - { - return constantColor ?? [0, 0, 0, 0]; - } - - return undefined; -} -- Gitee From 5cb061ead4547285bda244e94c97d14bafa9ce37 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 03:22:10 +0800 Subject: [PATCH 016/105] TextureImageSource.getTexImageSourceSize Texture.getTextureBytesPerPixel TextureImageSource.getTexImageSourceSize --- src/data/BlendState.ts | 6 +- src/data/Texture.ts | 188 ++++++++++++++++++--------- src/data/TextureImageSource.ts | 115 ++++++++++++++++ src/index.ts | 4 +- src/utils/getTexImageSourceSize.ts | 30 ----- src/utils/getTextureBytesPerPixel.ts | 120 ----------------- 6 files changed, 244 insertions(+), 219 deletions(-) create mode 100644 src/data/TextureImageSource.ts delete mode 100644 src/utils/getTexImageSourceSize.ts delete mode 100644 src/utils/getTextureBytesPerPixel.ts diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index e71e2d8..a7720ff 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -49,9 +49,11 @@ export class BlendState * @param blend * @returns */ - getBlendConstantColor?(): IColor + static getBlendConstantColor?(blendState: BlendState): IColor { - const { color, alpha, constantColor } = this; + if (!blendState) return undefined; + + const { color, alpha, constantColor } = blendState; // 当混合系数用到了混合常量值时设置混合常量值。 if (0 diff --git a/src/data/Texture.ts b/src/data/Texture.ts index 864b83f..9a99ecf 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -1,3 +1,5 @@ +import { TextureImageSource } from "./TextureImageSource"; + /** * 纹理 */ @@ -66,6 +68,21 @@ export class Texture * The number of mip levels the texture will contain. */ readonly mipLevelCount?: number; + + + /** + * 获取纹理每个像素占用的字节数量。 + * + * @param format + */ + static getTextureBytesPerPixel(format: ITextureFormat = "rgba8unorm") + { + const bytesPerPixel = formatMap[format]?.bytesPerPixel; + + console.assert(!!bytesPerPixel, `未处理格式 ${format} ，无法查询到该格式中每个像素占用的字节数量！`); + + return bytesPerPixel; + } } /** @@ -75,72 +92,10 @@ export type ITextureSource = ITextureSourceMap[keyof ITextureSourceMap]; export interface ITextureSourceMap { - ITextureImageSource: ITextureImageSource; + ITextureImageSource: TextureImageSource; ITextureDataSource: ITextureDataSource; } -/** - * 纹理的图片资源。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texSubImage2D - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texSubImage3D - * - * 注：不再支持参数 `border` - * - * ### WebGPU - * - * @see GPUQueue.copyExternalImageToTexture - */ -export interface ITextureImageSource -{ - /** - * 数据类型。 - */ - readonly __type?: "TextureImageSource"; - - /** - * 图片资源。 - */ - image: TexImageSource; - - /** - * 读取图片上的像素坐标。 - */ - imageOrigin?: IImageOrigin; - - /** - * 写入纹理的mipmap层级索引。 - */ - mipLevel?: number; - - /** - * Defines the origin of the copy - the minimum corner of the texture sub-region to copy to/from. - * Together with `copySize`, defines the full copy sub-region. - * - * 写入纹理的位置。 - */ - textureOrigin?: ITextureOrigin; - - /** - * Extents of the content to write from `source` to `destination`. - * - * 写入尺寸。 - */ - size?: ITextureSize - - /** - * 是否Y轴翻转图片。 - * - * 注：WebGL（先翻转，再拷贝）与WebGPU（先拷贝，再翻转）处理方式不一样。此次已WebGL为准。当拷贝全图时，效果一致。 - */ - flipY?: boolean; - - /** - * 是否需要预乘透明度。 - */ - premultipliedAlpha?: boolean; -} - /** * 纹理的数据资源。 * @@ -356,4 +311,109 @@ export type ITextureFormat = | "astc-12x10-unorm" | "astc-12x10-unorm-srgb" | "astc-12x12-unorm" - | "astc-12x12-unorm-srgb"; \ No newline at end of file + | "astc-12x12-unorm-srgb"; + +const formatMap: { + [key: string]: { + /** + * 每个像素占用的字节数量 + */ + bytesPerPixel: number + } +} = { + r8unorm: { bytesPerPixel: 1 }, + r8snorm: { bytesPerPixel: 1 }, + r8uint: { bytesPerPixel: 1 }, + r8sint: { bytesPerPixel: 1 }, + r16uint: { bytesPerPixel: 2 }, + r16sint: { bytesPerPixel: 2 }, + r16float: { bytesPerPixel: 2 }, + rg8unorm: { bytesPerPixel: 2 }, + rg8snorm: { bytesPerPixel: 2 }, + rg8uint: { bytesPerPixel: 2 }, + rg8sint: { bytesPerPixel: 2 }, + r32uint: { bytesPerPixel: 4 }, + r32sint: { bytesPerPixel: 4 }, + r32float: { bytesPerPixel: 4 }, + rg16uint: { bytesPerPixel: 4 }, + rg16sint: { bytesPerPixel: 4 }, + rg16float: { bytesPerPixel: 4 }, + rgba8unorm: { bytesPerPixel: 4 }, + "rgba8unorm-srgb": { bytesPerPixel: 4 }, + rgba8snorm: { bytesPerPixel: 4 }, + rgba8uint: { bytesPerPixel: 4 }, + rgba8sint: { bytesPerPixel: 4 }, + bgra8unorm: { bytesPerPixel: 4 }, + "bgra8unorm-srgb": { bytesPerPixel: 4 }, + rgb9e5ufloat: { bytesPerPixel: 4 }, + rgb10a2uint: { bytesPerPixel: 4 }, + rgb10a2unorm: { bytesPerPixel: 4 }, + rg11b10ufloat: { bytesPerPixel: 4 }, + rg32uint: { bytesPerPixel: 8 }, + rg32sint: { bytesPerPixel: 8 }, + rg32float: { bytesPerPixel: 8 }, + rgba16uint: { bytesPerPixel: 8 }, + rgba16sint: { bytesPerPixel: 8 }, + rgba16float: { bytesPerPixel: 8 }, + rgba32uint: { bytesPerPixel: 16 }, + rgba32sint: { bytesPerPixel: 16 }, + rgba32float: { bytesPerPixel: 16 }, + stencil8: { bytesPerPixel: 1 }, + depth16unorm: { bytesPerPixel: 2 }, + depth24plus: { bytesPerPixel: 3 }, + "depth24plus-stencil8": { bytesPerPixel: 4 }, + depth32float: { bytesPerPixel: 4 }, + "depth32float-stencil8": { bytesPerPixel: 5 }, + "bc1-rgba-unorm": undefined, + "bc1-rgba-unorm-srgb": undefined, + "bc2-rgba-unorm": undefined, + "bc2-rgba-unorm-srgb": undefined, + "bc3-rgba-unorm": undefined, + "bc3-rgba-unorm-srgb": undefined, + "bc4-r-unorm": undefined, + "bc4-r-snorm": undefined, + "bc5-rg-unorm": undefined, + "bc5-rg-snorm": undefined, + "bc6h-rgb-ufloat": undefined, + "bc6h-rgb-float": undefined, + "bc7-rgba-unorm": undefined, + "bc7-rgba-unorm-srgb": undefined, + "etc2-rgb8unorm": undefined, + "etc2-rgb8unorm-srgb": undefined, + "etc2-rgb8a1unorm": undefined, + "etc2-rgb8a1unorm-srgb": undefined, + "etc2-rgba8unorm": undefined, + "etc2-rgba8unorm-srgb": undefined, + "eac-r11unorm": undefined, + "eac-r11snorm": undefined, + "eac-rg11unorm": undefined, + "eac-rg11snorm": undefined, + "astc-4x4-unorm": undefined, + "astc-4x4-unorm-srgb": undefined, + "astc-5x4-unorm": undefined, + "astc-5x4-unorm-srgb": undefined, + "astc-5x5-unorm": undefined, + "astc-5x5-unorm-srgb": undefined, + "astc-6x5-unorm": undefined, + "astc-6x5-unorm-srgb": undefined, + "astc-6x6-unorm": undefined, + "astc-6x6-unorm-srgb": undefined, + "astc-8x5-unorm": undefined, + "astc-8x5-unorm-srgb": undefined, + "astc-8x6-unorm": undefined, + "astc-8x6-unorm-srgb": undefined, + "astc-8x8-unorm": undefined, + "astc-8x8-unorm-srgb": undefined, + "astc-10x5-unorm": undefined, + "astc-10x5-unorm-srgb": undefined, + "astc-10x6-unorm": undefined, + "astc-10x6-unorm-srgb": undefined, + "astc-10x8-unorm": undefined, + "astc-10x8-unorm-srgb": undefined, + "astc-10x10-unorm": undefined, + "astc-10x10-unorm-srgb": undefined, + "astc-12x10-unorm": undefined, + "astc-12x10-unorm-srgb": undefined, + "astc-12x12-unorm": undefined, + "astc-12x12-unorm-srgb": undefined, +}; \ No newline at end of file diff --git a/src/data/TextureImageSource.ts b/src/data/TextureImageSource.ts new file mode 100644 index 0000000..b2b1195 --- /dev/null +++ b/src/data/TextureImageSource.ts @@ -0,0 +1,115 @@ +import { IImageOrigin, IImageSize, ITextureOrigin, ITextureSize } from "./Texture"; + +/** + * 纹理的图片资源。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texSubImage2D + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texSubImage3D + * + * 注：不再支持参数 `border` + * + * ### WebGPU + * + * @see GPUQueue.copyExternalImageToTexture + */ +export class TextureImageSource +{ + /** + * 数据类型。 + */ + readonly __type?: "TextureImageSource" = "TextureImageSource"; + + /** + * 图片资源。 + */ + image: TexImageSource; + + /** + * 读取图片上的像素坐标。 + */ + imageOrigin?: IImageOrigin; + + /** + * 写入纹理的mipmap层级索引。 + */ + mipLevel?: number; + + /** + * Defines the origin of the copy - the minimum corner of the texture sub-region to copy to/from. + * Together with `copySize`, defines the full copy sub-region. + * + * 写入纹理的位置。 + */ + textureOrigin?: ITextureOrigin; + + /** + * Extents of the content to write from `source` to `destination`. + * + * 写入尺寸。 + */ + size?: ITextureSize + + /** + * 是否Y轴翻转图片。 + * + * 注：WebGL（先翻转，再拷贝）与WebGPU（先拷贝，再翻转）处理方式不一样。此次已WebGL为准。当拷贝全图时，效果一致。 + */ + flipY?: boolean; + + /** + * 是否需要预乘透明度。 + */ + premultipliedAlpha?: boolean; + + constructor(source?: TextureImageSource) + { + if (!source) return; + + this.image = source.image; + this.imageOrigin = source.imageOrigin; + this.mipLevel = source.mipLevel; + this.textureOrigin = source.textureOrigin; + this.size = source.size; + this.flipY = source.flipY; + this.premultipliedAlpha = source.premultipliedAlpha; + } + + static getInstance(source: TextureImageSource) + { + if (!source) return undefined; + if (source instanceof TextureImageSource) return source; + + return new TextureImageSource(source); + } + + /** + * 获取纹理的图片资源尺寸。 + * + * @param texImageSource 纹理的图片资源。 + * @returns + */ + static getTexImageSourceSize?(source: TextureImageSource): IImageSize + { + const texImageSource = source.image; + + let width: number; + let height: number; + if (texImageSource instanceof VideoFrame) + { + width = texImageSource.codedWidth; + height = texImageSource.codedHeight; + } + else if (texImageSource instanceof HTMLVideoElement) + { + width = texImageSource.videoWidth; + height = texImageSource.videoHeight; + } + else + { + width = texImageSource.width; + height = texImageSource.height; + } + + return [width, height]; + } +} diff --git a/src/index.ts b/src/index.ts index 6ca5223..589b16b 100644 --- a/src/index.ts +++ b/src/index.ts @@ -13,6 +13,7 @@ export * from "./data/CopyTextureToTexture"; export * from "./data/DepthStencilState"; export * from "./data/FragmentState"; export * from "./data/Geometry"; +export * from "./data/TextureImageSource"; export * from "./data/PrimitiveState"; export * from "./data/RenderObject"; export * from "./data/RenderPass"; @@ -33,6 +34,3 @@ export * from "./data/VertexAttributes"; export * from "./data/VertexState"; export * from "./data/Viewport"; -export * from "./utils/getTexImageSourceSize"; -export * from "./utils/getTextureBytesPerPixel"; - diff --git a/src/utils/getTexImageSourceSize.ts b/src/utils/getTexImageSourceSize.ts deleted file mode 100644 index 880d908..0000000 --- a/src/utils/getTexImageSourceSize.ts +++ /dev/null @@ -1,30 +0,0 @@ -import { IImageSize } from "../data/Texture"; - -/** - * 获取纹理的图片资源尺寸。 - * - * @param texImageSource 纹理的图片资源。 - * @returns - */ -export function getTexImageSourceSize(texImageSource: TexImageSource): IImageSize -{ - let width: number; - let height: number; - if (texImageSource instanceof VideoFrame) - { - width = texImageSource.codedWidth; - height = texImageSource.codedHeight; - } - else if (texImageSource instanceof HTMLVideoElement) - { - width = texImageSource.videoWidth; - height = texImageSource.videoHeight; - } - else - { - width = texImageSource.width; - height = texImageSource.height; - } - - return [width, height]; -} \ No newline at end of file diff --git a/src/utils/getTextureBytesPerPixel.ts b/src/utils/getTextureBytesPerPixel.ts deleted file mode 100644 index df111eb..0000000 --- a/src/utils/getTextureBytesPerPixel.ts +++ /dev/null @@ -1,120 +0,0 @@ -import { ITextureFormat } from "../data/Texture"; - -/** - * 获取纹理每个像素占用的字节数量。 - * - * @param format - */ -export function getTextureBytesPerPixel(format: ITextureFormat = "rgba8unorm") -{ - const bytesPerPixel = formatMap[format]?.bytesPerPixel; - - console.assert(!!bytesPerPixel, `未处理格式 ${format} ，无法查询到该格式中每个像素占用的字节数量！`); - - return bytesPerPixel; -} - -const formatMap: { - [key: string]: { - /** - * 每个像素占用的字节数量 - */ - bytesPerPixel: number - } -} = { - r8unorm: { bytesPerPixel: 1 }, - r8snorm: { bytesPerPixel: 1 }, - r8uint: { bytesPerPixel: 1 }, - r8sint: { bytesPerPixel: 1 }, - r16uint: { bytesPerPixel: 2 }, - r16sint: { bytesPerPixel: 2 }, - r16float: { bytesPerPixel: 2 }, - rg8unorm: { bytesPerPixel: 2 }, - rg8snorm: { bytesPerPixel: 2 }, - rg8uint: { bytesPerPixel: 2 }, - rg8sint: { bytesPerPixel: 2 }, - r32uint: { bytesPerPixel: 4 }, - r32sint: { bytesPerPixel: 4 }, - r32float: { bytesPerPixel: 4 }, - rg16uint: { bytesPerPixel: 4 }, - rg16sint: { bytesPerPixel: 4 }, - rg16float: { bytesPerPixel: 4 }, - rgba8unorm: { bytesPerPixel: 4 }, - "rgba8unorm-srgb": { bytesPerPixel: 4 }, - rgba8snorm: { bytesPerPixel: 4 }, - rgba8uint: { bytesPerPixel: 4 }, - rgba8sint: { bytesPerPixel: 4 }, - bgra8unorm: { bytesPerPixel: 4 }, - "bgra8unorm-srgb": { bytesPerPixel: 4 }, - rgb9e5ufloat: { bytesPerPixel: 4 }, - rgb10a2uint: { bytesPerPixel: 4 }, - rgb10a2unorm: { bytesPerPixel: 4 }, - rg11b10ufloat: { bytesPerPixel: 4 }, - rg32uint: { bytesPerPixel: 8 }, - rg32sint: { bytesPerPixel: 8 }, - rg32float: { bytesPerPixel: 8 }, - rgba16uint: { bytesPerPixel: 8 }, - rgba16sint: { bytesPerPixel: 8 }, - rgba16float: { bytesPerPixel: 8 }, - rgba32uint: { bytesPerPixel: 16 }, - rgba32sint: { bytesPerPixel: 16 }, - rgba32float: { bytesPerPixel: 16 }, - stencil8: { bytesPerPixel: 1 }, - depth16unorm: { bytesPerPixel: 2 }, - depth24plus: { bytesPerPixel: 3 }, - "depth24plus-stencil8": { bytesPerPixel: 4 }, - depth32float: { bytesPerPixel: 4 }, - "depth32float-stencil8": { bytesPerPixel: 5 }, - "bc1-rgba-unorm": undefined, - "bc1-rgba-unorm-srgb": undefined, - "bc2-rgba-unorm": undefined, - "bc2-rgba-unorm-srgb": undefined, - "bc3-rgba-unorm": undefined, - "bc3-rgba-unorm-srgb": undefined, - "bc4-r-unorm": undefined, - "bc4-r-snorm": undefined, - "bc5-rg-unorm": undefined, - "bc5-rg-snorm": undefined, - "bc6h-rgb-ufloat": undefined, - "bc6h-rgb-float": undefined, - "bc7-rgba-unorm": undefined, - "bc7-rgba-unorm-srgb": undefined, - "etc2-rgb8unorm": undefined, - "etc2-rgb8unorm-srgb": undefined, - "etc2-rgb8a1unorm": undefined, - "etc2-rgb8a1unorm-srgb": undefined, - "etc2-rgba8unorm": undefined, - "etc2-rgba8unorm-srgb": undefined, - "eac-r11unorm": undefined, - "eac-r11snorm": undefined, - "eac-rg11unorm": undefined, - "eac-rg11snorm": undefined, - "astc-4x4-unorm": undefined, - "astc-4x4-unorm-srgb": undefined, - "astc-5x4-unorm": undefined, - "astc-5x4-unorm-srgb": undefined, - "astc-5x5-unorm": undefined, - "astc-5x5-unorm-srgb": undefined, - "astc-6x5-unorm": undefined, - "astc-6x5-unorm-srgb": undefined, - "astc-6x6-unorm": undefined, - "astc-6x6-unorm-srgb": undefined, - "astc-8x5-unorm": undefined, - "astc-8x5-unorm-srgb": undefined, - "astc-8x6-unorm": undefined, - "astc-8x6-unorm-srgb": undefined, - "astc-8x8-unorm": undefined, - "astc-8x8-unorm-srgb": undefined, - "astc-10x5-unorm": undefined, - "astc-10x5-unorm-srgb": undefined, - "astc-10x6-unorm": undefined, - "astc-10x6-unorm-srgb": undefined, - "astc-10x8-unorm": undefined, - "astc-10x8-unorm-srgb": undefined, - "astc-10x10-unorm": undefined, - "astc-10x10-unorm-srgb": undefined, - "astc-12x10-unorm": undefined, - "astc-12x10-unorm-srgb": undefined, - "astc-12x12-unorm": undefined, - "astc-12x12-unorm-srgb": undefined, -}; \ No newline at end of file -- Gitee From 1b7c34c8cb4c908d99594d8ddd48b6c00d25d6a0 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 03:29:18 +0800 Subject: [PATCH 017/105] RenderPipeline -> Material --- src/data/{RenderPipeline.ts => Material.ts} | 7 ++++--- src/data/RenderObject.ts | 4 ++-- src/index.ts | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) rename src/data/{RenderPipeline.ts => Material.ts} (89%) diff --git a/src/data/RenderPipeline.ts b/src/data/Material.ts similarity index 89% rename from src/data/RenderPipeline.ts rename to src/data/Material.ts index 3255060..ac079cc 100644 --- a/src/data/RenderPipeline.ts +++ b/src/data/Material.ts @@ -3,11 +3,12 @@ import { FragmentState } from "./FragmentState"; import { VertexState } from "./VertexState"; /** - * 渲染管线。 + * 材质。 + * + * 对应WebGPU的Pipeline。 */ -export class RenderPipeline +export class Material { - /** * 标签。 * diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index fe87be7..7dea976 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -3,7 +3,7 @@ import { Geometry } from "./Geometry"; import { ScissorRect } from "./ScissorRect"; import { Uniforms } from "./Uniforms"; import { Viewport } from "./Viewport"; -import { RenderPipeline } from "./RenderPipeline"; +import { Material } from "./Material"; /** * 渲染对象，包含一次渲染时包含的所有数据。 @@ -30,7 +30,7 @@ export class RenderObject /** * 渲染管线描述。 */ - pipeline: RenderPipeline; + pipeline: Material; /** * 渲染几何数据。 diff --git a/src/index.ts b/src/index.ts index 589b16b..90c789f 100644 --- a/src/index.ts +++ b/src/index.ts @@ -20,7 +20,7 @@ export * from "./data/RenderPass"; export * from "./data/RenderPassColorAttachment"; export * from "./data/RenderPassDepthStencilAttachment"; export * from "./data/RenderPassDescriptor"; -export * from "./data/RenderPipeline"; +export * from "./data/Material"; export * from "./data/Sampler"; export * from "./data/ScissorRect"; export * from "./data/StencilFaceState"; -- Gitee From 66ee65bbbf06a40dcff09302d63ddc85dbdec174 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 04:00:34 +0800 Subject: [PATCH 018/105] 1 --- src/data/RenderPassDescriptor.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/data/RenderPassDescriptor.ts b/src/data/RenderPassDescriptor.ts index 6a099e0..d99df35 100644 --- a/src/data/RenderPassDescriptor.ts +++ b/src/data/RenderPassDescriptor.ts @@ -21,7 +21,7 @@ export class RenderPassDescriptor /** * 深度模板附件。 * - * 当使用深度附件时，必须设置，使用默认值可设置为 `{}` 。 + * 当使用深度附件时，必须设置 。 */ readonly depthStencilAttachment?: RenderPassDepthStencilAttachment; -- Gitee From c17c74b510aae1ca7acaa81d03d9eb330202c51e Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 11:40:06 +0800 Subject: [PATCH 019/105] WriteBuffer --- src/data/Buffer.ts | 32 ++------------------------------ src/data/WriteBuffer.ts | 30 ++++++++++++++++++++++++++++++ src/index.ts | 5 +++-- 3 files changed, 35 insertions(+), 32 deletions(-) create mode 100644 src/data/WriteBuffer.ts diff --git a/src/data/Buffer.ts b/src/data/Buffer.ts index 91d6006..81898a7 100644 --- a/src/data/Buffer.ts +++ b/src/data/Buffer.ts @@ -1,4 +1,5 @@ import { TypedArray } from "./TypedArray"; +import { WriteBuffer } from "./WriteBuffer"; /** * 缓冲区 @@ -35,34 +36,5 @@ export class Buffer * * {@link GPUQueue.writeBuffer} */ - writeBuffers?: IWriteBuffer[]; -} - -export interface IWriteBuffer -{ - /** - * GPU缓冲区写入起始位置。 - */ - bufferOffset?: number; - - /** - * 写入缓冲区数据。 - */ - data: ArrayBufferLike | TypedArray; - - /** - * 读取数据的起始位置。 - * - * 默认为 0 。 - * - * 当写入的数据类型为 {@link ArrayBufferLike} 时单位为字节，当数据类型为 {@link TypedArray} 时单位为元素。 - */ - dataOffset?: number; - - /** - * 写入数据尺寸。 - * - * 当写入的数据类型为 {@link ArrayBufferLike} 时单位为字节，当数据类型为 {@link TypedArray} 时单位为元素。 - */ - size?: number; + writeBuffers?: WriteBuffer[]; } diff --git a/src/data/WriteBuffer.ts b/src/data/WriteBuffer.ts new file mode 100644 index 0000000..715ca0e --- /dev/null +++ b/src/data/WriteBuffer.ts @@ -0,0 +1,30 @@ +import { TypedArray } from "./TypedArray"; + +export class WriteBuffer +{ + /** + * GPU缓冲区写入起始位置。 + */ + bufferOffset?: number = 0; + + /** + * 写入缓冲区数据。 + */ + data: ArrayBufferLike | TypedArray; + + /** + * 读取数据的起始位置。 + * + * 默认为 0 。 + * + * 当写入的数据类型为 {@link ArrayBufferLike} 时单位为字节，当数据类型为 {@link TypedArray} 时单位为元素。 + */ + dataOffset?: number = 0; + + /** + * 写入数据尺寸。 + * + * 当写入的数据类型为 {@link ArrayBufferLike} 时单位为字节，当数据类型为 {@link TypedArray} 时单位为元素。 + */ + size?: number; +} diff --git a/src/index.ts b/src/index.ts index 90c789f..7ce560e 100644 --- a/src/index.ts +++ b/src/index.ts @@ -13,19 +13,19 @@ export * from "./data/CopyTextureToTexture"; export * from "./data/DepthStencilState"; export * from "./data/FragmentState"; export * from "./data/Geometry"; -export * from "./data/TextureImageSource"; +export * from "./data/Material"; export * from "./data/PrimitiveState"; export * from "./data/RenderObject"; export * from "./data/RenderPass"; export * from "./data/RenderPassColorAttachment"; export * from "./data/RenderPassDepthStencilAttachment"; export * from "./data/RenderPassDescriptor"; -export * from "./data/Material"; export * from "./data/Sampler"; export * from "./data/ScissorRect"; export * from "./data/StencilFaceState"; export * from "./data/Submit"; export * from "./data/Texture"; +export * from "./data/TextureImageSource"; export * from "./data/TextureView"; export * from "./data/TypedArray"; export * from "./data/Uniforms"; @@ -33,4 +33,5 @@ export * from "./data/UnReadonly"; export * from "./data/VertexAttributes"; export * from "./data/VertexState"; export * from "./data/Viewport"; +export * from "./data/WriteBuffer"; -- Gitee From fe81a8e4034dbf53bc3a5c76a029773bab40cc33 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 12:36:11 +0800 Subject: [PATCH 020/105] TextureImageSource.getInstance --- src/data/BlendState.ts | 2 +- src/data/DrawIndexed.ts | 49 +++++++++++++++++ src/data/DrawVertex.ts | 49 +++++++++++++++++ src/data/Geometry.ts | 97 +++++++--------------------------- src/data/TextureImageSource.ts | 26 ++++----- src/index.ts | 2 + 6 files changed, 131 insertions(+), 94 deletions(-) create mode 100644 src/data/DrawIndexed.ts create mode 100644 src/data/DrawVertex.ts diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index a7720ff..b4c42aa 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -49,7 +49,7 @@ export class BlendState * @param blend * @returns */ - static getBlendConstantColor?(blendState: BlendState): IColor + static getBlendConstantColor(blendState: BlendState): IColor { if (!blendState) return undefined; diff --git a/src/data/DrawIndexed.ts b/src/data/DrawIndexed.ts new file mode 100644 index 0000000..ace0b19 --- /dev/null +++ b/src/data/DrawIndexed.ts @@ -0,0 +1,49 @@ + +/** + * 根据索引数据绘制图元。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements + * @see GPURenderCommandsMixin.drawIndexed + */ +export class DrawIndexed +{ + /** + * 数据类型。 + */ + readonly __type: "DrawIndexed" = "DrawIndexed"; + + /** + * The number of indices to draw. + * + * 绘制的顶点索引数量。 + */ + readonly indexCount: number; + + /** + * The number of instances to draw. + * + * 默认为 1 。 + */ + readonly instanceCount?: number = 1; + + /** + * Offset into the index buffer, in indices, begin drawing from. + * + * 默认为 0 。 + */ + readonly firstIndex?: number = 0; + + constructor(draw: DrawIndexed) + { + if (!draw) return; + + Object.assign(this, draw); + } + + static getInstance(draw: DrawIndexed) + { + if (draw instanceof DrawIndexed) return draw; + + return new DrawIndexed(draw); + } +} diff --git a/src/data/DrawVertex.ts b/src/data/DrawVertex.ts new file mode 100644 index 0000000..4d89f13 --- /dev/null +++ b/src/data/DrawVertex.ts @@ -0,0 +1,49 @@ + +/** + * Draws primitives. + * + * 根据顶点数据绘制图元。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex + * @see GPURenderCommandsMixin.draw + */ +export class DrawVertex +{ + /** + * 数据类型。 + */ + readonly __type: "DrawVertex" = "DrawVertex"; + + /** + * The number of vertices to draw. + */ + readonly vertexCount: number; + + /** + * The number of instances to draw. + * + * 默认为 1 。 + */ + readonly instanceCount?: number = 1; + + /** + * Offset into the vertex buffers, in vertices, to begin drawing from. + * + * 默认为 0。 + */ + readonly firstVertex?: number = 0; + + constructor(draw: DrawVertex) + { + if (!draw) return; + + Object.assign(this, draw); + } + + static getInstance(draw: DrawVertex) + { + if (draw instanceof DrawVertex) return draw; + + return new DrawVertex(draw); + } +} \ No newline at end of file diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index 0fe18c3..126f46f 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -1,3 +1,5 @@ +import { DrawIndexed } from "./DrawIndexed"; +import { DrawVertex } from "./DrawVertex"; import { PrimitiveState } from "./PrimitiveState"; import { VertexAttribute, VertexAttributes } from "./VertexAttributes"; @@ -22,7 +24,7 @@ export class Geometry /** * 顶点属性数据映射。 */ - vertices?: VertexAttributes = {}; + vertices?: VertexAttributes = new VertexAttributes(); /** * 顶点索引数据。 @@ -36,7 +38,7 @@ export class Geometry { if (this._draw) return this._draw; - const instanceCount = this.getInstanceCount(); + const instanceCount = Geometry.getInstanceCount(this); if (this.indices) { @@ -50,12 +52,21 @@ export class Geometry return { __type: "DrawVertex", - vertexCount: this.getNumVertex(), + vertexCount: Geometry.getNumVertex(this), instanceCount, }; } set draw(value: IDraw) { + if (!value) + { + this._draw = undefined; + return; + } + if (value.__type === "DrawVertex") + { + this._draw = DrawVertex.getInstance(value); + } this._draw = value; } protected _draw?: IDraw; @@ -65,9 +76,9 @@ export class Geometry * * @returns 顶点数量。 */ - getNumVertex?() + static getNumVertex(geometry: Geometry) { - const attributes = this.vertices; + const attributes = geometry.vertices; const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => v.stepMode !== "instance"); const count = VertexAttribute.getVertexCount(vertexList[0]); @@ -83,9 +94,9 @@ export class Geometry * * @returns 实例数量。 */ - getInstanceCount?() + static getInstanceCount(geometry: Geometry) { - const attributes = this.vertices; + const attributes = geometry.vertices; const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => v.stepMode === "instance"); const count = VertexAttribute.getVertexCount(vertexList[0]); @@ -105,74 +116,4 @@ export type IIndicesDataTypes = Uint16Array | Uint32Array; /** * 绘制图形。 */ -export type IDraw = IDrawVertex | IDrawIndexed; - -/** - * Draws primitives. - * - * 根据顶点数据绘制图元。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex - * @see GPURenderCommandsMixin.draw - */ -export interface IDrawVertex -{ - /** - * 数据类型。 - */ - readonly __type: "DrawVertex"; - - /** - * The number of vertices to draw. - */ - readonly vertexCount: number; - - /** - * The number of instances to draw. - * - * 默认为 1 。 - */ - readonly instanceCount?: number; - - /** - * Offset into the vertex buffers, in vertices, to begin drawing from. - * - * 默认为 0。 - */ - readonly firstVertex?: number; -} - -/** - * 根据索引数据绘制图元。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements - * @see GPURenderCommandsMixin.drawIndexed - */ -export interface IDrawIndexed -{ - /** - * 数据类型。 - */ - readonly __type: "DrawIndexed"; - - /** - * The number of indices to draw. - * - * 绘制的顶点索引数量。 - */ - readonly indexCount: number; - - /** - * The number of instances to draw. - * - * 默认为 1 。 - */ - readonly instanceCount?: number; - - /** - * Offset into the index buffer, in indices, begin drawing from. - * - * 默认为 0 。 - */ - readonly firstIndex?: number; -} +export type IDraw = DrawVertex | DrawIndexed; diff --git a/src/data/TextureImageSource.ts b/src/data/TextureImageSource.ts index b2b1195..14890cc 100644 --- a/src/data/TextureImageSource.ts +++ b/src/data/TextureImageSource.ts @@ -61,26 +61,22 @@ export class TextureImageSource */ premultipliedAlpha?: boolean; - constructor(source?: TextureImageSource) - { - if (!source) return; - - this.image = source.image; - this.imageOrigin = source.imageOrigin; - this.mipLevel = source.mipLevel; - this.textureOrigin = source.textureOrigin; - this.size = source.size; - this.flipY = source.flipY; - this.premultipliedAlpha = source.premultipliedAlpha; - } - static getInstance(source: TextureImageSource) { if (!source) return undefined; if (source instanceof TextureImageSource) return source; - return new TextureImageSource(source); + let instance = TextureImageSource.cache.get(source); + + if (!instance) + { + instance = new TextureImageSource(); + Object.assign(instance, source); + } + + return instance; } + private static cache = new Map(); /** * 获取纹理的图片资源尺寸。 @@ -88,7 +84,7 @@ export class TextureImageSource * @param texImageSource 纹理的图片资源。 * @returns */ - static getTexImageSourceSize?(source: TextureImageSource): IImageSize + static getTexImageSourceSize(source: TextureImageSource): IImageSize { const texImageSource = source.image; diff --git a/src/index.ts b/src/index.ts index 7ce560e..632dab1 100644 --- a/src/index.ts +++ b/src/index.ts @@ -11,8 +11,10 @@ export * from "./data/CommandEncoder"; export * from "./data/CopyBufferToBuffer"; export * from "./data/CopyTextureToTexture"; export * from "./data/DepthStencilState"; +export * from "./data/DrawVertex"; export * from "./data/FragmentState"; export * from "./data/Geometry"; +export * from "./data/DrawIndexed"; export * from "./data/Material"; export * from "./data/PrimitiveState"; export * from "./data/RenderObject"; -- Gitee From e1d4977ac6e9abbbd2b2532e318e5c4d1abb7322 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 14:11:12 +0800 Subject: [PATCH 021/105] Data --- src/data/Data.ts | 22 ++++++++++++++++++++++ src/data/TextureImageSource.ts | 20 ++------------------ src/data/VertexAttributes.ts | 19 +++++++++++++++---- test/data/Data.spec.ts | 12 ++++++++++++ test/index.spec.ts | 1 + 5 files changed, 52 insertions(+), 22 deletions(-) create mode 100644 src/data/Data.ts create mode 100644 test/data/Data.spec.ts diff --git a/src/data/Data.ts b/src/data/Data.ts new file mode 100644 index 0000000..b2b511e --- /dev/null +++ b/src/data/Data.ts @@ -0,0 +1,22 @@ +/** + * 数据基类。 + */ +export class Data +{ + static getInstance(this: new () => T, source: T): T + { + if (!source) return undefined; + if (source instanceof this) return source; + + let instance = this["cache"].get(source); + + if (!instance) + { + instance = new this(); + Object.assign(instance, source); + } + + return instance; + } + protected static cache = new Map(); +} \ No newline at end of file diff --git a/src/data/TextureImageSource.ts b/src/data/TextureImageSource.ts index 14890cc..f4f2b8d 100644 --- a/src/data/TextureImageSource.ts +++ b/src/data/TextureImageSource.ts @@ -1,3 +1,4 @@ +import { Data } from "./Data"; import { IImageOrigin, IImageSize, ITextureOrigin, ITextureSize } from "./Texture"; /** @@ -12,7 +13,7 @@ import { IImageOrigin, IImageSize, ITextureOrigin, ITextureSize } from "./Textur * * @see GPUQueue.copyExternalImageToTexture */ -export class TextureImageSource +export class TextureImageSource extends Data { /** * 数据类型。 @@ -61,23 +62,6 @@ export class TextureImageSource */ premultipliedAlpha?: boolean; - static getInstance(source: TextureImageSource) - { - if (!source) return undefined; - if (source instanceof TextureImageSource) return source; - - let instance = TextureImageSource.cache.get(source); - - if (!instance) - { - instance = new TextureImageSource(); - Object.assign(instance, source); - } - - return instance; - } - private static cache = new Map(); - /** * 获取纹理的图片资源尺寸。 * diff --git a/src/data/VertexAttributes.ts b/src/data/VertexAttributes.ts index 36ba160..b64abb9 100644 --- a/src/data/VertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -28,7 +28,7 @@ export class VertexAttribute /** * 所在顶点数据中的偏移字节数。 */ - readonly offset?: number; + readonly offset?: number = 0; /** * The stride, in bytes, between elements of this array. @@ -44,8 +44,7 @@ export class VertexAttribute * * 默认 `"vertex"` 。 */ - readonly stepMode?: IVertexStepMode; - + readonly stepMode?: IVertexStepMode = "vertex"; /** * 获取顶点属性数据的顶点数量。 @@ -61,7 +60,7 @@ export class VertexAttribute } // 单个顶点属性数据尺寸。 - const attributeSize = vertexFormatMap[attribute.format].byteSize; + const attributeSize = VertexAttribute.getVertexByteSize(attribute); const offset = attribute.offset || 0; // 一个顶点数据尺寸，可能包括多个顶点属性（例如一个position 和 uv 共 3*4 + 2*4 = 20 字节）。 const arrayStride = attribute.arrayStride || attributeSize; @@ -70,6 +69,18 @@ export class VertexAttribute return attributeCount; } + + /** + * 获取顶点属性数据的字节尺寸。 + * + * @param attribute 顶点属性数据。 + */ + static getVertexByteSize(attribute: VertexAttribute) + { + const attributeSize = vertexFormatMap[attribute.format].byteSize; + + return attributeSize; + } } export type IVertexStepMode = "vertex" | "instance"; diff --git a/test/data/Data.spec.ts b/test/data/Data.spec.ts new file mode 100644 index 0000000..4da8457 --- /dev/null +++ b/test/data/Data.spec.ts @@ -0,0 +1,12 @@ +import { TextureImageSource } from "@feng3d/render-api"; +import { assert, describe, it } from "vitest"; + +describe("Data", () => +{ + it("getInstance", () => + { + const instance = TextureImageSource.getInstance({ image: undefined as any }) + + assert.equal(instance.constructor, TextureImageSource); + }); +}); diff --git a/test/index.spec.ts b/test/index.spec.ts index f2fedc8..9dcf08b 100644 --- a/test/index.spec.ts +++ b/test/index.spec.ts @@ -1,3 +1,4 @@ +import { TextureImageSource } from "@feng3d/render-api"; import { assert, describe, it } from "vitest"; describe("test", () => -- Gitee From cea5fa92450191c05587a7b9596aff8c973bde0e Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 14:25:18 +0800 Subject: [PATCH 022/105] extends Data --- src/data/BlendComponent.ts | 23 +++-------------------- src/data/BlendState.ts | 23 ++--------------------- src/data/DrawIndexed.ts | 17 ++--------------- src/data/VertexAttributes.ts | 3 ++- src/index.ts | 3 ++- 5 files changed, 11 insertions(+), 58 deletions(-) diff --git a/src/data/BlendComponent.ts b/src/data/BlendComponent.ts index 9419f91..8261c61 100644 --- a/src/data/BlendComponent.ts +++ b/src/data/BlendComponent.ts @@ -1,3 +1,5 @@ +import { Data } from "./Data"; + /** * 为颜色或alpha通道定义相应渲染目标的混合行为。 * @@ -10,9 +12,8 @@ * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpucolortargetstate */ -export class BlendComponent +export class BlendComponent extends Data { - /** * 混合方式。 * @@ -41,24 +42,6 @@ export class BlendComponent * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/blendFunc */ readonly dstFactor?: IBlendFactor = "zero"; - - constructor(blend?: BlendComponent) - { - if (!blend) return; - - if (blend.operation) this.operation = blend.operation; - if (blend.srcFactor) this.srcFactor = blend.srcFactor; - if (blend.dstFactor) this.dstFactor = blend.dstFactor; - } - - static getInstance(alpha: BlendComponent): BlendComponent - { - if (alpha === undefined) return undefined; - - if (alpha instanceof BlendComponent) return alpha; - - return new BlendComponent(alpha); - } } export type IBlendOperation = "add" | "subtract" | "reverse-subtract" | "min" | "max"; diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index b4c42aa..0d7e16f 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -1,4 +1,5 @@ import { BlendComponent } from "./BlendComponent"; +import { Data } from "./Data"; import { IColor } from "./RenderPassColorAttachment"; /** @@ -10,7 +11,7 @@ import { IColor } from "./RenderPassColorAttachment"; * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpublendstate */ -export class BlendState +export class BlendState extends Data { /** * 混合时使用的常量值，默认为 [0,0,0,0]。 @@ -34,15 +35,6 @@ export class BlendState */ readonly alpha?: BlendComponent = new BlendComponent(); - constructor(blend?: BlendState) - { - if (!blend) return; - - if (blend.constantColor) this.constantColor = blend.constantColor; - if (blend.color) this.color = BlendComponent.getInstance(blend.color); - if (blend.alpha) this.alpha = BlendComponent.getInstance(blend.alpha); - } - /** * 当混合系数用到了混合常量值时设置混合常量值。 * @@ -72,15 +64,4 @@ export class BlendState return undefined; } - - static getInstance(blend: BlendState): BlendState - { - if (!blend) return undefined; - - if (blend instanceof BlendState) - { - return blend; - } - return new BlendState(blend); - } } diff --git a/src/data/DrawIndexed.ts b/src/data/DrawIndexed.ts index ace0b19..88a491c 100644 --- a/src/data/DrawIndexed.ts +++ b/src/data/DrawIndexed.ts @@ -1,3 +1,4 @@ +import { Data } from "./Data"; /** * 根据索引数据绘制图元。 @@ -5,7 +6,7 @@ * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements * @see GPURenderCommandsMixin.drawIndexed */ -export class DrawIndexed +export class DrawIndexed extends Data { /** * 数据类型。 @@ -32,18 +33,4 @@ export class DrawIndexed * 默认为 0 。 */ readonly firstIndex?: number = 0; - - constructor(draw: DrawIndexed) - { - if (!draw) return; - - Object.assign(this, draw); - } - - static getInstance(draw: DrawIndexed) - { - if (draw instanceof DrawIndexed) return draw; - - return new DrawIndexed(draw); - } } diff --git a/src/data/VertexAttributes.ts b/src/data/VertexAttributes.ts index b64abb9..194d0d4 100644 --- a/src/data/VertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -1,4 +1,5 @@ import { vertexFormatMap } from "../consts/vertexFormatMap"; +import { Data } from "./Data"; /** * 顶点属性数据映射。 @@ -11,7 +12,7 @@ export class VertexAttributes /** * 顶点属性数据。 */ -export class VertexAttribute +export class VertexAttribute extends Data { /** * 顶点数据。 diff --git a/src/index.ts b/src/index.ts index 632dab1..8f40bd9 100644 --- a/src/index.ts +++ b/src/index.ts @@ -10,11 +10,12 @@ export * from "./data/ColorTargetState"; export * from "./data/CommandEncoder"; export * from "./data/CopyBufferToBuffer"; export * from "./data/CopyTextureToTexture"; +export * from "./data/Data"; export * from "./data/DepthStencilState"; +export * from "./data/DrawIndexed"; export * from "./data/DrawVertex"; export * from "./data/FragmentState"; export * from "./data/Geometry"; -export * from "./data/DrawIndexed"; export * from "./data/Material"; export * from "./data/PrimitiveState"; export * from "./data/RenderObject"; -- Gitee From c0c3f65f4e92b9ba216ff796c16bb88b74e89698 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 14:38:11 +0800 Subject: [PATCH 023/105] extends Data --- src/data/Buffer.ts | 3 ++- src/data/BufferBinding.ts | 3 ++- src/data/CanvasContext.ts | 4 +++- src/data/CanvasTexture.ts | 3 ++- src/data/ColorTargetState.ts | 3 ++- src/data/CommandEncoder.ts | 3 ++- src/data/CopyBufferToBuffer.ts | 3 ++- src/data/CopyTextureToTexture.ts | 3 ++- src/data/DepthStencilState.ts | 3 ++- src/data/DrawVertex.ts | 17 ++--------------- src/data/FragmentState.ts | 3 ++- src/data/Geometry.ts | 3 ++- src/data/Material.ts | 3 ++- src/data/PrimitiveState.ts | 4 +++- src/data/RenderObject.ts | 3 ++- src/data/RenderPass.ts | 5 +++-- src/data/RenderPassColorAttachment.ts | 3 ++- src/data/RenderPassDepthStencilAttachment.ts | 3 ++- src/data/RenderPassDescriptor.ts | 3 ++- src/data/Sampler.ts | 3 ++- src/data/ScissorRect.ts | 4 +++- src/data/StencilFaceState.ts | 4 +++- src/data/Submit.ts | 3 ++- src/data/Texture.ts | 9 +++++---- src/data/TextureView.ts | 3 ++- src/data/Uniforms.ts | 3 ++- src/data/VertexAttributes.ts | 2 +- src/data/VertexState.ts | 4 +++- src/data/Viewport.ts | 4 +++- src/data/WriteBuffer.ts | 3 ++- src/index.ts | 2 +- src/{data => types}/UnReadonly.ts | 0 32 files changed, 70 insertions(+), 49 deletions(-) rename src/{data => types}/UnReadonly.ts (100%) diff --git a/src/data/Buffer.ts b/src/data/Buffer.ts index 81898a7..8e8db09 100644 --- a/src/data/Buffer.ts +++ b/src/data/Buffer.ts @@ -1,3 +1,4 @@ +import { Data } from "./Data"; import { TypedArray } from "./TypedArray"; import { WriteBuffer } from "./WriteBuffer"; @@ -10,7 +11,7 @@ import { WriteBuffer } from "./WriteBuffer"; * * {@link GPUBuffer} */ -export class Buffer +export class Buffer extends Data { /** * 标签。 diff --git a/src/data/BufferBinding.ts b/src/data/BufferBinding.ts index e3c2d93..c9c7848 100644 --- a/src/data/BufferBinding.ts +++ b/src/data/BufferBinding.ts @@ -1,3 +1,4 @@ +import { Data } from "./Data"; import { TypedArray } from "./TypedArray"; /** @@ -8,7 +9,7 @@ import { TypedArray } from "./TypedArray"; * * @see GPUBufferBinding */ -export class BufferBinding +export class BufferBinding extends Data { [name: string]: IBufferBindingItem; diff --git a/src/data/CanvasContext.ts b/src/data/CanvasContext.ts index dca9588..2280953 100644 --- a/src/data/CanvasContext.ts +++ b/src/data/CanvasContext.ts @@ -1,9 +1,11 @@ +import { Data } from "./Data"; + /** * @see GPUCanvasContext * @see HTMLCanvasElement.getContext * @see GPUCanvasContext.configure */ -export class CanvasContext +export class CanvasContext extends Data { /** * 画布id diff --git a/src/data/CanvasTexture.ts b/src/data/CanvasTexture.ts index f67eb5b..975f885 100644 --- a/src/data/CanvasTexture.ts +++ b/src/data/CanvasTexture.ts @@ -1,11 +1,12 @@ import { CanvasContext } from "./CanvasContext"; +import { Data } from "./Data"; /** * 画布纹理，从画布的WebGPU上下文获取纹理 * * 注：只在WebGPU上支持。 */ -export class CanvasTexture +export class CanvasTexture extends Data { context: CanvasContext; } diff --git a/src/data/ColorTargetState.ts b/src/data/ColorTargetState.ts index fc392c9..6626a1c 100644 --- a/src/data/ColorTargetState.ts +++ b/src/data/ColorTargetState.ts @@ -1,11 +1,12 @@ import { BlendState } from "./BlendState"; +import { Data } from "./Data"; /** * 属性 `format` 将由渲染通道中附件给出。 * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpucolortargetstate */ -export class ColorTargetState +export class ColorTargetState extends Data { /** * The blending behavior for this color target. If left undefined, disables blending for this diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index f56e01f..340a686 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -1,5 +1,6 @@ import { CopyBufferToBuffer } from "./CopyBufferToBuffer"; import { CopyTextureToTexture } from "./CopyTextureToTexture"; +import { Data } from "./Data"; import { RenderPass } from "./RenderPass"; /** @@ -7,7 +8,7 @@ import { RenderPass } from "./RenderPass"; * * @see https://developer.mozilla.org/en-US/docs/Web/API/GPUCommandEncoder */ -export class CommandEncoder +export class CommandEncoder extends Data { /** * 通道编码器列表。 diff --git a/src/data/CopyBufferToBuffer.ts b/src/data/CopyBufferToBuffer.ts index 26b1f58..cbc5f98 100644 --- a/src/data/CopyBufferToBuffer.ts +++ b/src/data/CopyBufferToBuffer.ts @@ -1,4 +1,5 @@ import { Buffer } from "./Buffer"; +import { Data } from "./Data"; /** * GPU缓冲区之间拷贝。 @@ -6,7 +7,7 @@ import { Buffer } from "./Buffer"; * {@link WebGL2RenderingContextBase.copyBufferSubData} * {@link GPUCommandEncoder.copyBufferToBuffer} */ -export class CopyBufferToBuffer +export class CopyBufferToBuffer extends Data { /** * 数据类型。 diff --git a/src/data/CopyTextureToTexture.ts b/src/data/CopyTextureToTexture.ts index 852d432..a2307c0 100644 --- a/src/data/CopyTextureToTexture.ts +++ b/src/data/CopyTextureToTexture.ts @@ -1,3 +1,4 @@ +import { Data } from "./Data"; import { ITextureOrigin, ITextureSize } from "./Texture"; import { ITextureLike } from "./TextureView"; @@ -6,7 +7,7 @@ import { ITextureLike } from "./TextureView"; * * {@link GPUCommandEncoder.copyTextureToTexture} */ -export class CopyTextureToTexture +export class CopyTextureToTexture extends Data { /** * 数据类型。 diff --git a/src/data/DepthStencilState.ts b/src/data/DepthStencilState.ts index 785d82b..8be7df3 100644 --- a/src/data/DepthStencilState.ts +++ b/src/data/DepthStencilState.ts @@ -1,3 +1,4 @@ +import { Data } from "./Data"; import { ICompareFunction, StencilFaceState } from "./StencilFaceState"; /** @@ -9,7 +10,7 @@ import { ICompareFunction, StencilFaceState } from "./StencilFaceState"; * * @see https://www.orillusion.com/zh/webgpu.html#depth-stencil-state */ -export class DepthStencilState +export class DepthStencilState extends Data { /** * 指示这个 GPURenderPipeline 是否可以修改 depthStencilAttachment 深度值。 diff --git a/src/data/DrawVertex.ts b/src/data/DrawVertex.ts index 4d89f13..1f1ea21 100644 --- a/src/data/DrawVertex.ts +++ b/src/data/DrawVertex.ts @@ -1,3 +1,4 @@ +import { Data } from "./Data"; /** * Draws primitives. @@ -7,7 +8,7 @@ * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex * @see GPURenderCommandsMixin.draw */ -export class DrawVertex +export class DrawVertex extends Data { /** * 数据类型。 @@ -32,18 +33,4 @@ export class DrawVertex * 默认为 0。 */ readonly firstVertex?: number = 0; - - constructor(draw: DrawVertex) - { - if (!draw) return; - - Object.assign(this, draw); - } - - static getInstance(draw: DrawVertex) - { - if (draw instanceof DrawVertex) return draw; - - return new DrawVertex(draw); - } } \ No newline at end of file diff --git a/src/data/FragmentState.ts b/src/data/FragmentState.ts index eb9e945..84a1e4c 100644 --- a/src/data/FragmentState.ts +++ b/src/data/FragmentState.ts @@ -1,11 +1,12 @@ import { ColorTargetState } from "./ColorTargetState"; +import { Data } from "./Data"; /** * 片段着色器阶段描述。 * * {@link GPUFragmentState} */ -export class FragmentState +export class FragmentState extends Data { /** * 着色器代码。 diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index 126f46f..7e59a1c 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -1,3 +1,4 @@ +import { Data } from "./Data"; import { DrawIndexed } from "./DrawIndexed"; import { DrawVertex } from "./DrawVertex"; import { PrimitiveState } from "./PrimitiveState"; @@ -12,7 +13,7 @@ import { VertexAttribute, VertexAttributes } from "./VertexAttributes"; * - 如何渲染 * - 拓扑结构 */ -export class Geometry +export class Geometry extends Data { /** * Describes the primitive-related properties of the pipeline. diff --git a/src/data/Material.ts b/src/data/Material.ts index ac079cc..dea8309 100644 --- a/src/data/Material.ts +++ b/src/data/Material.ts @@ -1,3 +1,4 @@ +import { Data } from "./Data"; import { DepthStencilState } from "./DepthStencilState"; import { FragmentState } from "./FragmentState"; import { VertexState } from "./VertexState"; @@ -7,7 +8,7 @@ import { VertexState } from "./VertexState"; * * 对应WebGPU的Pipeline。 */ -export class Material +export class Material extends Data { /** * 标签。 diff --git a/src/data/PrimitiveState.ts b/src/data/PrimitiveState.ts index edba6da..3c4eb5f 100644 --- a/src/data/PrimitiveState.ts +++ b/src/data/PrimitiveState.ts @@ -1,3 +1,5 @@ +import { Data } from "./Data"; + /** * 图元拓扑结构。 * @@ -5,7 +7,7 @@ * * `stripIndexFormat` 将由引擎自动设置。 */ -export class PrimitiveState +export class PrimitiveState extends Data { /** * The type of primitive to be constructed from the vertex inputs. diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 7dea976..85ab97d 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -4,11 +4,12 @@ import { ScissorRect } from "./ScissorRect"; import { Uniforms } from "./Uniforms"; import { Viewport } from "./Viewport"; import { Material } from "./Material"; +import { Data } from "./Data"; /** * 渲染对象，包含一次渲染时包含的所有数据。 */ -export class RenderObject +export class RenderObject extends Data { /** * 数据类型。 diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index 26ad707..eefdfe6 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -1,12 +1,13 @@ -import { RenderPassDescriptor } from "./RenderPassDescriptor"; +import { Data } from "./Data"; import { RenderObject } from "./RenderObject"; +import { RenderPassDescriptor } from "./RenderPassDescriptor"; /** * WebGL渲染通道 * * 包含渲染通道描述以及需要渲染的对象列表。 */ -export class RenderPass +export class RenderPass extends Data { /** * 数据类型。 diff --git a/src/data/RenderPassColorAttachment.ts b/src/data/RenderPassColorAttachment.ts index d6740a9..4c9ea5e 100644 --- a/src/data/RenderPassColorAttachment.ts +++ b/src/data/RenderPassColorAttachment.ts @@ -1,9 +1,10 @@ +import { Data } from "./Data"; import { TextureView } from "./TextureView"; /** * 渲染通道颜色附件。 */ -export class RenderPassColorAttachment +export class RenderPassColorAttachment extends Data { /** * 颜色附件视图。 diff --git a/src/data/RenderPassDepthStencilAttachment.ts b/src/data/RenderPassDepthStencilAttachment.ts index 7b8587d..06b446e 100644 --- a/src/data/RenderPassDepthStencilAttachment.ts +++ b/src/data/RenderPassDepthStencilAttachment.ts @@ -1,9 +1,10 @@ +import { Data } from "./Data"; import { TextureView } from "./TextureView"; /** * 深度模板附件。 */ -export class RenderPassDepthStencilAttachment +export class RenderPassDepthStencilAttachment extends Data { /** * 深度附件视图。 diff --git a/src/data/RenderPassDescriptor.ts b/src/data/RenderPassDescriptor.ts index d99df35..9afbbab 100644 --- a/src/data/RenderPassDescriptor.ts +++ b/src/data/RenderPassDescriptor.ts @@ -1,10 +1,11 @@ +import { Data } from "./Data"; import { RenderPassColorAttachment } from "./RenderPassColorAttachment"; import { RenderPassDepthStencilAttachment } from "./RenderPassDepthStencilAttachment"; /** * 渲染通道描述 */ -export class RenderPassDescriptor +export class RenderPassDescriptor extends Data { /** * 标签。 diff --git a/src/data/Sampler.ts b/src/data/Sampler.ts index f451728..5b98d13 100644 --- a/src/data/Sampler.ts +++ b/src/data/Sampler.ts @@ -1,3 +1,4 @@ +import { Data } from "./Data"; import { ICompareFunction } from "./StencilFaceState"; /** @@ -10,7 +11,7 @@ import { ICompareFunction } from "./StencilFaceState"; * @see https://www.orillusion.com/zh/webgpu.html#dictdef-gpusamplerdescriptor * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter */ -export class Sampler +export class Sampler extends Data { /** * 标签。 diff --git a/src/data/ScissorRect.ts b/src/data/ScissorRect.ts index 3afa933..7f82485 100644 --- a/src/data/ScissorRect.ts +++ b/src/data/ScissorRect.ts @@ -1,3 +1,5 @@ +import { Data } from "./Data"; + /** * 剪刀盒。 * @@ -17,7 +19,7 @@ * @see https://www.orillusion.com/zh/webgpu.html#dom-gpurenderpassencoder-setscissorrect * */ -export class ScissorRect +export class ScissorRect extends Data { /** * 是否为Y轴朝上。 diff --git a/src/data/StencilFaceState.ts b/src/data/StencilFaceState.ts index a9c4247..024d2c5 100644 --- a/src/data/StencilFaceState.ts +++ b/src/data/StencilFaceState.ts @@ -1,9 +1,11 @@ +import { Data } from "./Data"; + /** * {@link GPUStencilFaceState} * * @see https://www.orillusion.com/zh/webgpu.html#dictdef-gpustencilfacestate */ -export class StencilFaceState +export class StencilFaceState extends Data { /** * 在测试片元与 depthStencilAttachment 模板值时使用的 GPUCompareFunction。 diff --git a/src/data/Submit.ts b/src/data/Submit.ts index fa3cbcd..16cb507 100644 --- a/src/data/Submit.ts +++ b/src/data/Submit.ts @@ -1,11 +1,12 @@ import { CommandEncoder } from "./CommandEncoder"; +import { Data } from "./Data"; /** * 一次 GPU 提交。 * * @see https://developer.mozilla.org/en-US/docs/Web/API/GPUQueue/submit */ -export class Submit +export class Submit extends Data { /** * 命令编码器列表。 diff --git a/src/data/Texture.ts b/src/data/Texture.ts index 9a99ecf..37c780d 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -1,9 +1,10 @@ +import { Data } from "./Data"; import { TextureImageSource } from "./TextureImageSource"; /** * 纹理 */ -export class Texture +export class Texture extends Data { /** * 标签。 @@ -32,7 +33,7 @@ export class Texture * @see GPUQueue.copyExternalImageToTexture * @see GPUQueue.writeTexture */ - sources?: readonly ITextureSource[]; + sources?: readonly TextureSource[]; /** * 初始化纹理后是否生成mipmap @@ -50,7 +51,7 @@ export class Texture * @see GPUQueue.copyExternalImageToTexture * @see GPUQueue.writeTexture */ - writeTextures?: readonly ITextureSource[]; + writeTextures?: readonly TextureSource[]; /** * 纹理维度，默认为 "2d" 。 @@ -88,7 +89,7 @@ export class Texture /** * 纹理资源。 */ -export type ITextureSource = ITextureSourceMap[keyof ITextureSourceMap]; +export type TextureSource = ITextureSourceMap[keyof ITextureSourceMap]; export interface ITextureSourceMap { diff --git a/src/data/TextureView.ts b/src/data/TextureView.ts index c0b6dee..ed15265 100644 --- a/src/data/TextureView.ts +++ b/src/data/TextureView.ts @@ -1,9 +1,10 @@ +import { Data } from "./Data"; import { Texture } from "./Texture"; /** * 纹理视图。 */ -export class TextureView +export class TextureView extends Data { /** * 标签。 diff --git a/src/data/Uniforms.ts b/src/data/Uniforms.ts index d0812fc..e6103d8 100644 --- a/src/data/Uniforms.ts +++ b/src/data/Uniforms.ts @@ -1,9 +1,10 @@ import { BufferBinding, IBufferBindingItem } from "./BufferBinding"; +import { Data } from "./Data"; /** * Uniform 数据 */ -export class Uniforms +export class Uniforms extends Data { [key: string]: IUniformType; } diff --git a/src/data/VertexAttributes.ts b/src/data/VertexAttributes.ts index 194d0d4..2fef1bc 100644 --- a/src/data/VertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -4,7 +4,7 @@ import { Data } from "./Data"; /** * 顶点属性数据映射。 */ -export class VertexAttributes +export class VertexAttributes extends Data { [name: string]: VertexAttribute; } diff --git a/src/data/VertexState.ts b/src/data/VertexState.ts index 122479a..820123e 100644 --- a/src/data/VertexState.ts +++ b/src/data/VertexState.ts @@ -1,7 +1,9 @@ +import { Data } from "./Data"; + /** * 顶点着色器阶段描述。 */ -export class VertexState +export class VertexState extends Data { /** * 着色器代码。 diff --git a/src/data/Viewport.ts b/src/data/Viewport.ts index 68951c1..6def1b9 100644 --- a/src/data/Viewport.ts +++ b/src/data/Viewport.ts @@ -1,3 +1,5 @@ +import { Data } from "./Data"; + /** * 视窗。 * @@ -17,7 +19,7 @@ * @see https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-setviewport * */ -export class Viewport +export class Viewport extends Data { /** * 是否为Y轴朝上。 diff --git a/src/data/WriteBuffer.ts b/src/data/WriteBuffer.ts index 715ca0e..8a8da51 100644 --- a/src/data/WriteBuffer.ts +++ b/src/data/WriteBuffer.ts @@ -1,6 +1,7 @@ +import { Data } from "./Data"; import { TypedArray } from "./TypedArray"; -export class WriteBuffer +export class WriteBuffer extends Data { /** * GPU缓冲区写入起始位置。 diff --git a/src/index.ts b/src/index.ts index 8f40bd9..a90d887 100644 --- a/src/index.ts +++ b/src/index.ts @@ -32,7 +32,7 @@ export * from "./data/TextureImageSource"; export * from "./data/TextureView"; export * from "./data/TypedArray"; export * from "./data/Uniforms"; -export * from "./data/UnReadonly"; +export * from "./types/UnReadonly"; export * from "./data/VertexAttributes"; export * from "./data/VertexState"; export * from "./data/Viewport"; diff --git a/src/data/UnReadonly.ts b/src/types/UnReadonly.ts similarity index 100% rename from src/data/UnReadonly.ts rename to src/types/UnReadonly.ts -- Gitee From 2ced4f3535d599055478ce4f3e95d57e4cdc1523 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 14:46:14 +0800 Subject: [PATCH 024/105] extends Data --- src/data/ScissorRect.ts | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/data/ScissorRect.ts b/src/data/ScissorRect.ts index 7f82485..6439a0c 100644 --- a/src/data/ScissorRect.ts +++ b/src/data/ScissorRect.ts @@ -13,8 +13,6 @@ import { Data } from "./Data"; * * x+width ≤ this.[[attachment_size]].width. * * y+height ≤ this.[[attachment_size]].height. * - * {@link GPURenderPassEncoder.setScissorRect} - * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/scissor * @see https://www.orillusion.com/zh/webgpu.html#dom-gpurenderpassencoder-setscissorrect * -- Gitee From 7c5bf1dbd8074fcc37b04982a35b021fdaea7125 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 16:58:17 +0800 Subject: [PATCH 025/105] Data.getInstance --- src/data/CommandEncoder.ts | 26 ++++++++++++++++++++++++- src/data/Data.ts | 40 +++++++++++++++++++++++++++++++++----- src/data/Submit.ts | 11 ++++++++++- test/data/Data.spec.ts | 26 ++++++++++++++++++++++++- 4 files changed, 95 insertions(+), 8 deletions(-) diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index 340a686..00ed2ae 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -15,7 +15,31 @@ export class CommandEncoder extends Data * * 包括计算通道编码器、渲染通道编码器 以及 GPU中缓存与纹理之间拷贝。 */ - passEncoders: IPassEncoder[] = []; + get passEncoders(): IPassEncoder[] + { + return this._passEncoders; + } + set passEncoders(value: IPassEncoder[]) + { + if (!value) this._passEncoders = []; + this._passEncoders = value.map((v) => + { + if (v.__type === "RenderPass") + { + return RenderPass.getInstance(v); + } + if (v.__type === "CopyTextureToTexture") + { + return CopyTextureToTexture.getInstance(v); + } + if (v.__type === "CopyBufferToBuffer") + { + return CopyBufferToBuffer.getInstance(v); + } + return v; + }); + } + protected _passEncoders?: IPassEncoder[] = []; } /** diff --git a/src/data/Data.ts b/src/data/Data.ts index b2b511e..9c866b3 100644 --- a/src/data/Data.ts +++ b/src/data/Data.ts @@ -8,15 +8,45 @@ export class Data if (!source) return undefined; if (source instanceof this) return source; - let instance = this["cache"].get(source); + let instance = Data.cache.get(source); + if (instance) return instance; - if (!instance) + if (source instanceof this) return source; + let cls = this; + + const __type__ = source['__type__']; + + if (__type__) { - instance = new this(); - Object.assign(instance, source); + cls = Data.classMap.get(__type__); + console.assert(!!cls, `类型 ${__type__} 未定义，请使用 @Data.reg 进行注册！`); } + instance = new cls(); + Object.assign(instance, source); + return instance; } + + /** + * + * @param cls + */ + static reg(cls: new () => any) + { + console.assert(cls['getInstance'] === Data.getInstance, `对象 ${cls} 需要继承 ${Data}`); + // + const __type__ = new cls().__type__; + console.assert(!!__type__, `类型 ${cls} 属性 __type__ 未定义。`); + // + Data.classMap.set(__type__, cls); + } + + static getCls(__type__: string) + { + return Data.classMap.get(__type__); + } + protected static cache = new Map(); -} \ No newline at end of file + protected static classMap = new Map(); +} diff --git a/src/data/Submit.ts b/src/data/Submit.ts index 16cb507..0b462af 100644 --- a/src/data/Submit.ts +++ b/src/data/Submit.ts @@ -11,5 +11,14 @@ export class Submit extends Data /** * 命令编码器列表。 */ - commandEncoders: CommandEncoder[]; + get commandEncoders(): CommandEncoder[] + { + return this._commandEncoders; + } + set commandEncoders(value: CommandEncoder[]) + { + if (!value) return; + this._commandEncoders = value.map((v) => CommandEncoder.getInstance(v)); + } + protected _commandEncoders?: CommandEncoder[]; } diff --git a/test/data/Data.spec.ts b/test/data/Data.spec.ts index 4da8457..a8f241a 100644 --- a/test/data/Data.spec.ts +++ b/test/data/Data.spec.ts @@ -1,6 +1,21 @@ -import { TextureImageSource } from "@feng3d/render-api"; +import { CopyBufferToBuffer, Data, TextureImageSource } from "@feng3d/render-api"; import { assert, describe, it } from "vitest"; +declare module "@feng3d/render-api" +{ + export interface DataMap + { + A: A; + } +} + +@Data.reg +export class A extends Data +{ + __type__: 'A' = 'A'; + a = 1; +} + describe("Data", () => { it("getInstance", () => @@ -8,5 +23,14 @@ describe("Data", () => const instance = TextureImageSource.getInstance({ image: undefined as any }) assert.equal(instance.constructor, TextureImageSource); + + assert.equal(new CopyBufferToBuffer().__type, "CopyBufferToBuffer"); + }); + + it("getInstance", () => + { + const a = Data.getInstance({ __type__: 'A1', a: 2 }); + + assert.equal(a.constructor, A); }); }); -- Gitee From de4df493d23ef5dbebed4605034f6960d62e3c55 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 16:59:36 +0800 Subject: [PATCH 026/105] Data.getInstance --- test/data/Data.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/data/Data.spec.ts b/test/data/Data.spec.ts index a8f241a..2297da1 100644 --- a/test/data/Data.spec.ts +++ b/test/data/Data.spec.ts @@ -29,7 +29,7 @@ describe("Data", () => it("getInstance", () => { - const a = Data.getInstance({ __type__: 'A1', a: 2 }); + const a = Data.getInstance({ __type__: 'A', a: 2 }); assert.equal(a.constructor, A); }); -- Gitee From f8c2aaa2686702571cd090c9f492266ba842bc50 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 17:11:56 +0800 Subject: [PATCH 027/105] BlendState.color: BlendComponent --- src/data/BlendState.ts | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index 0d7e16f..390b69d 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -28,7 +28,18 @@ export class BlendState extends Data /** * 为颜色通道定义相应渲染目标的混合行为。 */ - readonly color?: BlendComponent = new BlendComponent(); + get color(): BlendComponent + { + return this._color; + } + set color(value: BlendComponent) + { + if (!value) this._color = undefined; + if (value === this._color) return; + this._color = BlendComponent.getInstance(value); + } + + protected _color?: BlendComponent; /** * 为alpha通道定义相应渲染目标的混合行为。 -- Gitee From bb3fe981036f21f94e04bc047f41ed4e612f3e45 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 17:46:46 +0800 Subject: [PATCH 028/105] Data.assign --- src/data/BlendState.ts | 13 +--------- src/data/Data.ts | 57 +++++++++++++++++++++++++++++++++++++++++- 2 files changed, 57 insertions(+), 13 deletions(-) diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index 390b69d..0d7e16f 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -28,18 +28,7 @@ export class BlendState extends Data /** * 为颜色通道定义相应渲染目标的混合行为。 */ - get color(): BlendComponent - { - return this._color; - } - set color(value: BlendComponent) - { - if (!value) this._color = undefined; - if (value === this._color) return; - this._color = BlendComponent.getInstance(value); - } - - protected _color?: BlendComponent; + readonly color?: BlendComponent = new BlendComponent(); /** * 为alpha通道定义相应渲染目标的混合行为。 diff --git a/src/data/Data.ts b/src/data/Data.ts index 9c866b3..1376584 100644 --- a/src/data/Data.ts +++ b/src/data/Data.ts @@ -16,6 +16,8 @@ export class Data const __type__ = source['__type__']; + console.assert(cls !== Data as any || !!__type__, `直接使用 Data.getInstance 时，必须定义属性 __type__ ！`); + if (__type__) { cls = Data.classMap.get(__type__); @@ -23,7 +25,10 @@ export class Data } instance = new cls(); - Object.assign(instance, source); + + this['assign'](instance, source); + + Data.cache.set(source, instance); return instance; } @@ -47,6 +52,56 @@ export class Data return Data.classMap.get(__type__); } + static assign(target: any, source: any) + { + Object.keys(source).forEach((key) => + { + setValue(target, source, key); + }); + + function setValue(target: any, source: any, key: string) + { + const value = source[key]; + + // 基本类型 + if (!value || typeof value !== 'object') + { + target[key] = value; + return; + } + + // 处理数据类型 + if (value['__type__']) + { + target[key] = Data.getInstance(value); + return; + } + + // 处理数组 + if (Array.isArray(value)) + { + target[key] = []; + target[key].length = value.length; + value.forEach((_item, i) => + { + setValue(target[key], value, i as any); + }); + return; + } + + // 处理对象 + const oldValue = target[key]; + if (oldValue?.constructor?.getInstance) + { + target[key] = oldValue.constructor.getInstance(value); + return; + } + + // 默认处理 + target[key] = value; + } + } + protected static cache = new Map(); protected static classMap = new Map(); } -- Gitee From 60d16a6c6994cda5b20422382f8bb802248ab5cb Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 18:30:19 +0800 Subject: [PATCH 029/105] Data --- test/data/Data.spec.ts | 64 ++++++++++++++++++++++++++++++++---------- 1 file changed, 49 insertions(+), 15 deletions(-) diff --git a/test/data/Data.spec.ts b/test/data/Data.spec.ts index 2297da1..939e6a7 100644 --- a/test/data/Data.spec.ts +++ b/test/data/Data.spec.ts @@ -1,21 +1,6 @@ import { CopyBufferToBuffer, Data, TextureImageSource } from "@feng3d/render-api"; import { assert, describe, it } from "vitest"; -declare module "@feng3d/render-api" -{ - export interface DataMap - { - A: A; - } -} - -@Data.reg -export class A extends Data -{ - __type__: 'A' = 'A'; - a = 1; -} - describe("Data", () => { it("getInstance", () => @@ -29,8 +14,57 @@ describe("Data", () => it("getInstance", () => { + @Data.reg + class A extends Data + { + __type__: 'A' = 'A'; + a = 1; + } + const a = Data.getInstance({ __type__: 'A', a: 2 }); assert.equal(a.constructor, A); }); + + it("getInstance", () => + { + @Data.reg + class B extends Data + { + __type__?: 'B' = 'B'; + b = true; + } + + @Data.reg + class AA extends Data + { + __type__?: 'AA' = 'AA'; + n = 1; + + b0? = true; + + s? = "s"; + + obj?: any; + + b? = new B(); + + arr?: B[]; + } + + const a = AA.getInstance({ + __type__: 'AA', + n: 2, + b0: false, + s: "s2", + obj: { a: 1 }, + b: { b: false }, + arr: [{ __type__: "B", b: false }, { b: true }, new B()], + }); + + console.log(a); + assert.equal(a.constructor, AA); + assert.equal(a.b!.constructor, B); + assert.equal(a.arr![0]!.constructor, B); + }); }); -- Gitee From 811cc624baf69fa45c0dad0466f4da59c486fe7e Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 19:01:37 +0800 Subject: [PATCH 030/105] @Data.reg __type__ --- src/data/BlendComponent.ts | 3 +++ src/data/BlendState.ts | 3 +++ src/data/Buffer.ts | 5 ++++- src/data/BufferBinding.ts | 5 ++--- src/data/CanvasContext.ts | 3 +++ src/data/CanvasTexture.ts | 3 +++ src/data/ColorTargetState.ts | 3 +++ src/data/CommandEncoder.ts | 3 +++ src/data/CopyBufferToBuffer.ts | 1 + src/data/CopyTextureToTexture.ts | 1 + src/data/DepthStencilState.ts | 3 +++ src/data/DrawIndexed.ts | 1 + src/data/DrawVertex.ts | 1 + src/data/FragmentState.ts | 3 +++ src/data/Geometry.ts | 3 +++ src/data/Material.ts | 3 +++ src/data/PrimitiveState.ts | 3 +++ src/data/RenderObject.ts | 7 +++++-- src/data/RenderPass.ts | 1 + src/data/RenderPassColorAttachment.ts | 3 +++ src/data/RenderPassDepthStencilAttachment.ts | 3 +++ src/data/RenderPassDescriptor.ts | 3 +++ src/data/Sampler.ts | 3 +++ src/data/ScissorRect.ts | 3 +++ src/data/StencilFaceState.ts | 3 +++ src/data/Submit.ts | 3 +++ src/data/Texture.ts | 3 +++ src/data/TextureImageSource.ts | 1 + src/data/TextureView.ts | 3 +++ src/data/Uniforms.ts | 5 +++++ src/data/VertexAttributes.ts | 5 +++++ src/data/VertexState.ts | 3 +++ src/data/Viewport.ts | 3 +++ src/data/WriteBuffer.ts | 5 ++++- src/index.ts | 2 +- src/{data => types}/TypedArray.ts | 0 36 files changed, 98 insertions(+), 8 deletions(-) rename src/{data => types}/TypedArray.ts (100%) diff --git a/src/data/BlendComponent.ts b/src/data/BlendComponent.ts index 8261c61..7062179 100644 --- a/src/data/BlendComponent.ts +++ b/src/data/BlendComponent.ts @@ -12,8 +12,11 @@ import { Data } from "./Data"; * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpucolortargetstate */ +@Data.reg export class BlendComponent extends Data { + __type__?: "BlendComponent" = "BlendComponent"; + /** * 混合方式。 * diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index 0d7e16f..dec8bc8 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -11,8 +11,11 @@ import { IColor } from "./RenderPassColorAttachment"; * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpublendstate */ +@Data.reg export class BlendState extends Data { + __type__?: "BlendState" = "BlendState"; + /** * 混合时使用的常量值，默认为 [0,0,0,0]。 * diff --git a/src/data/Buffer.ts b/src/data/Buffer.ts index 8e8db09..cf99058 100644 --- a/src/data/Buffer.ts +++ b/src/data/Buffer.ts @@ -1,5 +1,5 @@ import { Data } from "./Data"; -import { TypedArray } from "./TypedArray"; +import { TypedArray } from "../types/TypedArray"; import { WriteBuffer } from "./WriteBuffer"; /** @@ -11,8 +11,11 @@ import { WriteBuffer } from "./WriteBuffer"; * * {@link GPUBuffer} */ +@Data.reg export class Buffer extends Data { + __type__?: "Buffer" = "Buffer"; + /** * 标签。 * diff --git a/src/data/BufferBinding.ts b/src/data/BufferBinding.ts index c9c7848..5688896 100644 --- a/src/data/BufferBinding.ts +++ b/src/data/BufferBinding.ts @@ -1,5 +1,4 @@ -import { Data } from "./Data"; -import { TypedArray } from "./TypedArray"; +import { TypedArray } from "../types/TypedArray"; /** * 缓冲区绑定。 @@ -9,7 +8,7 @@ import { TypedArray } from "./TypedArray"; * * @see GPUBufferBinding */ -export class BufferBinding extends Data +export class BufferBinding { [name: string]: IBufferBindingItem; diff --git a/src/data/CanvasContext.ts b/src/data/CanvasContext.ts index 2280953..165ebb5 100644 --- a/src/data/CanvasContext.ts +++ b/src/data/CanvasContext.ts @@ -5,8 +5,11 @@ import { Data } from "./Data"; * @see HTMLCanvasElement.getContext * @see GPUCanvasContext.configure */ +@Data.reg export class CanvasContext extends Data { + __type__?: "CanvasContext" = "CanvasContext"; + /** * 画布id */ diff --git a/src/data/CanvasTexture.ts b/src/data/CanvasTexture.ts index 975f885..def5277 100644 --- a/src/data/CanvasTexture.ts +++ b/src/data/CanvasTexture.ts @@ -6,7 +6,10 @@ import { Data } from "./Data"; * * 注：只在WebGPU上支持。 */ +@Data.reg export class CanvasTexture extends Data { + __type__?: "CanvasTexture" = "CanvasTexture"; + context: CanvasContext; } diff --git a/src/data/ColorTargetState.ts b/src/data/ColorTargetState.ts index 6626a1c..4bc8e3a 100644 --- a/src/data/ColorTargetState.ts +++ b/src/data/ColorTargetState.ts @@ -6,8 +6,11 @@ import { Data } from "./Data"; * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpucolortargetstate */ +@Data.reg export class ColorTargetState extends Data { + __type__?: "ColorTargetState" = "ColorTargetState"; + /** * The blending behavior for this color target. If left undefined, disables blending for this * color target. diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index 00ed2ae..93d452a 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -8,8 +8,11 @@ import { RenderPass } from "./RenderPass"; * * @see https://developer.mozilla.org/en-US/docs/Web/API/GPUCommandEncoder */ +@Data.reg export class CommandEncoder extends Data { + __type__?: "CommandEncoder" = "CommandEncoder"; + /** * 通道编码器列表。 * diff --git a/src/data/CopyBufferToBuffer.ts b/src/data/CopyBufferToBuffer.ts index cbc5f98..9f9fe86 100644 --- a/src/data/CopyBufferToBuffer.ts +++ b/src/data/CopyBufferToBuffer.ts @@ -7,6 +7,7 @@ import { Data } from "./Data"; * {@link WebGL2RenderingContextBase.copyBufferSubData} * {@link GPUCommandEncoder.copyBufferToBuffer} */ +@Data.reg export class CopyBufferToBuffer extends Data { /** diff --git a/src/data/CopyTextureToTexture.ts b/src/data/CopyTextureToTexture.ts index a2307c0..e57172e 100644 --- a/src/data/CopyTextureToTexture.ts +++ b/src/data/CopyTextureToTexture.ts @@ -7,6 +7,7 @@ import { ITextureLike } from "./TextureView"; * * {@link GPUCommandEncoder.copyTextureToTexture} */ +@Data.reg export class CopyTextureToTexture extends Data { /** diff --git a/src/data/DepthStencilState.ts b/src/data/DepthStencilState.ts index 8be7df3..e13f303 100644 --- a/src/data/DepthStencilState.ts +++ b/src/data/DepthStencilState.ts @@ -10,8 +10,11 @@ import { ICompareFunction, StencilFaceState } from "./StencilFaceState"; * * @see https://www.orillusion.com/zh/webgpu.html#depth-stencil-state */ +@Data.reg export class DepthStencilState extends Data { + __type__?: "DepthStencilState" = "DepthStencilState"; + /** * 指示这个 GPURenderPipeline 是否可以修改 depthStencilAttachment 深度值。 * diff --git a/src/data/DrawIndexed.ts b/src/data/DrawIndexed.ts index 88a491c..0c94c2e 100644 --- a/src/data/DrawIndexed.ts +++ b/src/data/DrawIndexed.ts @@ -6,6 +6,7 @@ import { Data } from "./Data"; * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements * @see GPURenderCommandsMixin.drawIndexed */ +@Data.reg export class DrawIndexed extends Data { /** diff --git a/src/data/DrawVertex.ts b/src/data/DrawVertex.ts index 1f1ea21..aa66d27 100644 --- a/src/data/DrawVertex.ts +++ b/src/data/DrawVertex.ts @@ -8,6 +8,7 @@ import { Data } from "./Data"; * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex * @see GPURenderCommandsMixin.draw */ +@Data.reg export class DrawVertex extends Data { /** diff --git a/src/data/FragmentState.ts b/src/data/FragmentState.ts index 84a1e4c..736c372 100644 --- a/src/data/FragmentState.ts +++ b/src/data/FragmentState.ts @@ -6,8 +6,11 @@ import { Data } from "./Data"; * * {@link GPUFragmentState} */ +@Data.reg export class FragmentState extends Data { + __type__?: "FragmentState" = "FragmentState"; + /** * 着色器代码。 */ diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index 7e59a1c..e033214 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -13,8 +13,11 @@ import { VertexAttribute, VertexAttributes } from "./VertexAttributes"; * - 如何渲染 * - 拓扑结构 */ +@Data.reg export class Geometry extends Data { + __type__?: "Geometry" = "Geometry"; + /** * Describes the primitive-related properties of the pipeline. * diff --git a/src/data/Material.ts b/src/data/Material.ts index dea8309..e1c7870 100644 --- a/src/data/Material.ts +++ b/src/data/Material.ts @@ -8,8 +8,11 @@ import { VertexState } from "./VertexState"; * * 对应WebGPU的Pipeline。 */ +@Data.reg export class Material extends Data { + __type__?: "Material" = "Material"; + /** * 标签。 * diff --git a/src/data/PrimitiveState.ts b/src/data/PrimitiveState.ts index 3c4eb5f..f4658c6 100644 --- a/src/data/PrimitiveState.ts +++ b/src/data/PrimitiveState.ts @@ -7,8 +7,11 @@ import { Data } from "./Data"; * * `stripIndexFormat` 将由引擎自动设置。 */ +@Data.reg export class PrimitiveState extends Data { + __type__?: "PrimitiveState" = "PrimitiveState"; + /** * The type of primitive to be constructed from the vertex inputs. * diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 85ab97d..d37f45b 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,16 +1,19 @@ import { ShaderMacro } from "../Macro"; +import { Data } from "./Data"; import { Geometry } from "./Geometry"; +import { Material } from "./Material"; import { ScissorRect } from "./ScissorRect"; import { Uniforms } from "./Uniforms"; import { Viewport } from "./Viewport"; -import { Material } from "./Material"; -import { Data } from "./Data"; /** * 渲染对象，包含一次渲染时包含的所有数据。 */ +@Data.reg export class RenderObject extends Data { + __type__?: "RenderObject" = "RenderObject"; + /** * 数据类型。 */ diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index eefdfe6..fcff6d6 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -7,6 +7,7 @@ import { RenderPassDescriptor } from "./RenderPassDescriptor"; * * 包含渲染通道描述以及需要渲染的对象列表。 */ +@Data.reg export class RenderPass extends Data { /** diff --git a/src/data/RenderPassColorAttachment.ts b/src/data/RenderPassColorAttachment.ts index 4c9ea5e..9ba337d 100644 --- a/src/data/RenderPassColorAttachment.ts +++ b/src/data/RenderPassColorAttachment.ts @@ -4,8 +4,11 @@ import { TextureView } from "./TextureView"; /** * 渲染通道颜色附件。 */ +@Data.reg export class RenderPassColorAttachment extends Data { + __type__?: "RenderPassColorAttachment" = "RenderPassColorAttachment"; + /** * 颜色附件视图。 * diff --git a/src/data/RenderPassDepthStencilAttachment.ts b/src/data/RenderPassDepthStencilAttachment.ts index 06b446e..260689e 100644 --- a/src/data/RenderPassDepthStencilAttachment.ts +++ b/src/data/RenderPassDepthStencilAttachment.ts @@ -4,8 +4,11 @@ import { TextureView } from "./TextureView"; /** * 深度模板附件。 */ +@Data.reg export class RenderPassDepthStencilAttachment extends Data { + __type__?: "RenderPassDepthStencilAttachment" = "RenderPassDepthStencilAttachment"; + /** * 深度附件视图。 * diff --git a/src/data/RenderPassDescriptor.ts b/src/data/RenderPassDescriptor.ts index 9afbbab..75f48c5 100644 --- a/src/data/RenderPassDescriptor.ts +++ b/src/data/RenderPassDescriptor.ts @@ -5,8 +5,11 @@ import { RenderPassDepthStencilAttachment } from "./RenderPassDepthStencilAttach /** * 渲染通道描述 */ +@Data.reg export class RenderPassDescriptor extends Data { + __type__?: "RenderPassDescriptor" = "RenderPassDescriptor"; + /** * 标签。 * diff --git a/src/data/Sampler.ts b/src/data/Sampler.ts index 5b98d13..04ee393 100644 --- a/src/data/Sampler.ts +++ b/src/data/Sampler.ts @@ -11,8 +11,11 @@ import { ICompareFunction } from "./StencilFaceState"; * @see https://www.orillusion.com/zh/webgpu.html#dictdef-gpusamplerdescriptor * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter */ +@Data.reg export class Sampler extends Data { + __type__?: "Sampler" = "Sampler"; + /** * 标签。 * diff --git a/src/data/ScissorRect.ts b/src/data/ScissorRect.ts index 6439a0c..bf7a586 100644 --- a/src/data/ScissorRect.ts +++ b/src/data/ScissorRect.ts @@ -17,8 +17,11 @@ import { Data } from "./Data"; * @see https://www.orillusion.com/zh/webgpu.html#dom-gpurenderpassencoder-setscissorrect * */ +@Data.reg export class ScissorRect extends Data { + __type__?: "ScissorRect" = "ScissorRect"; + /** * 是否为Y轴朝上。 * diff --git a/src/data/StencilFaceState.ts b/src/data/StencilFaceState.ts index 024d2c5..6c02d74 100644 --- a/src/data/StencilFaceState.ts +++ b/src/data/StencilFaceState.ts @@ -5,8 +5,11 @@ import { Data } from "./Data"; * * @see https://www.orillusion.com/zh/webgpu.html#dictdef-gpustencilfacestate */ +@Data.reg export class StencilFaceState extends Data { + __type__?: "StencilFaceState" = "StencilFaceState"; + /** * 在测试片元与 depthStencilAttachment 模板值时使用的 GPUCompareFunction。 * diff --git a/src/data/Submit.ts b/src/data/Submit.ts index 0b462af..1be06fe 100644 --- a/src/data/Submit.ts +++ b/src/data/Submit.ts @@ -6,8 +6,11 @@ import { Data } from "./Data"; * * @see https://developer.mozilla.org/en-US/docs/Web/API/GPUQueue/submit */ +@Data.reg export class Submit extends Data { + __type__?: "Submit" = "Submit"; + /** * 命令编码器列表。 */ diff --git a/src/data/Texture.ts b/src/data/Texture.ts index 37c780d..71dfed5 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -4,8 +4,11 @@ import { TextureImageSource } from "./TextureImageSource"; /** * 纹理 */ +@Data.reg export class Texture extends Data { + __type__?: "Texture" = "Texture"; + /** * 标签。 * diff --git a/src/data/TextureImageSource.ts b/src/data/TextureImageSource.ts index f4f2b8d..5ab8db5 100644 --- a/src/data/TextureImageSource.ts +++ b/src/data/TextureImageSource.ts @@ -13,6 +13,7 @@ import { IImageOrigin, IImageSize, ITextureOrigin, ITextureSize } from "./Textur * * @see GPUQueue.copyExternalImageToTexture */ +@Data.reg export class TextureImageSource extends Data { /** diff --git a/src/data/TextureView.ts b/src/data/TextureView.ts index ed15265..ef3bb3d 100644 --- a/src/data/TextureView.ts +++ b/src/data/TextureView.ts @@ -4,8 +4,11 @@ import { Texture } from "./Texture"; /** * 纹理视图。 */ +@Data.reg export class TextureView extends Data { + __type__?: "TextureView" = "TextureView"; + /** * 标签。 * diff --git a/src/data/Uniforms.ts b/src/data/Uniforms.ts index e6103d8..88c62e1 100644 --- a/src/data/Uniforms.ts +++ b/src/data/Uniforms.ts @@ -4,8 +4,13 @@ import { Data } from "./Data"; /** * Uniform 数据 */ +@Data.reg export class Uniforms extends Data { + // __type__?: "Uniforms" = "Uniforms"; + + // [key: `u_${string}`]: IUniformType; + [key: string]: IUniformType; } diff --git a/src/data/VertexAttributes.ts b/src/data/VertexAttributes.ts index 2fef1bc..5171566 100644 --- a/src/data/VertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -4,8 +4,13 @@ import { Data } from "./Data"; /** * 顶点属性数据映射。 */ +@Data.reg export class VertexAttributes extends Data { + // __type__?: "VertexAttributes" = "VertexAttributes"; + + // [name: `a_${string}`]: VertexAttribute; + [name: string]: VertexAttribute; } diff --git a/src/data/VertexState.ts b/src/data/VertexState.ts index 820123e..f9884f9 100644 --- a/src/data/VertexState.ts +++ b/src/data/VertexState.ts @@ -3,8 +3,11 @@ import { Data } from "./Data"; /** * 顶点着色器阶段描述。 */ +@Data.reg export class VertexState extends Data { + __type__?: "VertexState" = "VertexState"; + /** * 着色器代码。 */ diff --git a/src/data/Viewport.ts b/src/data/Viewport.ts index 6def1b9..92b9b83 100644 --- a/src/data/Viewport.ts +++ b/src/data/Viewport.ts @@ -19,8 +19,11 @@ import { Data } from "./Data"; * @see https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-setviewport * */ +@Data.reg export class Viewport extends Data { + __type__?: "Viewport" = "Viewport"; + /** * 是否为Y轴朝上。 * diff --git a/src/data/WriteBuffer.ts b/src/data/WriteBuffer.ts index 8a8da51..c0e21f8 100644 --- a/src/data/WriteBuffer.ts +++ b/src/data/WriteBuffer.ts @@ -1,8 +1,11 @@ +import { TypedArray } from "../types/TypedArray"; import { Data } from "./Data"; -import { TypedArray } from "./TypedArray"; +@Data.reg export class WriteBuffer extends Data { + __type__?: "WriteBuffer" = "WriteBuffer"; + /** * GPU缓冲区写入起始位置。 */ diff --git a/src/index.ts b/src/index.ts index a90d887..f984346 100644 --- a/src/index.ts +++ b/src/index.ts @@ -30,7 +30,7 @@ export * from "./data/Submit"; export * from "./data/Texture"; export * from "./data/TextureImageSource"; export * from "./data/TextureView"; -export * from "./data/TypedArray"; +export * from "./types/TypedArray"; export * from "./data/Uniforms"; export * from "./types/UnReadonly"; export * from "./data/VertexAttributes"; diff --git a/src/data/TypedArray.ts b/src/types/TypedArray.ts similarity index 100% rename from src/data/TypedArray.ts rename to src/types/TypedArray.ts -- Gitee From 399c33f1561ff4d6ad68a1dabf0115530bb15b09 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 19:22:15 +0800 Subject: [PATCH 031/105] =?UTF-8?q?=5F=5Ftype=20=E8=B0=83=E6=95=B4?= =?UTF-8?q?=E4=B8=BA=20=5F=5Ftype=5F=5F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/data/CommandEncoder.ts | 6 ++-- src/data/CopyBufferToBuffer.ts | 2 +- src/data/CopyTextureToTexture.ts | 2 +- src/data/Data.ts | 26 +++++++------- src/data/DrawIndexed.ts | 2 +- src/data/DrawVertex.ts | 2 +- src/data/Geometry.ts | 6 ++-- src/data/RenderObject.ts | 2 +- src/data/RenderPass.ts | 2 +- src/data/Texture.ts | 2 +- src/data/TextureImageSource.ts | 2 +- test/data/Data.spec.ts | 61 ++++++++++++++++++++++++++++++-- 12 files changed, 86 insertions(+), 29 deletions(-) diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index 93d452a..c32e454 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -27,15 +27,15 @@ export class CommandEncoder extends Data if (!value) this._passEncoders = []; this._passEncoders = value.map((v) => { - if (v.__type === "RenderPass") + if (v.__type__ === "RenderPass") { return RenderPass.getInstance(v); } - if (v.__type === "CopyTextureToTexture") + if (v.__type__ === "CopyTextureToTexture") { return CopyTextureToTexture.getInstance(v); } - if (v.__type === "CopyBufferToBuffer") + if (v.__type__ === "CopyBufferToBuffer") { return CopyBufferToBuffer.getInstance(v); } diff --git a/src/data/CopyBufferToBuffer.ts b/src/data/CopyBufferToBuffer.ts index 9f9fe86..efc8c21 100644 --- a/src/data/CopyBufferToBuffer.ts +++ b/src/data/CopyBufferToBuffer.ts @@ -13,7 +13,7 @@ export class CopyBufferToBuffer extends Data /** * 数据类型。 */ - readonly __type: "CopyBufferToBuffer" = "CopyBufferToBuffer"; + readonly __type__: "CopyBufferToBuffer" = "CopyBufferToBuffer"; /** * 源缓冲区。 diff --git a/src/data/CopyTextureToTexture.ts b/src/data/CopyTextureToTexture.ts index e57172e..3d3010b 100644 --- a/src/data/CopyTextureToTexture.ts +++ b/src/data/CopyTextureToTexture.ts @@ -13,7 +13,7 @@ export class CopyTextureToTexture extends Data /** * 数据类型。 */ - readonly __type: "CopyTextureToTexture" = "CopyTextureToTexture"; + readonly __type__: "CopyTextureToTexture" = "CopyTextureToTexture"; /** * Combined with `copySize`, defines the region of the source texture subresources. diff --git a/src/data/Data.ts b/src/data/Data.ts index 1376584..a5aeb7d 100644 --- a/src/data/Data.ts +++ b/src/data/Data.ts @@ -42,7 +42,7 @@ export class Data console.assert(cls['getInstance'] === Data.getInstance, `对象 ${cls} 需要继承 ${Data}`); // const __type__ = new cls().__type__; - console.assert(!!__type__, `类型 ${cls} 属性 __type__ 未定义。`); + console.assert(!!__type__, `类型 ${cls.name} 属性 __type__ 未定义。`); // Data.classMap.set(__type__, cls); } @@ -64,7 +64,7 @@ export class Data const value = source[key]; // 基本类型 - if (!value || typeof value !== 'object') + if (!value || typeof value !== 'object' || Array.isArray(value)) { target[key] = value; return; @@ -77,17 +77,17 @@ export class Data return; } - // 处理数组 - if (Array.isArray(value)) - { - target[key] = []; - target[key].length = value.length; - value.forEach((_item, i) => - { - setValue(target[key], value, i as any); - }); - return; - } + // // 处理数组 + // if (Array.isArray(value)) + // { + // target[key] = []; + // target[key].length = value.length; + // value.forEach((_item, i) => + // { + // setValue(target[key], value, i as any); + // }); + // return; + // } // 处理对象 const oldValue = target[key]; diff --git a/src/data/DrawIndexed.ts b/src/data/DrawIndexed.ts index 0c94c2e..da8cf18 100644 --- a/src/data/DrawIndexed.ts +++ b/src/data/DrawIndexed.ts @@ -12,7 +12,7 @@ export class DrawIndexed extends Data /** * 数据类型。 */ - readonly __type: "DrawIndexed" = "DrawIndexed"; + readonly __type__: "DrawIndexed" = "DrawIndexed"; /** * The number of indices to draw. diff --git a/src/data/DrawVertex.ts b/src/data/DrawVertex.ts index aa66d27..441c36f 100644 --- a/src/data/DrawVertex.ts +++ b/src/data/DrawVertex.ts @@ -14,7 +14,7 @@ export class DrawVertex extends Data /** * 数据类型。 */ - readonly __type: "DrawVertex" = "DrawVertex"; + readonly __type__: "DrawVertex" = "DrawVertex"; /** * The number of vertices to draw. diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index e033214..8e7b673 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -47,7 +47,7 @@ export class Geometry extends Data if (this.indices) { return { - __type: "DrawIndexed", + __type__: "DrawIndexed", indexCount: this.indices.length, firstIndex: 0, instanceCount, @@ -55,7 +55,7 @@ export class Geometry extends Data } return { - __type: "DrawVertex", + __type__: "DrawVertex", vertexCount: Geometry.getNumVertex(this), instanceCount, }; @@ -67,7 +67,7 @@ export class Geometry extends Data this._draw = undefined; return; } - if (value.__type === "DrawVertex") + if (value.__type__ === "DrawVertex") { this._draw = DrawVertex.getInstance(value); } diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index d37f45b..04c1a48 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -17,7 +17,7 @@ export class RenderObject extends Data /** * 数据类型。 */ - readonly __type?: "RenderObject" = "RenderObject"; + readonly __type__?: "RenderObject" = "RenderObject"; /** * 视窗。 diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index fcff6d6..964cea5 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -13,7 +13,7 @@ export class RenderPass extends Data /** * 数据类型。 */ - readonly __type?: "RenderPass" = "RenderPass"; + readonly __type__?: "RenderPass" = "RenderPass"; /** * 渲染通道描述 diff --git a/src/data/Texture.ts b/src/data/Texture.ts index 71dfed5..c507b65 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -115,7 +115,7 @@ export interface ITextureDataSource /** * 数据类型。 */ - readonly __type: "TextureDataSource"; + readonly __type__: "TextureDataSource"; /** * 纹理数据。 diff --git a/src/data/TextureImageSource.ts b/src/data/TextureImageSource.ts index 5ab8db5..59c2853 100644 --- a/src/data/TextureImageSource.ts +++ b/src/data/TextureImageSource.ts @@ -19,7 +19,7 @@ export class TextureImageSource extends Data /** * 数据类型。 */ - readonly __type?: "TextureImageSource" = "TextureImageSource"; + readonly __type__?: "TextureImageSource" = "TextureImageSource"; /** * 图片资源。 diff --git a/test/data/Data.spec.ts b/test/data/Data.spec.ts index 939e6a7..e39f737 100644 --- a/test/data/Data.spec.ts +++ b/test/data/Data.spec.ts @@ -1,4 +1,4 @@ -import { CopyBufferToBuffer, Data, TextureImageSource } from "@feng3d/render-api"; +import { CommandEncoder, CopyBufferToBuffer, Data, Submit, TextureImageSource } from "@feng3d/render-api"; import { assert, describe, it } from "vitest"; describe("Data", () => @@ -9,7 +9,7 @@ describe("Data", () => assert.equal(instance.constructor, TextureImageSource); - assert.equal(new CopyBufferToBuffer().__type, "CopyBufferToBuffer"); + assert.equal(new CopyBufferToBuffer().__type__, "CopyBufferToBuffer"); }); it("getInstance", () => @@ -67,4 +67,61 @@ describe("Data", () => assert.equal(a.b!.constructor, B); assert.equal(a.arr![0]!.constructor, B); }); + + it("getInstance", () => + { + + const submit: Submit = { // 一次GPU提交 + commandEncoders: [ // 命令编码列表 + { + passEncoders: [ // 通道编码列表 + { // 渲染通道 + descriptor: { // 渲染通道描述 + colorAttachments: [{ // 颜色附件 + // view: { texture: { context: { canvasId: "canvas.id" } } }, // 绘制到canvas上 + clearValue: [0.0, 0.0, 0.0, 1.0], // 渲染前填充颜色 + }], + }, + renderObjects: [{ // 渲染对象 + pipeline: { // 渲染管线 + vertex: { // 顶点着色器 + code: ` + @vertex + fn main( + @location(0) position: vec2, + ) -> @builtin(position) vec4 { + return vec4(position, 0.0, 1.0); + } + ` }, + fragment: { // 片段着色器 + code: ` + @binding(0) @group(0) var color : vec4; + @fragment + fn main() -> @location(0) vec4f { + return color; + } + ` }, + }, + geometry: { + vertices: { + position: { data: new Float32Array([0.0, 0.5, -0.5, -0.5, 0.5, -0.5]), format: "float32x2" }, // 顶点坐标数据 + }, + indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 + draw: { __type__: "DrawIndexed", indexCount: 3 }, // 绘制命令 + }, + uniforms: { color: [1, 0, 0, 0] }, // Uniform 颜色值。 + }] + }, + ] + } + ], + }; + + const instance = Submit.getInstance(submit); + console.log(instance); + assert.equal(instance.constructor, Submit); + + assert.equal(instance.commandEncoders[0].constructor, CommandEncoder); + + }); }); -- Gitee From e74d87d27e8ad4c6f2ad8cf92048fb60c22e0674 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 19:49:53 +0800 Subject: [PATCH 032/105] =?UTF-8?q?=E4=BD=BF=E7=94=A8=20@Data.type(Type)?= =?UTF-8?q?=20=E7=B1=BB=E5=9E=8B=E6=A0=87=E8=AE=B0=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/data/Data.ts | 41 +++++++++++++++++++++++++----------- src/data/Uniforms.ts | 5 ++++- src/data/VertexAttributes.ts | 3 +++ test/data/Data.spec.ts | 2 +- 4 files changed, 37 insertions(+), 14 deletions(-) diff --git a/src/data/Data.ts b/src/data/Data.ts index a5aeb7d..5086963 100644 --- a/src/data/Data.ts +++ b/src/data/Data.ts @@ -47,6 +47,21 @@ export class Data Data.classMap.set(__type__, cls); } + /** + * 使用 @Data.type(Type) 类型标记。 + * @param type + */ + static type(type: new () => any) + { + return function (target: any, propertyKey: any) + { + console.assert(!!type?.["getInstance"], `类型 ${type.name} 未注册，请使用 @Data.reg 进行注册！`); + // 实现类型标记逻辑 + target.constructor.propertyType = target.constructor.propertyType || {}; + target.constructor.propertyType[propertyKey] = type; + }; + } + static getCls(__type__: string) { return Data.classMap.get(__type__); @@ -64,7 +79,7 @@ export class Data const value = source[key]; // 基本类型 - if (!value || typeof value !== 'object' || Array.isArray(value)) + if (!value || typeof value !== 'object') { target[key] = value; return; @@ -77,17 +92,19 @@ export class Data return; } - // // 处理数组 - // if (Array.isArray(value)) - // { - // target[key] = []; - // target[key].length = value.length; - // value.forEach((_item, i) => - // { - // setValue(target[key], value, i as any); - // }); - // return; - // } + // 处理类型标记 + const propertyType = target.constructor.propertyType?.[key]; + if (propertyType) + { + if (Array.isArray(value)) + { + target[key] = value.map((v) => propertyType.getInstance(v)); + return; + } + + target[key] = propertyType.getInstance(value); + return; + } // 处理对象 const oldValue = target[key]; diff --git a/src/data/Uniforms.ts b/src/data/Uniforms.ts index 88c62e1..75172a2 100644 --- a/src/data/Uniforms.ts +++ b/src/data/Uniforms.ts @@ -10,10 +10,13 @@ export class Uniforms extends Data // __type__?: "Uniforms" = "Uniforms"; // [key: `u_${string}`]: IUniformType; - + [key: string]: IUniformType; } +// @ts-ignore +Uniforms.prototype["__type__"] = "Uniforms"; + /** * Uniform 类型 */ diff --git a/src/data/VertexAttributes.ts b/src/data/VertexAttributes.ts index 5171566..92f87f3 100644 --- a/src/data/VertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -14,6 +14,9 @@ export class VertexAttributes extends Data [name: string]: VertexAttribute; } +// @ts-ignore +VertexAttributes.prototype["__type__"] = "VertexAttributes"; + /** * 顶点属性数据。 */ diff --git a/test/data/Data.spec.ts b/test/data/Data.spec.ts index e39f737..ee58663 100644 --- a/test/data/Data.spec.ts +++ b/test/data/Data.spec.ts @@ -49,6 +49,7 @@ describe("Data", () => b? = new B(); + @Data.type(B) arr?: B[]; } @@ -70,7 +71,6 @@ describe("Data", () => it("getInstance", () => { - const submit: Submit = { // 一次GPU提交 commandEncoders: [ // 命令编码列表 { -- Gitee From f0c7bc5d28eb151afe68631d58a3b979508ee5e8 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 20:05:14 +0800 Subject: [PATCH 033/105] @Data.type --- src/data/CommandEncoder.ts | 39 ++++++++++++++++++-------------------- src/data/Data.ts | 11 ++++++----- src/data/Submit.ts | 12 ++---------- test/data/Data.spec.ts | 4 +++- 4 files changed, 29 insertions(+), 37 deletions(-) diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index c32e454..aa8d011 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -3,6 +3,8 @@ import { CopyTextureToTexture } from "./CopyTextureToTexture"; import { Data } from "./Data"; import { RenderPass } from "./RenderPass"; + + /** * 命令编码器。 * @@ -18,33 +20,28 @@ export class CommandEncoder extends Data * * 包括计算通道编码器、渲染通道编码器 以及 GPU中缓存与纹理之间拷贝。 */ - get passEncoders(): IPassEncoder[] + @Data.type(getPassEncoder) + passEncoders: IPassEncoder[] +} + +function getPassEncoder(v: IPassEncoder) +{ + if (v.__type__ === "RenderPass" || !v.__type__) + { + return RenderPass.getInstance(v); + } + if (v.__type__ === "CopyTextureToTexture") { - return this._passEncoders; + return CopyTextureToTexture.getInstance(v); } - set passEncoders(value: IPassEncoder[]) + if (v.__type__ === "CopyBufferToBuffer") { - if (!value) this._passEncoders = []; - this._passEncoders = value.map((v) => - { - if (v.__type__ === "RenderPass") - { - return RenderPass.getInstance(v); - } - if (v.__type__ === "CopyTextureToTexture") - { - return CopyTextureToTexture.getInstance(v); - } - if (v.__type__ === "CopyBufferToBuffer") - { - return CopyBufferToBuffer.getInstance(v); - } - return v; - }); + return CopyBufferToBuffer.getInstance(v); } - protected _passEncoders?: IPassEncoder[] = []; + return v; } + /** * 通道编码器。 * diff --git a/src/data/Data.ts b/src/data/Data.ts index 5086963..bb4456f 100644 --- a/src/data/Data.ts +++ b/src/data/Data.ts @@ -49,13 +49,12 @@ export class Data /** * 使用 @Data.type(Type) 类型标记。 - * @param type + * @param type 类定义或者解析数据的函数。 */ - static type(type: new () => any) + static type(type: (new () => any) | ((...args: any[]) => any)) { return function (target: any, propertyKey: any) { - console.assert(!!type?.["getInstance"], `类型 ${type.name} 未注册，请使用 @Data.reg 进行注册！`); // 实现类型标记逻辑 target.constructor.propertyType = target.constructor.propertyType || {}; target.constructor.propertyType[propertyKey] = type; @@ -98,11 +97,13 @@ export class Data { if (Array.isArray(value)) { - target[key] = value.map((v) => propertyType.getInstance(v)); + target[key] = value.map((v) => + (propertyType.getInstance ? propertyType.getInstance(v) : propertyType(v)) + ); return; } - target[key] = propertyType.getInstance(value); + target[key] = propertyType.getInstance ? propertyType.getInstance(value) : propertyType(value); return; } diff --git a/src/data/Submit.ts b/src/data/Submit.ts index 1be06fe..e483a4e 100644 --- a/src/data/Submit.ts +++ b/src/data/Submit.ts @@ -14,14 +14,6 @@ export class Submit extends Data /** * 命令编码器列表。 */ - get commandEncoders(): CommandEncoder[] - { - return this._commandEncoders; - } - set commandEncoders(value: CommandEncoder[]) - { - if (!value) return; - this._commandEncoders = value.map((v) => CommandEncoder.getInstance(v)); - } - protected _commandEncoders?: CommandEncoder[]; + @Data.type(CommandEncoder) + commandEncoders: CommandEncoder[]; } diff --git a/test/data/Data.spec.ts b/test/data/Data.spec.ts index ee58663..ee254be 100644 --- a/test/data/Data.spec.ts +++ b/test/data/Data.spec.ts @@ -1,4 +1,4 @@ -import { CommandEncoder, CopyBufferToBuffer, Data, Submit, TextureImageSource } from "@feng3d/render-api"; +import { CommandEncoder, CopyBufferToBuffer, Data, RenderPass, Submit, TextureImageSource } from "@feng3d/render-api"; import { assert, describe, it } from "vitest"; describe("Data", () => @@ -123,5 +123,7 @@ describe("Data", () => assert.equal(instance.commandEncoders[0].constructor, CommandEncoder); + assert.equal(instance.commandEncoders[0].passEncoders[0].constructor, RenderPass); + }); }); -- Gitee From 1f8d82dd0744f63671f92d9687249ed4654e0043 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 20:21:18 +0800 Subject: [PATCH 034/105] @Data.type --- src/Macro.ts | 7 ++++++- src/data/Data.ts | 12 +++++++----- src/data/RenderObject.ts | 8 ++++++-- src/data/RenderPass.ts | 6 ++++-- test/data/Data.spec.ts | 2 +- 5 files changed, 24 insertions(+), 11 deletions(-) diff --git a/src/Macro.ts b/src/Macro.ts index 6f66343..33d0fb4 100644 --- a/src/Macro.ts +++ b/src/Macro.ts @@ -1,8 +1,13 @@ +import { Data } from "./data/Data"; + /** * 着色器宏定义 */ -export class ShaderMacro +@Data.reg +export class ShaderMacro extends Data { + __type__?: "ShaderMacro" = "ShaderMacro"; + /** * UV中的U缩放 */ diff --git a/src/data/Data.ts b/src/data/Data.ts index bb4456f..37f2524 100644 --- a/src/data/Data.ts +++ b/src/data/Data.ts @@ -39,7 +39,7 @@ export class Data */ static reg(cls: new () => any) { - console.assert(cls['getInstance'] === Data.getInstance, `对象 ${cls} 需要继承 ${Data}`); + console.assert(!!cls[getInstance], `对象 ${cls} 需要继承 ${Data.name} 或者 实现 static ${getInstance} 方法！`); // const __type__ = new cls().__type__; console.assert(!!__type__, `类型 ${cls.name} 属性 __type__ 未定义。`); @@ -98,20 +98,20 @@ export class Data if (Array.isArray(value)) { target[key] = value.map((v) => - (propertyType.getInstance ? propertyType.getInstance(v) : propertyType(v)) + (propertyType[getInstance] ? propertyType[getInstance](v) : propertyType(v)) ); return; } - target[key] = propertyType.getInstance ? propertyType.getInstance(value) : propertyType(value); + target[key] = propertyType[getInstance] ? propertyType[getInstance](value) : propertyType(value); return; } // 处理对象 const oldValue = target[key]; - if (oldValue?.constructor?.getInstance) + if (oldValue?.constructor?.[getInstance]) { - target[key] = oldValue.constructor.getInstance(value); + target[key] = oldValue.constructor[getInstance](value); return; } @@ -123,3 +123,5 @@ export class Data protected static cache = new Map(); protected static classMap = new Map(); } + +const getInstance = 'getInstance'; \ No newline at end of file diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 04c1a48..eb3266b 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -12,8 +12,6 @@ import { Viewport } from "./Viewport"; @Data.reg export class RenderObject extends Data { - __type__?: "RenderObject" = "RenderObject"; - /** * 数据类型。 */ @@ -24,26 +22,31 @@ export class RenderObject extends Data * * 描述渲染在画布的哪个区域，默认整个画布。 */ + @Data.type(Viewport) viewport?: Viewport; /** * 光栅化阶段中使用的剪刀矩形。 */ + @Data.type(ScissorRect) scissorRect?: ScissorRect; /** * 渲染管线描述。 */ + @Data.type(Material) pipeline: Material; /** * 渲染几何数据。 */ + @Data.type(Geometry) geometry: Geometry; /** * Uniform变量数据 */ + @Data.type(Uniforms) readonly uniforms?: Uniforms = new Uniforms(); _version?: number; @@ -51,5 +54,6 @@ export class RenderObject extends Data /** * shader 中的 宏 */ + @Data.type(ShaderMacro) shaderMacro?: ShaderMacro = new ShaderMacro(); } diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index 964cea5..bba8dd1 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -18,12 +18,14 @@ export class RenderPass extends Data /** * 渲染通道描述 */ - readonly descriptor?: RenderPassDescriptor = new RenderPassDescriptor(); + @Data.type(RenderPassDescriptor) + readonly descriptor?: RenderPassDescriptor; /** * 渲染对象列表 */ - readonly renderObjects?: readonly IRenderPassObject[] = []; + @Data.type(RenderObject) + readonly renderObjects?: readonly IRenderPassObject[]; // /** // * 渲染不被遮挡查询结果。具体数据保存在各子项的"result"属性中。 diff --git a/test/data/Data.spec.ts b/test/data/Data.spec.ts index ee254be..9ae4fee 100644 --- a/test/data/Data.spec.ts +++ b/test/data/Data.spec.ts @@ -119,7 +119,7 @@ describe("Data", () => const instance = Submit.getInstance(submit); console.log(instance); - assert.equal(instance.constructor, Submit); + assert.equal(instance.constructor, Submit); assert.equal(instance.commandEncoders[0].constructor, CommandEncoder); -- Gitee From 4c362f823881f429f716770e7b5d72c6470dd3ce Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 20:34:42 +0800 Subject: [PATCH 035/105] @Data.type --- src/data/RenderPassColorAttachment.ts | 1 + src/data/RenderPassDescriptor.ts | 2 ++ src/data/TextureView.ts | 1 + src/data/Uniforms.ts | 7 +------ src/data/VertexAttributes.ts | 5 +---- test/data/Data.spec.ts | 11 +++++++---- 6 files changed, 13 insertions(+), 14 deletions(-) diff --git a/src/data/RenderPassColorAttachment.ts b/src/data/RenderPassColorAttachment.ts index 9ba337d..22ec0c7 100644 --- a/src/data/RenderPassColorAttachment.ts +++ b/src/data/RenderPassColorAttachment.ts @@ -22,6 +22,7 @@ export class RenderPassColorAttachment extends Data * 注：引擎运行中该属性可能是 IGLRenderbuffer 类型，用于处理多重采样。 * */ + @Data.type(TextureView) readonly view?: TextureView = new TextureView(); /** diff --git a/src/data/RenderPassDescriptor.ts b/src/data/RenderPassDescriptor.ts index 75f48c5..8791e57 100644 --- a/src/data/RenderPassDescriptor.ts +++ b/src/data/RenderPassDescriptor.ts @@ -20,6 +20,7 @@ export class RenderPassDescriptor extends Data /** * 颜色附件 */ + @Data.type(RenderPassColorAttachment) readonly colorAttachments?: readonly RenderPassColorAttachment[] = []; /** @@ -27,6 +28,7 @@ export class RenderPassDescriptor extends Data * * 当使用深度附件时，必须设置 。 */ + @Data.type(RenderPassDepthStencilAttachment) readonly depthStencilAttachment?: RenderPassDepthStencilAttachment; /** diff --git a/src/data/TextureView.ts b/src/data/TextureView.ts index ef3bb3d..251262c 100644 --- a/src/data/TextureView.ts +++ b/src/data/TextureView.ts @@ -19,6 +19,7 @@ export class TextureView extends Data /** * 产生视图的纹理。 */ + @Data.type(Texture) readonly texture: ITextureLike; /** diff --git a/src/data/Uniforms.ts b/src/data/Uniforms.ts index 75172a2..13f1ea7 100644 --- a/src/data/Uniforms.ts +++ b/src/data/Uniforms.ts @@ -7,16 +7,11 @@ import { Data } from "./Data"; @Data.reg export class Uniforms extends Data { - // __type__?: "Uniforms" = "Uniforms"; - - // [key: `u_${string}`]: IUniformType; + __type__?: any = "Uniforms"; [key: string]: IUniformType; } -// @ts-ignore -Uniforms.prototype["__type__"] = "Uniforms"; - /** * Uniform 类型 */ diff --git a/src/data/VertexAttributes.ts b/src/data/VertexAttributes.ts index 92f87f3..3de0d1e 100644 --- a/src/data/VertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -7,16 +7,13 @@ import { Data } from "./Data"; @Data.reg export class VertexAttributes extends Data { - // __type__?: "VertexAttributes" = "VertexAttributes"; + __type__?: any = "VertexAttributes"; // [name: `a_${string}`]: VertexAttribute; [name: string]: VertexAttribute; } -// @ts-ignore -VertexAttributes.prototype["__type__"] = "VertexAttributes"; - /** * 顶点属性数据。 */ diff --git a/test/data/Data.spec.ts b/test/data/Data.spec.ts index 9ae4fee..33e797c 100644 --- a/test/data/Data.spec.ts +++ b/test/data/Data.spec.ts @@ -1,4 +1,4 @@ -import { CommandEncoder, CopyBufferToBuffer, Data, RenderPass, Submit, TextureImageSource } from "@feng3d/render-api"; +import { CommandEncoder, CopyBufferToBuffer, Data, RenderPass, RenderPassColorAttachment, RenderPassDescriptor, Submit, TextureImageSource } from "@feng3d/render-api"; import { assert, describe, it } from "vitest"; describe("Data", () => @@ -63,7 +63,6 @@ describe("Data", () => arr: [{ __type__: "B", b: false }, { b: true }, new B()], }); - console.log(a); assert.equal(a.constructor, AA); assert.equal(a.b!.constructor, B); assert.equal(a.arr![0]!.constructor, B); @@ -118,12 +117,16 @@ describe("Data", () => }; const instance = Submit.getInstance(submit); - console.log(instance); - assert.equal(instance.constructor, Submit); + assert.equal(instance.constructor, Submit); assert.equal(instance.commandEncoders[0].constructor, CommandEncoder); assert.equal(instance.commandEncoders[0].passEncoders[0].constructor, RenderPass); + const renderpass = instance.commandEncoders[0].passEncoders[0] as RenderPass + + assert.equal(renderpass.descriptor!.constructor, RenderPassDescriptor); + assert.equal(renderpass.descriptor!.colorAttachments![0].constructor, RenderPassColorAttachment); + }); }); -- Gitee From 07a5cd56b87e00a8817e375cc6769e911714760f Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 22:30:09 +0800 Subject: [PATCH 036/105] @Data.type --- src/data/BlendState.ts | 6 +- src/data/Buffer.ts | 1 + src/data/CanvasTexture.ts | 1 + src/data/ColorTargetState.ts | 3 +- src/data/CommandEncoder.ts | 2 - src/data/CopyBufferToBuffer.ts | 1 + src/data/CopyTextureToTexture.ts | 36 +----------- src/data/Data.ts | 1 + src/data/DepthStencilState.ts | 2 + src/data/FragmentState.ts | 1 + src/data/Geometry.ts | 7 ++- src/data/ITextureDataSource.ts | 58 ++++++++++++++++++ src/data/ImageCopyTexture.ts | 39 ++++++++++++ src/data/Material.ts | 3 + src/data/RenderPassDepthStencilAttachment.ts | 3 +- src/data/Texture.ts | 62 ++------------------ src/index.ts | 6 +- 17 files changed, 131 insertions(+), 101 deletions(-) create mode 100644 src/data/ITextureDataSource.ts create mode 100644 src/data/ImageCopyTexture.ts diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index dec8bc8..2e086b3 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -31,12 +31,14 @@ export class BlendState extends Data /** * 为颜色通道定义相应渲染目标的混合行为。 */ - readonly color?: BlendComponent = new BlendComponent(); + @Data.type(BlendComponent) + readonly color?: BlendComponent; /** * 为alpha通道定义相应渲染目标的混合行为。 */ - readonly alpha?: BlendComponent = new BlendComponent(); + @Data.type(BlendComponent) + readonly alpha?: BlendComponent; /** * 当混合系数用到了混合常量值时设置混合常量值。 diff --git a/src/data/Buffer.ts b/src/data/Buffer.ts index cf99058..1974d53 100644 --- a/src/data/Buffer.ts +++ b/src/data/Buffer.ts @@ -40,5 +40,6 @@ export class Buffer extends Data * * {@link GPUQueue.writeBuffer} */ + @Data.type(WriteBuffer) writeBuffers?: WriteBuffer[]; } diff --git a/src/data/CanvasTexture.ts b/src/data/CanvasTexture.ts index def5277..3f30f42 100644 --- a/src/data/CanvasTexture.ts +++ b/src/data/CanvasTexture.ts @@ -11,5 +11,6 @@ export class CanvasTexture extends Data { __type__?: "CanvasTexture" = "CanvasTexture"; + @Data.type(CanvasContext) context: CanvasContext; } diff --git a/src/data/ColorTargetState.ts b/src/data/ColorTargetState.ts index 4bc8e3a..24a48a7 100644 --- a/src/data/ColorTargetState.ts +++ b/src/data/ColorTargetState.ts @@ -19,7 +19,8 @@ export class ColorTargetState extends Data * * 默认 `undefined`，表示不进行混合。 */ - blend?: BlendState = new BlendState(); + @Data.type(BlendState) + blend?: BlendState; /** * 控制那些颜色分量是否可以被写入到颜色中。 diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index aa8d011..447b77e 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -3,8 +3,6 @@ import { CopyTextureToTexture } from "./CopyTextureToTexture"; import { Data } from "./Data"; import { RenderPass } from "./RenderPass"; - - /** * 命令编码器。 * diff --git a/src/data/CopyBufferToBuffer.ts b/src/data/CopyBufferToBuffer.ts index efc8c21..0224483 100644 --- a/src/data/CopyBufferToBuffer.ts +++ b/src/data/CopyBufferToBuffer.ts @@ -18,6 +18,7 @@ export class CopyBufferToBuffer extends Data /** * 源缓冲区。 */ + @Data.type(Buffer) source: Buffer; /** diff --git a/src/data/CopyTextureToTexture.ts b/src/data/CopyTextureToTexture.ts index 3d3010b..8a5865c 100644 --- a/src/data/CopyTextureToTexture.ts +++ b/src/data/CopyTextureToTexture.ts @@ -1,6 +1,6 @@ import { Data } from "./Data"; -import { ITextureOrigin, ITextureSize } from "./Texture"; -import { ITextureLike } from "./TextureView"; +import { ImageCopyTexture } from "./ImageCopyTexture"; +import { ITextureSize } from "./Texture"; /** * GPU纹理间拷贝。 @@ -30,35 +30,3 @@ export class CopyTextureToTexture extends Data */ copySize: ITextureSize; } - -/** - * 被操作的纹理相关信息。 - * - * {@link GPUCommandEncoder.copyTextureToTexture} - * {@link GPUImageCopyTexture} - */ -export class ImageCopyTexture -{ - /** - * Texture to copy to/from. - */ - texture: ITextureLike; - - /** - * Mip-map level of the {@link GPUImageCopyTexture#texture} to copy to/from. - */ - mipLevel?: number; - - /** - * Defines the origin of the copy - the minimum corner of the texture sub-region to copy to/from. - * Together with `copySize`, defines the full copy sub-region. - */ - origin?: ITextureOrigin; - - /** - * Defines which aspects of the {@link GPUImageCopyTexture#texture} to copy to/from. - */ - aspect?: ITextureAspect; -} - -export type ITextureAspect = "all" | "stencil-only" | "depth-only"; \ No newline at end of file diff --git a/src/data/Data.ts b/src/data/Data.ts index 37f2524..e8c91b2 100644 --- a/src/data/Data.ts +++ b/src/data/Data.ts @@ -42,6 +42,7 @@ export class Data console.assert(!!cls[getInstance], `对象 ${cls} 需要继承 ${Data.name} 或者 实现 static ${getInstance} 方法！`); // const __type__ = new cls().__type__; + console.assert(!!__type__, `类型 ${cls.name} 属性 __type__ 未定义。`); // Data.classMap.set(__type__, cls); diff --git a/src/data/DepthStencilState.ts b/src/data/DepthStencilState.ts index e13f303..2f93146 100644 --- a/src/data/DepthStencilState.ts +++ b/src/data/DepthStencilState.ts @@ -38,6 +38,7 @@ export class DepthStencilState extends Data * * 默认为 {}。 */ + @Data.type(StencilFaceState) readonly stencilFront?: StencilFaceState = new StencilFaceState(); /** @@ -45,6 +46,7 @@ export class DepthStencilState extends Data * * 默认为 {}。 */ + @Data.type(StencilFaceState) readonly stencilBack?: StencilFaceState = new StencilFaceState(); /** diff --git a/src/data/FragmentState.ts b/src/data/FragmentState.ts index 736c372..b67784c 100644 --- a/src/data/FragmentState.ts +++ b/src/data/FragmentState.ts @@ -24,5 +24,6 @@ export class FragmentState extends Data * * 注：WebGL中没法分别对每个颜色附件进行设置，统一使用第一项（targets[0]）设置！ */ + @Data.type(ColorTargetState) readonly targets?: readonly ColorTargetState[] = []; } diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index 8e7b673..52a933a 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -23,11 +23,13 @@ export class Geometry extends Data * * 图元拓扑结构。 */ + @Data.type(PrimitiveState) primitive?: PrimitiveState = new PrimitiveState(); /** * 顶点属性数据映射。 */ + @Data.type(VertexAttributes) vertices?: VertexAttributes = new VertexAttributes(); /** @@ -71,7 +73,10 @@ export class Geometry extends Data { this._draw = DrawVertex.getInstance(value); } - this._draw = value; + else + { + this._draw = DrawIndexed.getInstance(value); + } } protected _draw?: IDraw; diff --git a/src/data/ITextureDataSource.ts b/src/data/ITextureDataSource.ts new file mode 100644 index 0000000..a6350fd --- /dev/null +++ b/src/data/ITextureDataSource.ts @@ -0,0 +1,58 @@ +import { ITextureDataLayout, IDataImageOrigin, ITextureOrigin, ITextureSize } from "./Texture"; + +/** + * 纹理的数据资源。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texSubImage2D + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texSubImage3D + * + * ### WebGPU + * + * @see GPUQueue.writeTexture + */ +export class TextureDataSource +{ + /** + * 数据类型。 + */ + readonly __type__: "TextureDataSource" = "TextureDataSource"; + + /** + * 纹理数据。 + */ + data: ArrayBufferView; + + /** + * Layout of the content in `data`. + * + * 纹理数据布局。 + */ + dataLayout?: ITextureDataLayout; + + /** + * 读取数据图片上的像素坐标。 + */ + dataImageOrigin?: IDataImageOrigin; + + /** + * 写入mipmap级别。 + * + * 默认为 0。 + */ + mipLevel?: number; + + /** + * Defines the origin of the copy - the minimum corner of the texture sub-region to copy to/from. + * Together with `copySize`, defines the full copy sub-region. + * + * 写入纹理的位置。 + */ + textureOrigin?: ITextureOrigin; + + /** + * Extents of the content to write from `source` to `destination`. + * + * 写入尺寸。 + */ + size?: ITextureSize +} diff --git a/src/data/ImageCopyTexture.ts b/src/data/ImageCopyTexture.ts new file mode 100644 index 0000000..18606cd --- /dev/null +++ b/src/data/ImageCopyTexture.ts @@ -0,0 +1,39 @@ +import { Data } from "./Data"; +import { ITextureOrigin, Texture } from "./Texture"; +import { ITextureLike } from "./TextureView"; + +/** + * 被操作的纹理相关信息。 + * + * {@link GPUCommandEncoder.copyTextureToTexture} + * {@link GPUImageCopyTexture} + */ +@Data.reg +export class ImageCopyTexture +{ + __type__?: "ImageCopyTexture" = "ImageCopyTexture"; + + /** + * Texture to copy to/from. + */ + @Data.type(Texture) + texture: ITextureLike; + + /** + * Mip-map level of the {@link GPUImageCopyTexture#texture} to copy to/from. + */ + mipLevel?: number; + + /** + * Defines the origin of the copy - the minimum corner of the texture sub-region to copy to/from. + * Together with `copySize`, defines the full copy sub-region. + */ + origin?: ITextureOrigin; + + /** + * Defines which aspects of the {@link GPUImageCopyTexture#texture} to copy to/from. + */ + aspect?: ITextureAspect; +} + +export type ITextureAspect = "all" | "stencil-only" | "depth-only"; \ No newline at end of file diff --git a/src/data/Material.ts b/src/data/Material.ts index e1c7870..ea431d4 100644 --- a/src/data/Material.ts +++ b/src/data/Material.ts @@ -23,16 +23,19 @@ export class Material extends Data /** * 顶点着色器阶段描述。 */ + @Data.type(VertexState) readonly vertex: VertexState; /** * 片段着色器阶段描述。 */ + @Data.type(FragmentState) readonly fragment?: FragmentState; /** * 深度模板阶段描述。 */ + @Data.type(DepthStencilState) readonly depthStencil?: DepthStencilState; _version?: number; diff --git a/src/data/RenderPassDepthStencilAttachment.ts b/src/data/RenderPassDepthStencilAttachment.ts index 260689e..722b850 100644 --- a/src/data/RenderPassDepthStencilAttachment.ts +++ b/src/data/RenderPassDepthStencilAttachment.ts @@ -17,7 +17,8 @@ export class RenderPassDepthStencilAttachment extends Data * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/framebufferRenderbuffer * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/framebufferTexture2D */ - readonly view?: TextureView = new TextureView(); + @Data.type(TextureView) + readonly view?: TextureView; /** * 清除后填充深度值。 diff --git a/src/data/Texture.ts b/src/data/Texture.ts index c507b65..7253574 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -1,4 +1,5 @@ import { Data } from "./Data"; +import { TextureDataSource } from "./ITextureDataSource"; import { TextureImageSource } from "./TextureImageSource"; /** @@ -36,6 +37,7 @@ export class Texture extends Data * @see GPUQueue.copyExternalImageToTexture * @see GPUQueue.writeTexture */ + @Data.type(TextureImageSource) sources?: readonly TextureSource[]; /** @@ -54,6 +56,7 @@ export class Texture extends Data * @see GPUQueue.copyExternalImageToTexture * @see GPUQueue.writeTexture */ + @Data.type(TextureImageSource) writeTextures?: readonly TextureSource[]; /** @@ -97,64 +100,7 @@ export type TextureSource = ITextureSourceMap[keyof ITextureSourceMap]; export interface ITextureSourceMap { ITextureImageSource: TextureImageSource; - ITextureDataSource: ITextureDataSource; -} - -/** - * 纹理的数据资源。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texSubImage2D - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texSubImage3D - * - * ### WebGPU - * - * @see GPUQueue.writeTexture - */ -export interface ITextureDataSource -{ - /** - * 数据类型。 - */ - readonly __type__: "TextureDataSource"; - - /** - * 纹理数据。 - */ - data: ArrayBufferView; - - /** - * Layout of the content in `data`. - * - * 纹理数据布局。 - */ - dataLayout?: ITextureDataLayout, - - /** - * 读取数据图片上的像素坐标。 - */ - dataImageOrigin?: IDataImageOrigin; - - /** - * 写入mipmap级别。 - * - * 默认为 0。 - */ - mipLevel?: number, - - /** - * Defines the origin of the copy - the minimum corner of the texture sub-region to copy to/from. - * Together with `copySize`, defines the full copy sub-region. - * - * 写入纹理的位置。 - */ - textureOrigin?: ITextureOrigin; - - /** - * Extents of the content to write from `source` to `destination`. - * - * 写入尺寸。 - */ - size?: ITextureSize + ITextureDataSource: TextureDataSource; } /** diff --git a/src/index.ts b/src/index.ts index f984346..c15d9d3 100644 --- a/src/index.ts +++ b/src/index.ts @@ -16,6 +16,8 @@ export * from "./data/DrawIndexed"; export * from "./data/DrawVertex"; export * from "./data/FragmentState"; export * from "./data/Geometry"; +export * from "./data/ImageCopyTexture"; +export * from "./data/ITextureDataSource"; export * from "./data/Material"; export * from "./data/PrimitiveState"; export * from "./data/RenderObject"; @@ -30,11 +32,11 @@ export * from "./data/Submit"; export * from "./data/Texture"; export * from "./data/TextureImageSource"; export * from "./data/TextureView"; -export * from "./types/TypedArray"; export * from "./data/Uniforms"; -export * from "./types/UnReadonly"; export * from "./data/VertexAttributes"; export * from "./data/VertexState"; export * from "./data/Viewport"; export * from "./data/WriteBuffer"; +export * from "./types/TypedArray"; +export * from "./types/UnReadonly"; -- Gitee From e1c0f006df847d3500f35f450a57332f1e4aba0d Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 22:37:17 +0800 Subject: [PATCH 037/105] RenderObject.material: Material --- src/data/RenderObject.ts | 2 +- test/data/Data.spec.ts | 11 +++++++++-- 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index eb3266b..13361f6 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -35,7 +35,7 @@ export class RenderObject extends Data * 渲染管线描述。 */ @Data.type(Material) - pipeline: Material; + material: Material; /** * 渲染几何数据。 diff --git a/test/data/Data.spec.ts b/test/data/Data.spec.ts index 33e797c..4d3e41b 100644 --- a/test/data/Data.spec.ts +++ b/test/data/Data.spec.ts @@ -1,4 +1,4 @@ -import { CommandEncoder, CopyBufferToBuffer, Data, RenderPass, RenderPassColorAttachment, RenderPassDescriptor, Submit, TextureImageSource } from "@feng3d/render-api"; +import { CommandEncoder, CopyBufferToBuffer, Data, Geometry, Material, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDescriptor, Submit, TextureImageSource, TextureView, VertexAttributes } from "@feng3d/render-api"; import { assert, describe, it } from "vitest"; describe("Data", () => @@ -82,7 +82,7 @@ describe("Data", () => }], }, renderObjects: [{ // 渲染对象 - pipeline: { // 渲染管线 + material: { // 渲染管线 vertex: { // 顶点着色器 code: ` @vertex @@ -127,6 +127,13 @@ describe("Data", () => assert.equal(renderpass.descriptor!.constructor, RenderPassDescriptor); assert.equal(renderpass.descriptor!.colorAttachments![0].constructor, RenderPassColorAttachment); + assert.equal(renderpass.descriptor!.colorAttachments![0].view!.constructor, TextureView); + assert.equal(renderpass.renderObjects![0].constructor, RenderObject); + assert.equal(renderpass.renderObjects![0].material!.constructor, Material); + assert.equal(renderpass.renderObjects![0].geometry!.constructor, Geometry); + + assert.equal(renderpass.renderObjects![0].geometry!.vertices!.constructor, VertexAttributes); + assert.equal(renderpass.renderObjects![0].geometry!.primitive!.constructor, PrimitiveState); }); }); -- Gitee From 2bc116b0f5370b69460e2290b4021782ee57a2df Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 23 Feb 2025 14:01:34 +0800 Subject: [PATCH 038/105] TextureImageSource.getTexImageSourceSize --- src/data/TextureImageSource.ts | 20 +++++++++----------- 1 file changed, 9 insertions(+), 11 deletions(-) diff --git a/src/data/TextureImageSource.ts b/src/data/TextureImageSource.ts index 59c2853..0fa20d3 100644 --- a/src/data/TextureImageSource.ts +++ b/src/data/TextureImageSource.ts @@ -69,26 +69,24 @@ export class TextureImageSource extends Data * @param texImageSource 纹理的图片资源。 * @returns */ - static getTexImageSourceSize(source: TextureImageSource): IImageSize + static getTexImageSourceSize(image: TexImageSource): IImageSize { - const texImageSource = source.image; - let width: number; let height: number; - if (texImageSource instanceof VideoFrame) + if (image instanceof VideoFrame) { - width = texImageSource.codedWidth; - height = texImageSource.codedHeight; + width = image.codedWidth; + height = image.codedHeight; } - else if (texImageSource instanceof HTMLVideoElement) + else if (image instanceof HTMLVideoElement) { - width = texImageSource.videoWidth; - height = texImageSource.videoHeight; + width = image.videoWidth; + height = image.videoHeight; } else { - width = texImageSource.width; - height = texImageSource.height; + width = image.width; + height = image.height; } return [width, height]; -- Gitee From 5b8147f7e5dc6166cc0fd4a67a7176aa59b2a5fe Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 23 Feb 2025 15:58:12 +0800 Subject: [PATCH 039/105] Geometry.draw?: IDraw --- src/data/Geometry.ts | 83 +++++++++++++++++++----------------- src/data/ImageCopyTexture.ts | 2 +- src/data/VertexAttributes.ts | 5 --- 3 files changed, 44 insertions(+), 46 deletions(-) diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index 52a933a..0136703 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -40,45 +40,7 @@ export class Geometry extends Data /** * 绘制。 */ - get draw(): IDraw - { - if (this._draw) return this._draw; - - const instanceCount = Geometry.getInstanceCount(this); - - if (this.indices) - { - return { - __type__: "DrawIndexed", - indexCount: this.indices.length, - firstIndex: 0, - instanceCount, - }; - } - - return { - __type__: "DrawVertex", - vertexCount: Geometry.getNumVertex(this), - instanceCount, - }; - } - set draw(value: IDraw) - { - if (!value) - { - this._draw = undefined; - return; - } - if (value.__type__ === "DrawVertex") - { - this._draw = DrawVertex.getInstance(value); - } - else - { - this._draw = DrawIndexed.getInstance(value); - } - } - protected _draw?: IDraw; + draw?: IDraw; /** * 获取顶点数量。 @@ -108,7 +70,7 @@ export class Geometry extends Data const attributes = geometry.vertices; const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => v.stepMode === "instance"); - const count = VertexAttribute.getVertexCount(vertexList[0]); + const count = vertexList.length > 0 ? VertexAttribute.getVertexCount(vertexList[0]) : 1; // 验证所有顶点属性数据的顶点数量一致。 console.assert(vertexList.length > 0 && vertexList.every((v) => count === VertexAttribute.getVertexCount(v))); @@ -117,6 +79,47 @@ export class Geometry extends Data } } +Object.defineProperty(Geometry.prototype, "draw", { + get: function getDraw(this: Geometry) + { + if (this['_draw']) return this['_draw']; + + const instanceCount = Geometry.getInstanceCount(this); + + if (this.indices) + { + return { + __type__: "DrawIndexed", + indexCount: this.indices.length, + firstIndex: 0, + instanceCount, + }; + } + + return { + __type__: "DrawVertex", + vertexCount: Geometry.getNumVertex(this), + instanceCount, + }; + }, + set: function setDraw(this: Geometry, value: IDraw) + { + if (!value) + { + this['_draw'] = undefined; + return; + } + if (value.__type__ === "DrawVertex") + { + this['_draw'] = DrawVertex.getInstance(value); + } + else + { + this['_draw'] = DrawIndexed.getInstance(value); + } + }, +}); + /** * 顶点索引数据类型。 */ diff --git a/src/data/ImageCopyTexture.ts b/src/data/ImageCopyTexture.ts index 18606cd..1514d0b 100644 --- a/src/data/ImageCopyTexture.ts +++ b/src/data/ImageCopyTexture.ts @@ -9,7 +9,7 @@ import { ITextureLike } from "./TextureView"; * {@link GPUImageCopyTexture} */ @Data.reg -export class ImageCopyTexture +export class ImageCopyTexture extends Data { __type__?: "ImageCopyTexture" = "ImageCopyTexture"; diff --git a/src/data/VertexAttributes.ts b/src/data/VertexAttributes.ts index 3de0d1e..0ac3d50 100644 --- a/src/data/VertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -60,11 +60,6 @@ export class VertexAttribute extends Data */ static getVertexCount(attribute: VertexAttribute) { - if (attribute.stepMode === "instance") - { - return 1; - } - // 单个顶点属性数据尺寸。 const attributeSize = VertexAttribute.getVertexByteSize(attribute); const offset = attribute.offset || 0; -- Gitee From abbf0e15e8ebaeb3df02161bb525d7669925a5c1 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 5 Mar 2025 13:16:27 +0800 Subject: [PATCH 040/105] 1 --- src/index.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/index.ts b/src/index.ts index c15d9d3..88eeced 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,3 +1,5 @@ +export * from "./Macro"; + export * from "./consts/vertexFormatMap"; export * from "./data/BlendComponent"; -- Gitee From fc52a4eb9923d5a00d5e432e2c5dd35b97f0b099 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 5 Mar 2025 20:24:28 +0800 Subject: [PATCH 041/105] 1 --- src/data/Material.ts | 4 ++-- src/data/RenderObject.ts | 6 +++--- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/data/Material.ts b/src/data/Material.ts index ea431d4..5ad7a0d 100644 --- a/src/data/Material.ts +++ b/src/data/Material.ts @@ -24,13 +24,13 @@ export class Material extends Data * 顶点着色器阶段描述。 */ @Data.type(VertexState) - readonly vertex: VertexState; + readonly vertex: VertexState = new VertexState(); /** * 片段着色器阶段描述。 */ @Data.type(FragmentState) - readonly fragment?: FragmentState; + readonly fragment?: FragmentState = new FragmentState(); /** * 深度模板阶段描述。 diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 13361f6..b5a33ef 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -49,11 +49,11 @@ export class RenderObject extends Data @Data.type(Uniforms) readonly uniforms?: Uniforms = new Uniforms(); - _version?: number; - /** * shader 中的 宏 - */ + */ @Data.type(ShaderMacro) shaderMacro?: ShaderMacro = new ShaderMacro(); + + _version?: number; } -- Gitee From a864a46e4ae2c78937418bb9a801a52090e91036 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 5 Mar 2025 22:02:08 +0800 Subject: [PATCH 042/105] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E8=BF=90=E8=A1=8C?= =?UTF-8?q?=E9=94=99=E8=AF=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/{Macro.ts => ShaderMacro.ts} | 0 src/data/Geometry.ts | 10 ++++++++-- src/data/RenderObject.ts | 2 +- src/index.ts | 2 +- 4 files changed, 10 insertions(+), 4 deletions(-) rename src/{Macro.ts => ShaderMacro.ts} (100%) diff --git a/src/Macro.ts b/src/ShaderMacro.ts similarity index 100% rename from src/Macro.ts rename to src/ShaderMacro.ts diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index 0136703..ad7dfc4 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -55,7 +55,10 @@ export class Geometry extends Data const count = VertexAttribute.getVertexCount(vertexList[0]); // 验证所有顶点属性数据的顶点数量一致。 - console.assert(vertexList.length > 0 && vertexList.every((v) => count === VertexAttribute.getVertexCount(v))); + if (vertexList.length > 0) + { + console.assert(vertexList.every((v) => count === VertexAttribute.getVertexCount(v))); + } return count; } @@ -73,7 +76,10 @@ export class Geometry extends Data const count = vertexList.length > 0 ? VertexAttribute.getVertexCount(vertexList[0]) : 1; // 验证所有顶点属性数据的顶点数量一致。 - console.assert(vertexList.length > 0 && vertexList.every((v) => count === VertexAttribute.getVertexCount(v))); + if (vertexList.length > 0) + { + console.assert(vertexList.every((v) => count === VertexAttribute.getVertexCount(v))); + } return count; } diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index b5a33ef..fd4d9a8 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,4 +1,4 @@ -import { ShaderMacro } from "../Macro"; +import { ShaderMacro } from "../ShaderMacro"; import { Data } from "./Data"; import { Geometry } from "./Geometry"; import { Material } from "./Material"; diff --git a/src/index.ts b/src/index.ts index 88eeced..625d722 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,4 +1,4 @@ -export * from "./Macro"; +export * from "./ShaderMacro"; export * from "./consts/vertexFormatMap"; -- Gitee From 19a47e6dfe97e41c3c2f3fc78774bc06196c2a68 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 6 Mar 2025 22:02:47 +0800 Subject: [PATCH 043/105] =?UTF-8?q?fix(data):=20=E4=BF=AE=E5=A4=8D?= =?UTF-8?q?=E5=AE=9E=E4=BE=8B=E6=95=B0=E9=87=8F=E5=92=8C=E9=A1=B6=E7=82=B9?= =?UTF-8?q?=E6=95=B0=E9=87=8F=E8=AE=A1=E7=AE=97=E9=94=99=E8=AF=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在计算顶点数量和实例数量时，增加了对属性数据存在性的判断 - 修复了在没有顶点属性时导致的错误 - 优化了代码逻辑，提高了代码的健壮性 --- src/data/Geometry.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index ad7dfc4..4447635 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -50,9 +50,9 @@ export class Geometry extends Data static getNumVertex(geometry: Geometry) { const attributes = geometry.vertices; - const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => v.stepMode !== "instance"); + const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => (v.data && v.stepMode !== "instance")); - const count = VertexAttribute.getVertexCount(vertexList[0]); + const count = vertexList.length > 0 ? VertexAttribute.getVertexCount(vertexList[0]) : 0; // 验证所有顶点属性数据的顶点数量一致。 if (vertexList.length > 0) @@ -71,7 +71,7 @@ export class Geometry extends Data static getInstanceCount(geometry: Geometry) { const attributes = geometry.vertices; - const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => v.stepMode === "instance"); + const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => (v.data && v.stepMode === "instance")); const count = vertexList.length > 0 ? VertexAttribute.getVertexCount(vertexList[0]) : 1; -- Gitee From c7fce2f2b47c3fbce833d6479960cc0791d52fbf Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 7 Mar 2025 21:07:17 +0800 Subject: [PATCH 044/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84=20?= =?UTF-8?q?Material=20=E5=92=8C=20RenderObject=20=E7=B1=BB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除了 ShaderMacro 类 - 将 Material 类改为接口，并添加了静态方法 - 简化了 RenderObject 类的结构 - 更新了相关的导入和导出 --- src/DataProxy.ts | 35 +++++++++++ src/ShaderMacro.ts | 124 --------------------------------------- src/data/Material.ts | 20 ++++--- src/data/RenderObject.ts | 7 --- src/index.ts | 2 - 5 files changed, 47 insertions(+), 141 deletions(-) create mode 100644 src/DataProxy.ts delete mode 100644 src/ShaderMacro.ts diff --git a/src/DataProxy.ts b/src/DataProxy.ts new file mode 100644 index 0000000..123fec4 --- /dev/null +++ b/src/DataProxy.ts @@ -0,0 +1,35 @@ +export class DataProxy +{ + static addInitFunc(func: (obj: any) => ((obj: any) => void)) + { + this._initFuncs || (this._initFuncs = []); + this._initFuncs.push(func); + if (this._map) + { + this._map.forEach((delFuncs, key) => + { + delFuncs.push(func(key)); + }); + } + } + + static init(obj: any) + { + this._map || (this._map = new Map()); + if (this._map.has(obj)) return; + this._initFuncs || (this._initFuncs = []); + const delFuncs = this._initFuncs.map((func) => func(obj)); + this._map.set(obj, delFuncs); + return obj; + } + + static del(obj: any) + { + if (!this._map.has(obj)) return; + const delFuncs = this._map.get(obj); + delFuncs!.forEach((func) => func(obj)); + return obj; + } + private static _initFuncs: ((obj: any) => ((obj: any) => void))[]; + protected static _map: Map void)[]>; +} diff --git a/src/ShaderMacro.ts b/src/ShaderMacro.ts deleted file mode 100644 index 33d0fb4..0000000 --- a/src/ShaderMacro.ts +++ /dev/null @@ -1,124 +0,0 @@ -import { Data } from "./data/Data"; - -/** - * 着色器宏定义 - */ -@Data.reg -export class ShaderMacro extends Data -{ - __type__?: "ShaderMacro" = "ShaderMacro"; - - /** - * UV中的U缩放 - */ - SCALEU: number; - - /** - * UV中的V放 - */ - SCALEV: number; - - /** - * 光源数量 - */ - NUM_LIGHT: number; - - /** - * 点光源数量 - */ - NUM_POINTLIGHT: number; - - /** - * 方向光源数量 - */ - NUM_DIRECTIONALLIGHT: number; - - /** - * 生成投影的方向光源数量 - */ - NUM_DIRECTIONALLIGHT_CASTSHADOW: number; - - /** - * 生成投影的点光源数量 - */ - NUM_POINTLIGHT_CASTSHADOW: number; - - /** - * 聚光灯光源数量 - */ - NUM_SPOT_LIGHTS: number; - - /** - * 生成投影的聚光灯光源数量 - */ - NUM_SPOT_LIGHTS_CASTSHADOW: number; - - /** - * 骨骼关节数量 - */ - NUM_SKELETONJOINT: number; - /** - * - */ - RotationOrder: number; - /** - * 是否有漫反射贴图 - */ - HAS_DIFFUSE_SAMPLER: boolean; - /** - * 是否有法线贴图 - */ - HAS_NORMAL_SAMPLER: boolean; - /** - * 是否有镜面反射光泽图 - */ - HAS_SPECULAR_SAMPLER: boolean; - /** - * 是否有环境贴图 - */ - HAS_AMBIENT_SAMPLER: boolean; - /** - * 是否有骨骼动画 - */ - HAS_SKELETON_ANIMATION: boolean; - /** - * 是否有粒子动画 - */ - HAS_PARTICLE_ANIMATOR: boolean; - /** - * 是否为点渲染模式 - */ - IS_POINTS_MODE: boolean; - /** - * 是否有地形方法 - */ - HAS_TERRAIN_METHOD: boolean; - /** - * 使用合并地形贴图 - */ - USE_TERRAIN_MERGE: boolean; - /** - * 环境映射函数 - */ - HAS_ENV_METHOD: boolean; - - /** - * 是否卡通渲染 - */ - IS_CARTOON: Boolean; - - /** - * 是否抗锯齿 - */ - cartoon_Anti_aliasing: Boolean; - - /** - * 是否启用粒子系统纹理表动画模块 - */ - ENABLED_PARTICLE_SYSTEM_textureSheetAnimation: Boolean; - - /** - * 是否有颜色顶点数据 - */ - HAS_a_color: Boolean; -} diff --git a/src/data/Material.ts b/src/data/Material.ts index 5ad7a0d..0e1f995 100644 --- a/src/data/Material.ts +++ b/src/data/Material.ts @@ -1,3 +1,4 @@ +import { DataProxy } from "../DataProxy"; import { Data } from "./Data"; import { DepthStencilState } from "./DepthStencilState"; import { FragmentState } from "./FragmentState"; @@ -8,10 +9,9 @@ import { VertexState } from "./VertexState"; * * 对应WebGPU的Pipeline。 */ -@Data.reg -export class Material extends Data +export interface Material { - __type__?: "Material" = "Material"; + __type__?: "Material"; /** * 标签。 @@ -23,20 +23,24 @@ export class Material extends Data /** * 顶点着色器阶段描述。 */ - @Data.type(VertexState) - readonly vertex: VertexState = new VertexState(); + vertex: VertexState; /** * 片段着色器阶段描述。 */ - @Data.type(FragmentState) - readonly fragment?: FragmentState = new FragmentState(); + fragment?: FragmentState; /** * 深度模板阶段描述。 */ - @Data.type(DepthStencilState) readonly depthStencil?: DepthStencilState; _version?: number; } + +export class Material +{ + static addInitFunc: (func: (material: Material) => ((material: Material) => void)) => void = DataProxy.addInitFunc; + static init: (material: Material) => Material = DataProxy.init; + static del: (material: Material) => Material = DataProxy.del; +} \ No newline at end of file diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index fd4d9a8..bd35f7f 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,4 +1,3 @@ -import { ShaderMacro } from "../ShaderMacro"; import { Data } from "./Data"; import { Geometry } from "./Geometry"; import { Material } from "./Material"; @@ -49,11 +48,5 @@ export class RenderObject extends Data @Data.type(Uniforms) readonly uniforms?: Uniforms = new Uniforms(); - /** - * shader 中的 宏 - */ - @Data.type(ShaderMacro) - shaderMacro?: ShaderMacro = new ShaderMacro(); - _version?: number; } diff --git a/src/index.ts b/src/index.ts index 625d722..c15d9d3 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,3 @@ -export * from "./ShaderMacro"; - export * from "./consts/vertexFormatMap"; export * from "./data/BlendComponent"; -- Gitee From 5ae9dd5cf9ab1e1a2f111eba7c43cff5e7da9499 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 7 Mar 2025 21:39:50 +0800 Subject: [PATCH 045/105] Material.addInitFunc --- src/data/Material.ts | 20 +++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/src/data/Material.ts b/src/data/Material.ts index 0e1f995..f8cfecd 100644 --- a/src/data/Material.ts +++ b/src/data/Material.ts @@ -1,5 +1,4 @@ import { DataProxy } from "../DataProxy"; -import { Data } from "./Data"; import { DepthStencilState } from "./DepthStencilState"; import { FragmentState } from "./FragmentState"; import { VertexState } from "./VertexState"; @@ -41,6 +40,21 @@ export interface Material export class Material { static addInitFunc: (func: (material: Material) => ((material: Material) => void)) => void = DataProxy.addInitFunc; - static init: (material: Material) => Material = DataProxy.init; + static init: (material: Partial) => Material = DataProxy.init; static del: (material: Material) => Material = DataProxy.del; -} \ No newline at end of file +} + +Material.addInitFunc((material) => +{ + // Object.defineProperty(material, 'vertex', { + + // }); + // + material.__type__ = "Material"; + material.vertex = new VertexState(); + material.fragment = new FragmentState(); + return (material) => + { + + }; +}); \ No newline at end of file -- Gitee From eeff1c52d44564f470725fe7a4ef93316b4bd638 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 8 Mar 2025 23:30:45 +0800 Subject: [PATCH 046/105] =?UTF-8?q?refactor(data):=20=E5=B0=86=20Material?= =?UTF-8?q?=20=E6=8E=A5=E5=8F=A3=E9=87=8D=E5=91=BD=E5=90=8D=E4=B8=BA=20Ren?= =?UTF-8?q?derPipeline?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 修改了 Material.ts 中的 Material 接口和类名为 RenderPipeline - 更新了 RenderObject.ts 中对 Material 的引用，改为 RenderPipeline - 此更改旨在更好地对应 WebGPU 的 Pipeline 概念 --- src/data/Material.ts | 12 ++++++------ src/data/RenderObject.ts | 6 +++--- 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/data/Material.ts b/src/data/Material.ts index f8cfecd..85d0d7c 100644 --- a/src/data/Material.ts +++ b/src/data/Material.ts @@ -8,7 +8,7 @@ import { VertexState } from "./VertexState"; * * 对应WebGPU的Pipeline。 */ -export interface Material +export interface RenderPipeline { __type__?: "Material"; @@ -37,14 +37,14 @@ export interface Material _version?: number; } -export class Material +export class RenderPipeline { - static addInitFunc: (func: (material: Material) => ((material: Material) => void)) => void = DataProxy.addInitFunc; - static init: (material: Partial) => Material = DataProxy.init; - static del: (material: Material) => Material = DataProxy.del; + static addInitFunc: (func: (material: RenderPipeline) => ((material: RenderPipeline) => void)) => void = DataProxy.addInitFunc; + static init: (material: Partial) => RenderPipeline = DataProxy.init; + static del: (material: RenderPipeline) => RenderPipeline = DataProxy.del; } -Material.addInitFunc((material) => +RenderPipeline.addInitFunc((material) => { // Object.defineProperty(material, 'vertex', { diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index bd35f7f..23eaeba 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,6 +1,6 @@ import { Data } from "./Data"; import { Geometry } from "./Geometry"; -import { Material } from "./Material"; +import { RenderPipeline } from "./Material"; import { ScissorRect } from "./ScissorRect"; import { Uniforms } from "./Uniforms"; import { Viewport } from "./Viewport"; @@ -33,8 +33,8 @@ export class RenderObject extends Data /** * 渲染管线描述。 */ - @Data.type(Material) - material: Material; + @Data.type(RenderPipeline) + material: RenderPipeline; /** * 渲染几何数据。 -- Gitee From 2ea7a8b8fe293988e9e43b7ef93b4ddb8c207465 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 00:18:51 +0800 Subject: [PATCH 047/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E6=9D=90=E8=B4=A8=E7=9B=B8=E5=85=B3=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 删除了 Material.ts 文件 - 在 RenderPipeline.ts 中定义了 RenderPipeline 接口和类 - 更新了 RenderObject.ts 中的 material 属性名称为 pipeline - 更新了 index.ts 中的导出路径 --- src/data/RenderObject.ts | 4 ++-- src/data/{Material.ts => RenderPipeline.ts} | 12 ++++++------ src/index.ts | 2 +- 3 files changed, 9 insertions(+), 9 deletions(-) rename src/data/{Material.ts => RenderPipeline.ts} (83%) diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 23eaeba..0e7ef15 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,6 +1,6 @@ import { Data } from "./Data"; import { Geometry } from "./Geometry"; -import { RenderPipeline } from "./Material"; +import { RenderPipeline } from "./RenderPipeline"; import { ScissorRect } from "./ScissorRect"; import { Uniforms } from "./Uniforms"; import { Viewport } from "./Viewport"; @@ -34,7 +34,7 @@ export class RenderObject extends Data * 渲染管线描述。 */ @Data.type(RenderPipeline) - material: RenderPipeline; + pipeline: RenderPipeline; /** * 渲染几何数据。 diff --git a/src/data/Material.ts b/src/data/RenderPipeline.ts similarity index 83% rename from src/data/Material.ts rename to src/data/RenderPipeline.ts index 85d0d7c..49b4d69 100644 --- a/src/data/Material.ts +++ b/src/data/RenderPipeline.ts @@ -4,13 +4,13 @@ import { FragmentState } from "./FragmentState"; import { VertexState } from "./VertexState"; /** - * 材质。 + * 渲染管线。 * * 对应WebGPU的Pipeline。 */ export interface RenderPipeline { - __type__?: "Material"; + __type__?: "RenderPipeline"; /** * 标签。 @@ -44,15 +44,15 @@ export class RenderPipeline static del: (material: RenderPipeline) => RenderPipeline = DataProxy.del; } -RenderPipeline.addInitFunc((material) => +RenderPipeline.addInitFunc((pipeline) => { // Object.defineProperty(material, 'vertex', { // }); // - material.__type__ = "Material"; - material.vertex = new VertexState(); - material.fragment = new FragmentState(); + pipeline.__type__ = "RenderPipeline"; + pipeline.vertex = new VertexState(); + pipeline.fragment = new FragmentState(); return (material) => { diff --git a/src/index.ts b/src/index.ts index c15d9d3..88bcd99 100644 --- a/src/index.ts +++ b/src/index.ts @@ -18,7 +18,7 @@ export * from "./data/FragmentState"; export * from "./data/Geometry"; export * from "./data/ImageCopyTexture"; export * from "./data/ITextureDataSource"; -export * from "./data/Material"; +export * from "./data/RenderPipeline"; export * from "./data/PrimitiveState"; export * from "./data/RenderObject"; export * from "./data/RenderPass"; -- Gitee From 9a6e06329c3c0d7463f4064ee1a4ea6128c57c18 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 01:34:37 +0800 Subject: [PATCH 048/105] =?UTF-8?q?refactor(data):=20=E7=A7=BB=E9=99=A4=20?= =?UTF-8?q?Data=20=E7=B1=BB=E5=B9=B6=E8=B0=83=E6=95=B4=E7=9B=B8=E5=85=B3?= =?UTF-8?q?=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 删除了 Data 类的定义和相关实现 - 移除了所有类的 @Data.reg 装饰器和相关方法 - 调整了类的定义，移除了与 Data 相关的属性和方法 - 更新了相关的导入和导出语句 --- src/data/BlendComponent.ts | 5 +- src/data/BlendState.ts | 6 +- src/data/Buffer.ts | 5 +- src/data/CanvasContext.ts | 5 +- src/data/CanvasTexture.ts | 5 +- src/data/ColorTargetState.ts | 5 +- src/data/CommandEncoder.ts | 23 +--- src/data/CopyBufferToBuffer.ts | 5 +- src/data/CopyTextureToTexture.ts | 4 +- src/data/Data.ts | 128 ------------------- src/data/DepthStencilState.ts | 6 +- src/data/DrawIndexed.ts | 5 +- src/data/DrawVertex.ts | 5 +- src/data/FragmentState.ts | 5 +- src/data/Geometry.ts | 10 +- src/data/ImageCopyTexture.ts | 5 +- src/data/PrimitiveState.ts | 5 +- src/data/RenderObject.ts | 9 +- src/data/RenderPass.ts | 6 +- src/data/RenderPassColorAttachment.ts | 5 +- src/data/RenderPassDepthStencilAttachment.ts | 5 +- src/data/RenderPassDescriptor.ts | 6 +- src/data/RenderPipeline.ts | 4 +- src/data/Sampler.ts | 4 +- src/data/ScissorRect.ts | 5 +- src/data/StencilFaceState.ts | 5 +- src/data/Submit.ts | 5 +- src/data/Texture.ts | 6 +- src/data/TextureImageSource.ts | 4 +- src/data/TextureView.ts | 5 +- src/data/Uniforms.ts | 4 +- src/data/VertexAttributes.ts | 6 +- src/data/VertexState.ts | 5 +- src/data/Viewport.ts | 4 +- src/data/WriteBuffer.ts | 4 +- src/index.ts | 6 +- 36 files changed, 41 insertions(+), 289 deletions(-) delete mode 100644 src/data/Data.ts diff --git a/src/data/BlendComponent.ts b/src/data/BlendComponent.ts index 7062179..ddd5b17 100644 --- a/src/data/BlendComponent.ts +++ b/src/data/BlendComponent.ts @@ -1,5 +1,3 @@ -import { Data } from "./Data"; - /** * 为颜色或alpha通道定义相应渲染目标的混合行为。 * @@ -12,8 +10,7 @@ import { Data } from "./Data"; * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpucolortargetstate */ -@Data.reg -export class BlendComponent extends Data +export class BlendComponent { __type__?: "BlendComponent" = "BlendComponent"; diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index 2e086b3..e7ddadd 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -1,5 +1,4 @@ import { BlendComponent } from "./BlendComponent"; -import { Data } from "./Data"; import { IColor } from "./RenderPassColorAttachment"; /** @@ -11,8 +10,7 @@ import { IColor } from "./RenderPassColorAttachment"; * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpublendstate */ -@Data.reg -export class BlendState extends Data +export class BlendState { __type__?: "BlendState" = "BlendState"; @@ -31,13 +29,11 @@ export class BlendState extends Data /** * 为颜色通道定义相应渲染目标的混合行为。 */ - @Data.type(BlendComponent) readonly color?: BlendComponent; /** * 为alpha通道定义相应渲染目标的混合行为。 */ - @Data.type(BlendComponent) readonly alpha?: BlendComponent; /** diff --git a/src/data/Buffer.ts b/src/data/Buffer.ts index 1974d53..e0bc14d 100644 --- a/src/data/Buffer.ts +++ b/src/data/Buffer.ts @@ -1,4 +1,3 @@ -import { Data } from "./Data"; import { TypedArray } from "../types/TypedArray"; import { WriteBuffer } from "./WriteBuffer"; @@ -11,8 +10,7 @@ import { WriteBuffer } from "./WriteBuffer"; * * {@link GPUBuffer} */ -@Data.reg -export class Buffer extends Data +export class Buffer { __type__?: "Buffer" = "Buffer"; @@ -40,6 +38,5 @@ export class Buffer extends Data * * {@link GPUQueue.writeBuffer} */ - @Data.type(WriteBuffer) writeBuffers?: WriteBuffer[]; } diff --git a/src/data/CanvasContext.ts b/src/data/CanvasContext.ts index 165ebb5..06f26f1 100644 --- a/src/data/CanvasContext.ts +++ b/src/data/CanvasContext.ts @@ -1,12 +1,9 @@ -import { Data } from "./Data"; - /** * @see GPUCanvasContext * @see HTMLCanvasElement.getContext * @see GPUCanvasContext.configure */ -@Data.reg -export class CanvasContext extends Data +export class CanvasContext { __type__?: "CanvasContext" = "CanvasContext"; diff --git a/src/data/CanvasTexture.ts b/src/data/CanvasTexture.ts index 3f30f42..8ba8334 100644 --- a/src/data/CanvasTexture.ts +++ b/src/data/CanvasTexture.ts @@ -1,16 +1,13 @@ import { CanvasContext } from "./CanvasContext"; -import { Data } from "./Data"; /** * 画布纹理，从画布的WebGPU上下文获取纹理 * * 注：只在WebGPU上支持。 */ -@Data.reg -export class CanvasTexture extends Data +export class CanvasTexture { __type__?: "CanvasTexture" = "CanvasTexture"; - @Data.type(CanvasContext) context: CanvasContext; } diff --git a/src/data/ColorTargetState.ts b/src/data/ColorTargetState.ts index 24a48a7..c35e934 100644 --- a/src/data/ColorTargetState.ts +++ b/src/data/ColorTargetState.ts @@ -1,13 +1,11 @@ import { BlendState } from "./BlendState"; -import { Data } from "./Data"; /** * 属性 `format` 将由渲染通道中附件给出。 * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpucolortargetstate */ -@Data.reg -export class ColorTargetState extends Data +export class ColorTargetState { __type__?: "ColorTargetState" = "ColorTargetState"; @@ -19,7 +17,6 @@ export class ColorTargetState extends Data * * 默认 `undefined`，表示不进行混合。 */ - @Data.type(BlendState) blend?: BlendState; /** diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index 447b77e..b32bf66 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -1,6 +1,5 @@ import { CopyBufferToBuffer } from "./CopyBufferToBuffer"; import { CopyTextureToTexture } from "./CopyTextureToTexture"; -import { Data } from "./Data"; import { RenderPass } from "./RenderPass"; /** @@ -8,8 +7,7 @@ import { RenderPass } from "./RenderPass"; * * @see https://developer.mozilla.org/en-US/docs/Web/API/GPUCommandEncoder */ -@Data.reg -export class CommandEncoder extends Data +export class CommandEncoder { __type__?: "CommandEncoder" = "CommandEncoder"; @@ -18,28 +16,9 @@ export class CommandEncoder extends Data * * 包括计算通道编码器、渲染通道编码器 以及 GPU中缓存与纹理之间拷贝。 */ - @Data.type(getPassEncoder) passEncoders: IPassEncoder[] } -function getPassEncoder(v: IPassEncoder) -{ - if (v.__type__ === "RenderPass" || !v.__type__) - { - return RenderPass.getInstance(v); - } - if (v.__type__ === "CopyTextureToTexture") - { - return CopyTextureToTexture.getInstance(v); - } - if (v.__type__ === "CopyBufferToBuffer") - { - return CopyBufferToBuffer.getInstance(v); - } - return v; -} - - /** * 通道编码器。 * diff --git a/src/data/CopyBufferToBuffer.ts b/src/data/CopyBufferToBuffer.ts index 0224483..8cd17ad 100644 --- a/src/data/CopyBufferToBuffer.ts +++ b/src/data/CopyBufferToBuffer.ts @@ -1,5 +1,4 @@ import { Buffer } from "./Buffer"; -import { Data } from "./Data"; /** * GPU缓冲区之间拷贝。 @@ -7,8 +6,7 @@ import { Data } from "./Data"; * {@link WebGL2RenderingContextBase.copyBufferSubData} * {@link GPUCommandEncoder.copyBufferToBuffer} */ -@Data.reg -export class CopyBufferToBuffer extends Data +export class CopyBufferToBuffer { /** * 数据类型。 @@ -18,7 +16,6 @@ export class CopyBufferToBuffer extends Data /** * 源缓冲区。 */ - @Data.type(Buffer) source: Buffer; /** diff --git a/src/data/CopyTextureToTexture.ts b/src/data/CopyTextureToTexture.ts index 8a5865c..1ae61b0 100644 --- a/src/data/CopyTextureToTexture.ts +++ b/src/data/CopyTextureToTexture.ts @@ -1,4 +1,3 @@ -import { Data } from "./Data"; import { ImageCopyTexture } from "./ImageCopyTexture"; import { ITextureSize } from "./Texture"; @@ -7,8 +6,7 @@ import { ITextureSize } from "./Texture"; * * {@link GPUCommandEncoder.copyTextureToTexture} */ -@Data.reg -export class CopyTextureToTexture extends Data +export class CopyTextureToTexture { /** * 数据类型。 diff --git a/src/data/Data.ts b/src/data/Data.ts deleted file mode 100644 index e8c91b2..0000000 --- a/src/data/Data.ts +++ /dev/null @@ -1,128 +0,0 @@ -/** - * 数据基类。 - */ -export class Data -{ - static getInstance(this: new () => T, source: T): T - { - if (!source) return undefined; - if (source instanceof this) return source; - - let instance = Data.cache.get(source); - if (instance) return instance; - - if (source instanceof this) return source; - let cls = this; - - const __type__ = source['__type__']; - - console.assert(cls !== Data as any || !!__type__, `直接使用 Data.getInstance 时，必须定义属性 __type__ ！`); - - if (__type__) - { - cls = Data.classMap.get(__type__); - console.assert(!!cls, `类型 ${__type__} 未定义，请使用 @Data.reg 进行注册！`); - } - - instance = new cls(); - - this['assign'](instance, source); - - Data.cache.set(source, instance); - - return instance; - } - - /** - * - * @param cls - */ - static reg(cls: new () => any) - { - console.assert(!!cls[getInstance], `对象 ${cls} 需要继承 ${Data.name} 或者 实现 static ${getInstance} 方法！`); - // - const __type__ = new cls().__type__; - - console.assert(!!__type__, `类型 ${cls.name} 属性 __type__ 未定义。`); - // - Data.classMap.set(__type__, cls); - } - - /** - * 使用 @Data.type(Type) 类型标记。 - * @param type 类定义或者解析数据的函数。 - */ - static type(type: (new () => any) | ((...args: any[]) => any)) - { - return function (target: any, propertyKey: any) - { - // 实现类型标记逻辑 - target.constructor.propertyType = target.constructor.propertyType || {}; - target.constructor.propertyType[propertyKey] = type; - }; - } - - static getCls(__type__: string) - { - return Data.classMap.get(__type__); - } - - static assign(target: any, source: any) - { - Object.keys(source).forEach((key) => - { - setValue(target, source, key); - }); - - function setValue(target: any, source: any, key: string) - { - const value = source[key]; - - // 基本类型 - if (!value || typeof value !== 'object') - { - target[key] = value; - return; - } - - // 处理数据类型 - if (value['__type__']) - { - target[key] = Data.getInstance(value); - return; - } - - // 处理类型标记 - const propertyType = target.constructor.propertyType?.[key]; - if (propertyType) - { - if (Array.isArray(value)) - { - target[key] = value.map((v) => - (propertyType[getInstance] ? propertyType[getInstance](v) : propertyType(v)) - ); - return; - } - - target[key] = propertyType[getInstance] ? propertyType[getInstance](value) : propertyType(value); - return; - } - - // 处理对象 - const oldValue = target[key]; - if (oldValue?.constructor?.[getInstance]) - { - target[key] = oldValue.constructor[getInstance](value); - return; - } - - // 默认处理 - target[key] = value; - } - } - - protected static cache = new Map(); - protected static classMap = new Map(); -} - -const getInstance = 'getInstance'; \ No newline at end of file diff --git a/src/data/DepthStencilState.ts b/src/data/DepthStencilState.ts index 2f93146..6fe8291 100644 --- a/src/data/DepthStencilState.ts +++ b/src/data/DepthStencilState.ts @@ -1,4 +1,3 @@ -import { Data } from "./Data"; import { ICompareFunction, StencilFaceState } from "./StencilFaceState"; /** @@ -10,8 +9,7 @@ import { ICompareFunction, StencilFaceState } from "./StencilFaceState"; * * @see https://www.orillusion.com/zh/webgpu.html#depth-stencil-state */ -@Data.reg -export class DepthStencilState extends Data +export class DepthStencilState { __type__?: "DepthStencilState" = "DepthStencilState"; @@ -38,7 +36,6 @@ export class DepthStencilState extends Data * * 默认为 {}。 */ - @Data.type(StencilFaceState) readonly stencilFront?: StencilFaceState = new StencilFaceState(); /** @@ -46,7 +43,6 @@ export class DepthStencilState extends Data * * 默认为 {}。 */ - @Data.type(StencilFaceState) readonly stencilBack?: StencilFaceState = new StencilFaceState(); /** diff --git a/src/data/DrawIndexed.ts b/src/data/DrawIndexed.ts index da8cf18..fd3fc41 100644 --- a/src/data/DrawIndexed.ts +++ b/src/data/DrawIndexed.ts @@ -1,13 +1,10 @@ -import { Data } from "./Data"; - /** * 根据索引数据绘制图元。 * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements * @see GPURenderCommandsMixin.drawIndexed */ -@Data.reg -export class DrawIndexed extends Data +export class DrawIndexed { /** * 数据类型。 diff --git a/src/data/DrawVertex.ts b/src/data/DrawVertex.ts index 441c36f..eec0840 100644 --- a/src/data/DrawVertex.ts +++ b/src/data/DrawVertex.ts @@ -1,5 +1,3 @@ -import { Data } from "./Data"; - /** * Draws primitives. * @@ -8,8 +6,7 @@ import { Data } from "./Data"; * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex * @see GPURenderCommandsMixin.draw */ -@Data.reg -export class DrawVertex extends Data +export class DrawVertex { /** * 数据类型。 diff --git a/src/data/FragmentState.ts b/src/data/FragmentState.ts index b67784c..eebe5f4 100644 --- a/src/data/FragmentState.ts +++ b/src/data/FragmentState.ts @@ -1,13 +1,11 @@ import { ColorTargetState } from "./ColorTargetState"; -import { Data } from "./Data"; /** * 片段着色器阶段描述。 * * {@link GPUFragmentState} */ -@Data.reg -export class FragmentState extends Data +export class FragmentState { __type__?: "FragmentState" = "FragmentState"; @@ -24,6 +22,5 @@ export class FragmentState extends Data * * 注：WebGL中没法分别对每个颜色附件进行设置，统一使用第一项（targets[0]）设置！ */ - @Data.type(ColorTargetState) readonly targets?: readonly ColorTargetState[] = []; } diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index 4447635..b8e94ac 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -1,4 +1,3 @@ -import { Data } from "./Data"; import { DrawIndexed } from "./DrawIndexed"; import { DrawVertex } from "./DrawVertex"; import { PrimitiveState } from "./PrimitiveState"; @@ -13,8 +12,7 @@ import { VertexAttribute, VertexAttributes } from "./VertexAttributes"; * - 如何渲染 * - 拓扑结构 */ -@Data.reg -export class Geometry extends Data +export class Geometry { __type__?: "Geometry" = "Geometry"; @@ -23,13 +21,11 @@ export class Geometry extends Data * * 图元拓扑结构。 */ - @Data.type(PrimitiveState) primitive?: PrimitiveState = new PrimitiveState(); /** * 顶点属性数据映射。 */ - @Data.type(VertexAttributes) vertices?: VertexAttributes = new VertexAttributes(); /** @@ -117,11 +113,11 @@ Object.defineProperty(Geometry.prototype, "draw", { } if (value.__type__ === "DrawVertex") { - this['_draw'] = DrawVertex.getInstance(value); + this['_draw'] = value; } else { - this['_draw'] = DrawIndexed.getInstance(value); + this['_draw'] = value; } }, }); diff --git a/src/data/ImageCopyTexture.ts b/src/data/ImageCopyTexture.ts index 1514d0b..2b793dd 100644 --- a/src/data/ImageCopyTexture.ts +++ b/src/data/ImageCopyTexture.ts @@ -1,4 +1,3 @@ -import { Data } from "./Data"; import { ITextureOrigin, Texture } from "./Texture"; import { ITextureLike } from "./TextureView"; @@ -8,15 +7,13 @@ import { ITextureLike } from "./TextureView"; * {@link GPUCommandEncoder.copyTextureToTexture} * {@link GPUImageCopyTexture} */ -@Data.reg -export class ImageCopyTexture extends Data +export class ImageCopyTexture { __type__?: "ImageCopyTexture" = "ImageCopyTexture"; /** * Texture to copy to/from. */ - @Data.type(Texture) texture: ITextureLike; /** diff --git a/src/data/PrimitiveState.ts b/src/data/PrimitiveState.ts index f4658c6..66dfdf2 100644 --- a/src/data/PrimitiveState.ts +++ b/src/data/PrimitiveState.ts @@ -1,5 +1,3 @@ -import { Data } from "./Data"; - /** * 图元拓扑结构。 * @@ -7,8 +5,7 @@ import { Data } from "./Data"; * * `stripIndexFormat` 将由引擎自动设置。 */ -@Data.reg -export class PrimitiveState extends Data +export class PrimitiveState { __type__?: "PrimitiveState" = "PrimitiveState"; diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 0e7ef15..d044b90 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,4 +1,3 @@ -import { Data } from "./Data"; import { Geometry } from "./Geometry"; import { RenderPipeline } from "./RenderPipeline"; import { ScissorRect } from "./ScissorRect"; @@ -8,8 +7,7 @@ import { Viewport } from "./Viewport"; /** * 渲染对象，包含一次渲染时包含的所有数据。 */ -@Data.reg -export class RenderObject extends Data +export class RenderObject { /** * 数据类型。 @@ -21,31 +19,26 @@ export class RenderObject extends Data * * 描述渲染在画布的哪个区域，默认整个画布。 */ - @Data.type(Viewport) viewport?: Viewport; /** * 光栅化阶段中使用的剪刀矩形。 */ - @Data.type(ScissorRect) scissorRect?: ScissorRect; /** * 渲染管线描述。 */ - @Data.type(RenderPipeline) pipeline: RenderPipeline; /** * 渲染几何数据。 */ - @Data.type(Geometry) geometry: Geometry; /** * Uniform变量数据 */ - @Data.type(Uniforms) readonly uniforms?: Uniforms = new Uniforms(); _version?: number; diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index bba8dd1..cebddad 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -1,4 +1,3 @@ -import { Data } from "./Data"; import { RenderObject } from "./RenderObject"; import { RenderPassDescriptor } from "./RenderPassDescriptor"; @@ -7,8 +6,7 @@ import { RenderPassDescriptor } from "./RenderPassDescriptor"; * * 包含渲染通道描述以及需要渲染的对象列表。 */ -@Data.reg -export class RenderPass extends Data +export class RenderPass { /** * 数据类型。 @@ -18,13 +16,11 @@ export class RenderPass extends Data /** * 渲染通道描述 */ - @Data.type(RenderPassDescriptor) readonly descriptor?: RenderPassDescriptor; /** * 渲染对象列表 */ - @Data.type(RenderObject) readonly renderObjects?: readonly IRenderPassObject[]; // /** diff --git a/src/data/RenderPassColorAttachment.ts b/src/data/RenderPassColorAttachment.ts index 22ec0c7..8304d32 100644 --- a/src/data/RenderPassColorAttachment.ts +++ b/src/data/RenderPassColorAttachment.ts @@ -1,11 +1,9 @@ -import { Data } from "./Data"; import { TextureView } from "./TextureView"; /** * 渲染通道颜色附件。 */ -@Data.reg -export class RenderPassColorAttachment extends Data +export class RenderPassColorAttachment { __type__?: "RenderPassColorAttachment" = "RenderPassColorAttachment"; @@ -22,7 +20,6 @@ export class RenderPassColorAttachment extends Data * 注：引擎运行中该属性可能是 IGLRenderbuffer 类型，用于处理多重采样。 * */ - @Data.type(TextureView) readonly view?: TextureView = new TextureView(); /** diff --git a/src/data/RenderPassDepthStencilAttachment.ts b/src/data/RenderPassDepthStencilAttachment.ts index 722b850..ddb4ec1 100644 --- a/src/data/RenderPassDepthStencilAttachment.ts +++ b/src/data/RenderPassDepthStencilAttachment.ts @@ -1,11 +1,9 @@ -import { Data } from "./Data"; import { TextureView } from "./TextureView"; /** * 深度模板附件。 */ -@Data.reg -export class RenderPassDepthStencilAttachment extends Data +export class RenderPassDepthStencilAttachment { __type__?: "RenderPassDepthStencilAttachment" = "RenderPassDepthStencilAttachment"; @@ -17,7 +15,6 @@ export class RenderPassDepthStencilAttachment extends Data * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/framebufferRenderbuffer * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/framebufferTexture2D */ - @Data.type(TextureView) readonly view?: TextureView; /** diff --git a/src/data/RenderPassDescriptor.ts b/src/data/RenderPassDescriptor.ts index 8791e57..38454c2 100644 --- a/src/data/RenderPassDescriptor.ts +++ b/src/data/RenderPassDescriptor.ts @@ -1,12 +1,10 @@ -import { Data } from "./Data"; import { RenderPassColorAttachment } from "./RenderPassColorAttachment"; import { RenderPassDepthStencilAttachment } from "./RenderPassDepthStencilAttachment"; /** * 渲染通道描述 */ -@Data.reg -export class RenderPassDescriptor extends Data +export class RenderPassDescriptor { __type__?: "RenderPassDescriptor" = "RenderPassDescriptor"; @@ -20,7 +18,6 @@ export class RenderPassDescriptor extends Data /** * 颜色附件 */ - @Data.type(RenderPassColorAttachment) readonly colorAttachments?: readonly RenderPassColorAttachment[] = []; /** @@ -28,7 +25,6 @@ export class RenderPassDescriptor extends Data * * 当使用深度附件时，必须设置 。 */ - @Data.type(RenderPassDepthStencilAttachment) readonly depthStencilAttachment?: RenderPassDepthStencilAttachment; /** diff --git a/src/data/RenderPipeline.ts b/src/data/RenderPipeline.ts index 49b4d69..82ef095 100644 --- a/src/data/RenderPipeline.ts +++ b/src/data/RenderPipeline.ts @@ -51,9 +51,7 @@ RenderPipeline.addInitFunc((pipeline) => // }); // pipeline.__type__ = "RenderPipeline"; - pipeline.vertex = new VertexState(); - pipeline.fragment = new FragmentState(); - return (material) => + return () => { }; diff --git a/src/data/Sampler.ts b/src/data/Sampler.ts index 04ee393..a5c3b29 100644 --- a/src/data/Sampler.ts +++ b/src/data/Sampler.ts @@ -1,4 +1,3 @@ -import { Data } from "./Data"; import { ICompareFunction } from "./StencilFaceState"; /** @@ -11,8 +10,7 @@ import { ICompareFunction } from "./StencilFaceState"; * @see https://www.orillusion.com/zh/webgpu.html#dictdef-gpusamplerdescriptor * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter */ -@Data.reg -export class Sampler extends Data +export class Sampler { __type__?: "Sampler" = "Sampler"; diff --git a/src/data/ScissorRect.ts b/src/data/ScissorRect.ts index bf7a586..8659b9f 100644 --- a/src/data/ScissorRect.ts +++ b/src/data/ScissorRect.ts @@ -1,5 +1,3 @@ -import { Data } from "./Data"; - /** * 剪刀盒。 * @@ -17,8 +15,7 @@ import { Data } from "./Data"; * @see https://www.orillusion.com/zh/webgpu.html#dom-gpurenderpassencoder-setscissorrect * */ -@Data.reg -export class ScissorRect extends Data +export class ScissorRect { __type__?: "ScissorRect" = "ScissorRect"; diff --git a/src/data/StencilFaceState.ts b/src/data/StencilFaceState.ts index 6c02d74..46a0290 100644 --- a/src/data/StencilFaceState.ts +++ b/src/data/StencilFaceState.ts @@ -1,12 +1,9 @@ -import { Data } from "./Data"; - /** * {@link GPUStencilFaceState} * * @see https://www.orillusion.com/zh/webgpu.html#dictdef-gpustencilfacestate */ -@Data.reg -export class StencilFaceState extends Data +export class StencilFaceState { __type__?: "StencilFaceState" = "StencilFaceState"; diff --git a/src/data/Submit.ts b/src/data/Submit.ts index e483a4e..cb02b17 100644 --- a/src/data/Submit.ts +++ b/src/data/Submit.ts @@ -1,19 +1,16 @@ import { CommandEncoder } from "./CommandEncoder"; -import { Data } from "./Data"; /** * 一次 GPU 提交。 * * @see https://developer.mozilla.org/en-US/docs/Web/API/GPUQueue/submit */ -@Data.reg -export class Submit extends Data +export class Submit { __type__?: "Submit" = "Submit"; /** * 命令编码器列表。 */ - @Data.type(CommandEncoder) commandEncoders: CommandEncoder[]; } diff --git a/src/data/Texture.ts b/src/data/Texture.ts index 7253574..7957b54 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -1,12 +1,10 @@ -import { Data } from "./Data"; import { TextureDataSource } from "./ITextureDataSource"; import { TextureImageSource } from "./TextureImageSource"; /** * 纹理 */ -@Data.reg -export class Texture extends Data +export class Texture { __type__?: "Texture" = "Texture"; @@ -37,7 +35,6 @@ export class Texture extends Data * @see GPUQueue.copyExternalImageToTexture * @see GPUQueue.writeTexture */ - @Data.type(TextureImageSource) sources?: readonly TextureSource[]; /** @@ -56,7 +53,6 @@ export class Texture extends Data * @see GPUQueue.copyExternalImageToTexture * @see GPUQueue.writeTexture */ - @Data.type(TextureImageSource) writeTextures?: readonly TextureSource[]; /** diff --git a/src/data/TextureImageSource.ts b/src/data/TextureImageSource.ts index 0fa20d3..c85053f 100644 --- a/src/data/TextureImageSource.ts +++ b/src/data/TextureImageSource.ts @@ -1,4 +1,3 @@ -import { Data } from "./Data"; import { IImageOrigin, IImageSize, ITextureOrigin, ITextureSize } from "./Texture"; /** @@ -13,8 +12,7 @@ import { IImageOrigin, IImageSize, ITextureOrigin, ITextureSize } from "./Textur * * @see GPUQueue.copyExternalImageToTexture */ -@Data.reg -export class TextureImageSource extends Data +export class TextureImageSource { /** * 数据类型。 diff --git a/src/data/TextureView.ts b/src/data/TextureView.ts index 251262c..55ae568 100644 --- a/src/data/TextureView.ts +++ b/src/data/TextureView.ts @@ -1,11 +1,9 @@ -import { Data } from "./Data"; import { Texture } from "./Texture"; /** * 纹理视图。 */ -@Data.reg -export class TextureView extends Data +export class TextureView { __type__?: "TextureView" = "TextureView"; @@ -19,7 +17,6 @@ export class TextureView extends Data /** * 产生视图的纹理。 */ - @Data.type(Texture) readonly texture: ITextureLike; /** diff --git a/src/data/Uniforms.ts b/src/data/Uniforms.ts index 13f1ea7..7821bfa 100644 --- a/src/data/Uniforms.ts +++ b/src/data/Uniforms.ts @@ -1,11 +1,9 @@ import { BufferBinding, IBufferBindingItem } from "./BufferBinding"; -import { Data } from "./Data"; /** * Uniform 数据 */ -@Data.reg -export class Uniforms extends Data +export class Uniforms { __type__?: any = "Uniforms"; diff --git a/src/data/VertexAttributes.ts b/src/data/VertexAttributes.ts index 0ac3d50..d88b787 100644 --- a/src/data/VertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -1,11 +1,9 @@ import { vertexFormatMap } from "../consts/vertexFormatMap"; -import { Data } from "./Data"; /** * 顶点属性数据映射。 */ -@Data.reg -export class VertexAttributes extends Data +export class VertexAttributes { __type__?: any = "VertexAttributes"; @@ -17,7 +15,7 @@ export class VertexAttributes extends Data /** * 顶点属性数据。 */ -export class VertexAttribute extends Data +export class VertexAttribute { /** * 顶点数据。 diff --git a/src/data/VertexState.ts b/src/data/VertexState.ts index f9884f9..cd8e064 100644 --- a/src/data/VertexState.ts +++ b/src/data/VertexState.ts @@ -1,10 +1,7 @@ -import { Data } from "./Data"; - /** * 顶点着色器阶段描述。 */ -@Data.reg -export class VertexState extends Data +export class VertexState { __type__?: "VertexState" = "VertexState"; diff --git a/src/data/Viewport.ts b/src/data/Viewport.ts index 92b9b83..aec2057 100644 --- a/src/data/Viewport.ts +++ b/src/data/Viewport.ts @@ -1,4 +1,3 @@ -import { Data } from "./Data"; /** * 视窗。 @@ -19,8 +18,7 @@ import { Data } from "./Data"; * @see https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-setviewport * */ -@Data.reg -export class Viewport extends Data +export class Viewport { __type__?: "Viewport" = "Viewport"; diff --git a/src/data/WriteBuffer.ts b/src/data/WriteBuffer.ts index c0e21f8..a4691cb 100644 --- a/src/data/WriteBuffer.ts +++ b/src/data/WriteBuffer.ts @@ -1,8 +1,6 @@ import { TypedArray } from "../types/TypedArray"; -import { Data } from "./Data"; -@Data.reg -export class WriteBuffer extends Data +export class WriteBuffer { __type__?: "WriteBuffer" = "WriteBuffer"; diff --git a/src/index.ts b/src/index.ts index 88bcd99..4a3e28c 100644 --- a/src/index.ts +++ b/src/index.ts @@ -10,7 +10,6 @@ export * from "./data/ColorTargetState"; export * from "./data/CommandEncoder"; export * from "./data/CopyBufferToBuffer"; export * from "./data/CopyTextureToTexture"; -export * from "./data/Data"; export * from "./data/DepthStencilState"; export * from "./data/DrawIndexed"; export * from "./data/DrawVertex"; @@ -18,13 +17,13 @@ export * from "./data/FragmentState"; export * from "./data/Geometry"; export * from "./data/ImageCopyTexture"; export * from "./data/ITextureDataSource"; -export * from "./data/RenderPipeline"; export * from "./data/PrimitiveState"; export * from "./data/RenderObject"; export * from "./data/RenderPass"; export * from "./data/RenderPassColorAttachment"; export * from "./data/RenderPassDepthStencilAttachment"; export * from "./data/RenderPassDescriptor"; +export * from "./data/RenderPipeline"; export * from "./data/Sampler"; export * from "./data/ScissorRect"; export * from "./data/StencilFaceState"; @@ -37,6 +36,9 @@ export * from "./data/VertexAttributes"; export * from "./data/VertexState"; export * from "./data/Viewport"; export * from "./data/WriteBuffer"; + +export * from "./DataProxy"; + export * from "./types/TypedArray"; export * from "./types/UnReadonly"; -- Gitee From 3b5d5b50c6d4b71638e3c23b4814aadf7c14e2e4 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 17:29:03 +0800 Subject: [PATCH 049/105] =?UTF-8?q?refactor(data):=20=E7=A7=BB=E9=99=A4=20?= =?UTF-8?q?DataProxy=20=E7=B1=BB=E5=B9=B6=E4=BD=BF=E7=94=A8=20polyfill=20?= =?UTF-8?q?=E6=9B=BF=E4=BB=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 删除了 DataProxy.ts 文件 - 在 RenderPipeline.ts 中移除了与 DataProxy 相关的代码 - 在 index.ts 中移除了 DataProxy 的导出 - 引入了 polyfills/Function 以替代 DataProxy 的功能 --- src/DataProxy.ts | 35 ----------------- src/data/RenderPipeline.ts | 11 ++---- src/index.ts | 3 +- src/polyfills/Function.ts | 79 ++++++++++++++++++++++++++++++++++++++ 4 files changed, 83 insertions(+), 45 deletions(-) delete mode 100644 src/DataProxy.ts create mode 100644 src/polyfills/Function.ts diff --git a/src/DataProxy.ts b/src/DataProxy.ts deleted file mode 100644 index 123fec4..0000000 --- a/src/DataProxy.ts +++ /dev/null @@ -1,35 +0,0 @@ -export class DataProxy -{ - static addInitFunc(func: (obj: any) => ((obj: any) => void)) - { - this._initFuncs || (this._initFuncs = []); - this._initFuncs.push(func); - if (this._map) - { - this._map.forEach((delFuncs, key) => - { - delFuncs.push(func(key)); - }); - } - } - - static init(obj: any) - { - this._map || (this._map = new Map()); - if (this._map.has(obj)) return; - this._initFuncs || (this._initFuncs = []); - const delFuncs = this._initFuncs.map((func) => func(obj)); - this._map.set(obj, delFuncs); - return obj; - } - - static del(obj: any) - { - if (!this._map.has(obj)) return; - const delFuncs = this._map.get(obj); - delFuncs!.forEach((func) => func(obj)); - return obj; - } - private static _initFuncs: ((obj: any) => ((obj: any) => void))[]; - protected static _map: Map void)[]>; -} diff --git a/src/data/RenderPipeline.ts b/src/data/RenderPipeline.ts index 82ef095..47609e4 100644 --- a/src/data/RenderPipeline.ts +++ b/src/data/RenderPipeline.ts @@ -1,4 +1,4 @@ -import { DataProxy } from "../DataProxy"; +import "../polyfills/Function"; import { DepthStencilState } from "./DepthStencilState"; import { FragmentState } from "./FragmentState"; import { VertexState } from "./VertexState"; @@ -37,14 +37,9 @@ export interface RenderPipeline _version?: number; } -export class RenderPipeline -{ - static addInitFunc: (func: (material: RenderPipeline) => ((material: RenderPipeline) => void)) => void = DataProxy.addInitFunc; - static init: (material: Partial) => RenderPipeline = DataProxy.init; - static del: (material: RenderPipeline) => RenderPipeline = DataProxy.del; -} +export class RenderPipeline { } -RenderPipeline.addInitFunc((pipeline) => +RenderPipeline._reg((pipeline) => { // Object.defineProperty(material, 'vertex', { diff --git a/src/index.ts b/src/index.ts index 4a3e28c..c686a85 100644 --- a/src/index.ts +++ b/src/index.ts @@ -37,8 +37,7 @@ export * from "./data/VertexState"; export * from "./data/Viewport"; export * from "./data/WriteBuffer"; -export * from "./DataProxy"; - export * from "./types/TypedArray"; export * from "./types/UnReadonly"; +import "./polyfills/Function"; diff --git a/src/polyfills/Function.ts b/src/polyfills/Function.ts new file mode 100644 index 0000000..fea061b --- /dev/null +++ b/src/polyfills/Function.ts @@ -0,0 +1,79 @@ +export { }; +// 扩展Function接口用于添加自定义方法 +declare global { + interface Function { + /** + * 注册对象初始化函数 + * @template T 构造函数类型 + * @param initFunc 初始化函数，接收实例对象并返回清理函数 + */ + _reg(this: new (...args: any) => T, initFunc: (obj: T) => (() => void)): void + + /** + * 初始化对象时调用注册的初始化函数 + * @template T 实例类型 + * @param obj 要初始化的对象实例 + * @returns 初始化后的对象 + */ + _init(this: new (...args: any) => T, obj: T & {}): T; + + /** + * 执行对象关联的清理函数 + * @template T 实例类型 + * @param obj 要清理的对象实例 + * @returns 清理后的对象 + */ + _del(this: new (...args: any) => T, obj: T & {}): T; + + /** @internal 存储初始化函数的集合 */ + __initFuncs: ((obj: any) => (() => void))[]; + /** @internal 维护对象与清理函数的映射关系 */ + __map: Map void)[]>; + } +} + +/** + * 实现_reg方法： + * 1. 初始化__initFuncs数组 + * 2. 将初始化函数添加到数组 + * 3. 对现有所有已初始化对象应用新添加的初始化函数 + */ +Function.prototype._reg = function (initFunc: (obj: any) => (() => void)) { + console.assert(typeof this === 'function' && this !== Object as any, "只能用于不是Object的构造函数！"); + this.__initFuncs || (this.__initFuncs = []); + this.__initFuncs.push(initFunc); + this.__map?.forEach((delFuncs, key) => { + delFuncs.push(initFunc(key)); + }); +}; + +/** + * 实现_init方法： + * 1. 防止直接使用Object._init + * 2. 初始化映射表__map + * 3. 为对象执行所有注册的初始化函数 + * 4. 存储生成的清理函数 + */ +Function.prototype._init = function (obj: any) { + console.assert(typeof this === 'function' && this !== Object as any, "只能用于不是Object的构造函数！"); + this.__map || (this.__map = new Map()); + if (this.__map.has(obj)) return; + this.__initFuncs || (this.__initFuncs = []); + const delFuncs = this.__initFuncs.map((func) => func(obj)); + this.__map.set(obj, delFuncs); + return obj; +} + +/** + * 实现_del方法： + * 1. 检查对象是否存在清理函数 + * 2. 依次执行所有关联的清理函数 + * 3. 清理完成后移除映射关系 + */ +Function.prototype._del = function (obj: any) { + if (!this.__map || !this.__map.has(obj)) return; + const delFuncs = this.__map.get(obj); + delFuncs!.forEach((func) => func()); + this.__map.delete(obj); + return obj; +} -- Gitee From 2dfc178f4a9e6c2c1d49755c09ea20fc46ab2ddb Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 20:10:56 +0800 Subject: [PATCH 050/105] =?UTF-8?q?test:=20=E5=88=A0=E9=99=A4=20Data=20?= =?UTF-8?q?=E5=8D=95=E5=85=83=E6=B5=8B=E8=AF=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 删除了 test/data/Data.spec.ts 文件，移除了 Data 类的全部单元测试。这包括测试 Data 类的 getInstance 方法、数据结构和类型定义等。 --- test/data/Data.spec.ts | 139 -------------------------------- test/polyfills/Function.spec.ts | 61 ++++++++++++++ 2 files changed, 61 insertions(+), 139 deletions(-) delete mode 100644 test/data/Data.spec.ts create mode 100644 test/polyfills/Function.spec.ts diff --git a/test/data/Data.spec.ts b/test/data/Data.spec.ts deleted file mode 100644 index 4d3e41b..0000000 --- a/test/data/Data.spec.ts +++ /dev/null @@ -1,139 +0,0 @@ -import { CommandEncoder, CopyBufferToBuffer, Data, Geometry, Material, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDescriptor, Submit, TextureImageSource, TextureView, VertexAttributes } from "@feng3d/render-api"; -import { assert, describe, it } from "vitest"; - -describe("Data", () => -{ - it("getInstance", () => - { - const instance = TextureImageSource.getInstance({ image: undefined as any }) - - assert.equal(instance.constructor, TextureImageSource); - - assert.equal(new CopyBufferToBuffer().__type__, "CopyBufferToBuffer"); - }); - - it("getInstance", () => - { - @Data.reg - class A extends Data - { - __type__: 'A' = 'A'; - a = 1; - } - - const a = Data.getInstance({ __type__: 'A', a: 2 }); - - assert.equal(a.constructor, A); - }); - - it("getInstance", () => - { - @Data.reg - class B extends Data - { - __type__?: 'B' = 'B'; - b = true; - } - - @Data.reg - class AA extends Data - { - __type__?: 'AA' = 'AA'; - n = 1; - - b0? = true; - - s? = "s"; - - obj?: any; - - b? = new B(); - - @Data.type(B) - arr?: B[]; - } - - const a = AA.getInstance({ - __type__: 'AA', - n: 2, - b0: false, - s: "s2", - obj: { a: 1 }, - b: { b: false }, - arr: [{ __type__: "B", b: false }, { b: true }, new B()], - }); - - assert.equal(a.constructor, AA); - assert.equal(a.b!.constructor, B); - assert.equal(a.arr![0]!.constructor, B); - }); - - it("getInstance", () => - { - const submit: Submit = { // 一次GPU提交 - commandEncoders: [ // 命令编码列表 - { - passEncoders: [ // 通道编码列表 - { // 渲染通道 - descriptor: { // 渲染通道描述 - colorAttachments: [{ // 颜色附件 - // view: { texture: { context: { canvasId: "canvas.id" } } }, // 绘制到canvas上 - clearValue: [0.0, 0.0, 0.0, 1.0], // 渲染前填充颜色 - }], - }, - renderObjects: [{ // 渲染对象 - material: { // 渲染管线 - vertex: { // 顶点着色器 - code: ` - @vertex - fn main( - @location(0) position: vec2, - ) -> @builtin(position) vec4 { - return vec4(position, 0.0, 1.0); - } - ` }, - fragment: { // 片段着色器 - code: ` - @binding(0) @group(0) var color : vec4; - @fragment - fn main() -> @location(0) vec4f { - return color; - } - ` }, - }, - geometry: { - vertices: { - position: { data: new Float32Array([0.0, 0.5, -0.5, -0.5, 0.5, -0.5]), format: "float32x2" }, // 顶点坐标数据 - }, - indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 - draw: { __type__: "DrawIndexed", indexCount: 3 }, // 绘制命令 - }, - uniforms: { color: [1, 0, 0, 0] }, // Uniform 颜色值。 - }] - }, - ] - } - ], - }; - - const instance = Submit.getInstance(submit); - assert.equal(instance.constructor, Submit); - - assert.equal(instance.commandEncoders[0].constructor, CommandEncoder); - - assert.equal(instance.commandEncoders[0].passEncoders[0].constructor, RenderPass); - - const renderpass = instance.commandEncoders[0].passEncoders[0] as RenderPass - - assert.equal(renderpass.descriptor!.constructor, RenderPassDescriptor); - assert.equal(renderpass.descriptor!.colorAttachments![0].constructor, RenderPassColorAttachment); - assert.equal(renderpass.descriptor!.colorAttachments![0].view!.constructor, TextureView); - - assert.equal(renderpass.renderObjects![0].constructor, RenderObject); - assert.equal(renderpass.renderObjects![0].material!.constructor, Material); - assert.equal(renderpass.renderObjects![0].geometry!.constructor, Geometry); - - assert.equal(renderpass.renderObjects![0].geometry!.vertices!.constructor, VertexAttributes); - assert.equal(renderpass.renderObjects![0].geometry!.primitive!.constructor, PrimitiveState); - }); -}); diff --git a/test/polyfills/Function.spec.ts b/test/polyfills/Function.spec.ts new file mode 100644 index 0000000..9f4e037 --- /dev/null +++ b/test/polyfills/Function.spec.ts @@ -0,0 +1,61 @@ +import { assert, describe, it } from "vitest"; +import "../../src/polyfills/Function"; + +describe("Function", () => +{ + it("should register initialization function", () => + { + class TestClass { } + let initialized = false; + + TestClass._reg((instance) => + { + initialized = true; + return () => initialized = false; + }); + + const instance = new TestClass(); + TestClass._init(instance); + + assert.ok(initialized); + assert.ok(TestClass.__initFuncs); + }); + + it("should execute cleanup functions", () => + { + class TestClass { } + let cleaned = false; + + TestClass._reg(() => () => cleaned = true); + const instance = new TestClass(); + TestClass._init(instance); + + TestClass._del(instance); + assert.ok(cleaned); + assert.ok(!TestClass.__map.has(instance)); + }); + + it("should handle multiple initializations", () => + { + class TestClass { } + let count = 0; + + TestClass._reg(() => + { + count++; + return () => count--; + }); + + const instance = new TestClass(); + TestClass._init(instance); + TestClass._init(instance); + + assert.equal(count, 1); + }); + + it("should handle non-constructor calls", () => + { + assert.throws(() => Object._reg(() => () => { }), /只能用于不是Object的构造函数/); + assert.throws(() => Object._init({}), /只能用于不是Object的构造函数/); + }); +}); -- Gitee From 821dbf64130bbaaf5506cce636809d6a30d90be2 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 20:43:47 +0800 Subject: [PATCH 051/105] =?UTF-8?q?refactor(Function):=20=E9=87=8D?= =?UTF-8?q?=E6=9E=84=20Function=20polyfill=20=E5=B9=B6=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E9=94=99=E8=AF=AF=E5=A4=84=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 优化了 Function.prototype._reg、_init 和 _del 方法的实现 - 将 console.assert 替换为抛出错误，提供更具体的错误信息 - 格式化代码，使其更加可读 - 更新了相关测试用例的描述，使用中文 --- src/polyfills/Function.ts | 22 ++++++++++++++-------- test/polyfills/Function.spec.ts | 8 ++++---- 2 files changed, 18 insertions(+), 12 deletions(-) diff --git a/src/polyfills/Function.ts b/src/polyfills/Function.ts index fea061b..384cc40 100644 --- a/src/polyfills/Function.ts +++ b/src/polyfills/Function.ts @@ -1,7 +1,9 @@ export { }; // 扩展Function接口用于添加自定义方法 -declare global { - interface Function { +declare global +{ + interface Function + { /** * 注册对象初始化函数 * @template T 构造函数类型 @@ -38,11 +40,13 @@ declare global { * 2. 将初始化函数添加到数组 * 3. 对现有所有已初始化对象应用新添加的初始化函数 */ -Function.prototype._reg = function (initFunc: (obj: any) => (() => void)) { - console.assert(typeof this === 'function' && this !== Object as any, "只能用于不是Object的构造函数！"); +Function.prototype._reg = function (initFunc: (obj: any) => (() => void)) +{ + if (typeof this !== 'function' || this === Object as any) throw new Error("只能用于不是Object的构造函数！"); this.__initFuncs || (this.__initFuncs = []); this.__initFuncs.push(initFunc); - this.__map?.forEach((delFuncs, key) => { + this.__map?.forEach((delFuncs, key) => + { delFuncs.push(initFunc(key)); }); }; @@ -54,8 +58,9 @@ Function.prototype._reg = function (initFunc: (obj: any) => (() => void)) { * 3. 为对象执行所有注册的初始化函数 * 4. 存储生成的清理函数 */ -Function.prototype._init = function (obj: any) { - console.assert(typeof this === 'function' && this !== Object as any, "只能用于不是Object的构造函数！"); +Function.prototype._init = function (obj: any) +{ + if (typeof this !== 'function' || this === Object as any) throw new Error("只能用于不是Object的构造函数！"); this.__map || (this.__map = new Map()); if (this.__map.has(obj)) return; this.__initFuncs || (this.__initFuncs = []); @@ -70,7 +75,8 @@ Function.prototype._init = function (obj: any) { * 2. 依次执行所有关联的清理函数 * 3. 清理完成后移除映射关系 */ -Function.prototype._del = function (obj: any) { +Function.prototype._del = function (obj: any) +{ if (!this.__map || !this.__map.has(obj)) return; const delFuncs = this.__map.get(obj); delFuncs!.forEach((func) => func()); diff --git a/test/polyfills/Function.spec.ts b/test/polyfills/Function.spec.ts index 9f4e037..cd50383 100644 --- a/test/polyfills/Function.spec.ts +++ b/test/polyfills/Function.spec.ts @@ -3,7 +3,7 @@ import "../../src/polyfills/Function"; describe("Function", () => { - it("should register initialization function", () => + it("应该注册初始化函数", () => { class TestClass { } let initialized = false; @@ -21,7 +21,7 @@ describe("Function", () => assert.ok(TestClass.__initFuncs); }); - it("should execute cleanup functions", () => + it("应该执行清理函数", () => { class TestClass { } let cleaned = false; @@ -35,7 +35,7 @@ describe("Function", () => assert.ok(!TestClass.__map.has(instance)); }); - it("should handle multiple initializations", () => + it("应该处理多次初始化", () => { class TestClass { } let count = 0; @@ -53,7 +53,7 @@ describe("Function", () => assert.equal(count, 1); }); - it("should handle non-constructor calls", () => + it("应该处理非构造函数调用", () => { assert.throws(() => Object._reg(() => () => { }), /只能用于不是Object的构造函数/); assert.throws(() => Object._init({}), /只能用于不是Object的构造函数/); -- Gitee From 2c2fe936243911c29461a2b39f53572a10679725 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 20:57:37 +0800 Subject: [PATCH 052/105] =?UTF-8?q?feat(Function):=20=E4=B8=BA=E5=AF=B9?= =?UTF-8?q?=E8=B1=A1=E5=AE=9E=E4=BE=8B=E6=B7=BB=E5=8A=A0=20=5Fdel=20?= =?UTF-8?q?=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 Function.prototype._init 中为对象实例添加 _del 方法 - 实现对象实例级别的清理逻辑 - 更新测试用例，使用 _init 和 _del 方法对对象进行初始化和清理 --- src/polyfills/Function.ts | 12 ++++++++++++ test/polyfills/Function.spec.ts | 6 +++--- 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/src/polyfills/Function.ts b/src/polyfills/Function.ts index 384cc40..17c431f 100644 --- a/src/polyfills/Function.ts +++ b/src/polyfills/Function.ts @@ -32,6 +32,15 @@ declare global /** @internal 维护对象与清理函数的映射关系 */ __map: Map void)[]>; } + + interface Object + { + /** + * 执行对象清理操作，触发构造函数级的清理逻辑 + * @returns 清理后的对象实例 + */ + _del(): this; + } } /** @@ -66,6 +75,8 @@ Function.prototype._init = function (obj: any) this.__initFuncs || (this.__initFuncs = []); const delFuncs = this.__initFuncs.map((func) => func(obj)); this.__map.set(obj, delFuncs); + // 为实例添加_del方法 + obj._del = () => this._del(obj); return obj; } @@ -81,5 +92,6 @@ Function.prototype._del = function (obj: any) const delFuncs = this.__map.get(obj); delFuncs!.forEach((func) => func()); this.__map.delete(obj); + delete obj._del; return obj; } diff --git a/test/polyfills/Function.spec.ts b/test/polyfills/Function.spec.ts index cd50383..9f05bba 100644 --- a/test/polyfills/Function.spec.ts +++ b/test/polyfills/Function.spec.ts @@ -14,7 +14,7 @@ describe("Function", () => return () => initialized = false; }); - const instance = new TestClass(); + const instance: TestClass = {}; TestClass._init(instance); assert.ok(initialized); @@ -27,7 +27,7 @@ describe("Function", () => let cleaned = false; TestClass._reg(() => () => cleaned = true); - const instance = new TestClass(); + const instance: TestClass = {}; TestClass._init(instance); TestClass._del(instance); @@ -46,7 +46,7 @@ describe("Function", () => return () => count--; }); - const instance = new TestClass(); + const instance: TestClass = {}; TestClass._init(instance); TestClass._init(instance); -- Gitee From 46c34b739d525e39e45db573aa2bf965c7b2719e Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 21:02:36 +0800 Subject: [PATCH 053/105] =?UTF-8?q?refactor(Function):=20=E4=BC=98?= =?UTF-8?q?=E5=8C=96=20Function=20=E7=B1=BB=E5=9E=8B=E7=9A=84=20=5Finit=20?= =?UTF-8?q?=E5=92=8C=20=5Fdel=20=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 _init 方法的 obj 参数类型从 T & {} 改为 Partial - 将 _del 方法的 obj 参数类型从 T & {} 改为 T - 移除了 Object 接口中的 _del 方法 - 从 _init 方法中移除了为实例添加 _del 方法的逻辑 - 从 _del 方法中移除了删除 obj._del 的逻辑 --- src/polyfills/Function.ts | 16 ++-------------- 1 file changed, 2 insertions(+), 14 deletions(-) diff --git a/src/polyfills/Function.ts b/src/polyfills/Function.ts index 17c431f..c269281 100644 --- a/src/polyfills/Function.ts +++ b/src/polyfills/Function.ts @@ -17,7 +17,7 @@ declare global * @param obj 要初始化的对象实例 * @returns 初始化后的对象 */ - _init(this: new (...args: any) => T, obj: T & {}): T; + _init(this: new (...args: any) => T, obj: Partial): T; /** * 执行对象关联的清理函数 @@ -25,22 +25,13 @@ declare global * @param obj 要清理的对象实例 * @returns 清理后的对象 */ - _del(this: new (...args: any) => T, obj: T & {}): T; + _del(this: new (...args: any) => T, obj: T): T; /** @internal 存储初始化函数的集合 */ __initFuncs: ((obj: any) => (() => void))[]; /** @internal 维护对象与清理函数的映射关系 */ __map: Map void)[]>; } - - interface Object - { - /** - * 执行对象清理操作，触发构造函数级的清理逻辑 - * @returns 清理后的对象实例 - */ - _del(): this; - } } /** @@ -75,8 +66,6 @@ Function.prototype._init = function (obj: any) this.__initFuncs || (this.__initFuncs = []); const delFuncs = this.__initFuncs.map((func) => func(obj)); this.__map.set(obj, delFuncs); - // 为实例添加_del方法 - obj._del = () => this._del(obj); return obj; } @@ -92,6 +81,5 @@ Function.prototype._del = function (obj: any) const delFuncs = this.__map.get(obj); delFuncs!.forEach((func) => func()); this.__map.delete(obj); - delete obj._del; return obj; } -- Gitee From 70c484b4900f6ab08f5a8faf396bb81ff3389ca4 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 21:47:24 +0800 Subject: [PATCH 054/105] =?UTF-8?q?feat(core):=20=E6=B7=BB=E5=8A=A0=20Rend?= =?UTF-8?q?erObject=20=E5=88=9D=E5=A7=8B=E5=8C=96=E5=92=8C=E7=9B=91?= =?UTF-8?q?=E5=90=AC=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 package.json 中添加 @feng3d/watcher 依赖 - 重构 RenderObject，将其从类改为接口 - 实现 RenderObject 的初始化和属性监听功能 - 优化 Function._init 方法，处理 null 和 undefined 输入 - 更新相关测试用例 --- package.json | 4 +++- src/data/RenderObject.ts | 26 +++++++++++++++++++++--- src/polyfills/Function.ts | 2 ++ test/polyfills/Function.spec.ts | 36 +++++++++++++++++++++++++++++++++ 4 files changed, 64 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index 37e1e32..57da773 100644 --- a/package.json +++ b/package.json @@ -55,5 +55,7 @@ "vite": "^4.3.9", "vitest": "^0.32.2" }, - "dependencies": {} + "dependencies": { + "@feng3d/watcher": "^0.8.11" + } } \ No newline at end of file diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index d044b90..d8553e8 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,3 +1,4 @@ +import { watcher } from "@feng3d/watcher"; import { Geometry } from "./Geometry"; import { RenderPipeline } from "./RenderPipeline"; import { ScissorRect } from "./ScissorRect"; @@ -7,12 +8,12 @@ import { Viewport } from "./Viewport"; /** * 渲染对象，包含一次渲染时包含的所有数据。 */ -export class RenderObject +export interface RenderObject { /** * 数据类型。 */ - readonly __type__?: "RenderObject" = "RenderObject"; + __type__?: "RenderObject"; /** * 视窗。 @@ -39,7 +40,26 @@ export class RenderObject /** * Uniform变量数据 */ - readonly uniforms?: Uniforms = new Uniforms(); + uniforms?: Uniforms; _version?: number; } + +export class RenderObject { } + +RenderObject._reg((renderObject) => +{ + const watchSession = watcher.on(); + // + watchSession.watch(renderObject, "pipeline", () => RenderPipeline._init(renderObject.pipeline)); + watchSession.watch(renderObject, "uniforms", () => Uniforms._init(renderObject.uniforms)); + + // 初始化 + renderObject.__type__ = "RenderObject"; + renderObject.uniforms = Uniforms._init({}); + + return () => + { + watchSession.off(); + }; +}); \ No newline at end of file diff --git a/src/polyfills/Function.ts b/src/polyfills/Function.ts index c269281..7c8e7ed 100644 --- a/src/polyfills/Function.ts +++ b/src/polyfills/Function.ts @@ -60,6 +60,7 @@ Function.prototype._reg = function (initFunc: (obj: any) => (() => void)) */ Function.prototype._init = function (obj: any) { + if(!obj) return obj; if (typeof this !== 'function' || this === Object as any) throw new Error("只能用于不是Object的构造函数！"); this.__map || (this.__map = new Map()); if (this.__map.has(obj)) return; @@ -77,6 +78,7 @@ Function.prototype._init = function (obj: any) */ Function.prototype._del = function (obj: any) { + if(!obj) return obj; if (!this.__map || !this.__map.has(obj)) return; const delFuncs = this.__map.get(obj); delFuncs!.forEach((func) => func()); diff --git a/test/polyfills/Function.spec.ts b/test/polyfills/Function.spec.ts index 9f05bba..6f987b8 100644 --- a/test/polyfills/Function.spec.ts +++ b/test/polyfills/Function.spec.ts @@ -3,6 +3,27 @@ import "../../src/polyfills/Function"; describe("Function", () => { + it("应该初始化null时直接返回null", () => + { + class TestClass { initialized: boolean } + + TestClass._reg((instance) => + { + instance.initialized = true; + return () => instance.initialized = false; + }); + + { + const result = TestClass._init(null as any); + assert.equal(result, null); + } + + { + const result = TestClass._init(undefined as any); + assert.equal(result, undefined); + } + }); + it("应该注册初始化函数", () => { class TestClass { } @@ -21,6 +42,21 @@ describe("Function", () => assert.ok(TestClass.__initFuncs); }); + it("应该调用初始化函数后返回传入的实例", () => + { + class TestClass { } + + TestClass._reg((instance) => + { + return () => { }; + }); + + const instance: TestClass = {}; + const ins = TestClass._init(instance); + + assert.equal(ins, instance); // 应该返回传入的实例 + }); + it("应该执行清理函数", () => { class TestClass { } -- Gitee From 3db16cd1bdde23d89528500cf303393da9b06874 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 22:01:50 +0800 Subject: [PATCH 055/105] =?UTF-8?q?feat(data):=20=E6=B7=BB=E5=8A=A0=20Geom?= =?UTF-8?q?etry=20=E5=92=8C=20RenderObject=20=E7=9A=84=E5=B1=9E=E6=80=A7?= =?UTF-8?q?=E7=9B=91=E5=90=AC=E5=92=8C=E5=88=9D=E5=A7=8B=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 Geometry 类中添加了对 primitive 和 vertices 属性的监听 - 在 RenderObject 类中添加了对 viewport、scissorRect、pipeline、geometry 和 uniforms 属性的监听 - 优化了 Geometry 和 RenderObject 的初始化逻辑 - 引入了 watcher 模块和 Function polyfill --- src/data/Geometry.ts | 20 ++++++++++++++++++++ src/data/RenderObject.ts | 10 ++++++++-- 2 files changed, 28 insertions(+), 2 deletions(-) diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index b8e94ac..384dbae 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -1,3 +1,5 @@ +import { watcher } from "@feng3d/watcher"; +import "../polyfills/Function"; import { DrawIndexed } from "./DrawIndexed"; import { DrawVertex } from "./DrawVertex"; import { PrimitiveState } from "./PrimitiveState"; @@ -81,6 +83,24 @@ export class Geometry } } +Geometry._reg((geometry) => +{ + const watchSession = watcher.on(); + // 监听属性变化 + watchSession.watch(geometry, "primitive", () => PrimitiveState._init(geometry.primitive)); + watchSession.watch(geometry, "vertices", () => VertexAttributes._init(geometry.vertices)); + + // 初始化 + geometry.__type__ = "Geometry"; + geometry.primitive ??= PrimitiveState._init({}); + geometry.vertices ??= VertexAttributes._init({}); + + return () => + { + watchSession.off(); + }; +}) + Object.defineProperty(Geometry.prototype, "draw", { get: function getDraw(this: Geometry) { diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index d8553e8..ef2a3fc 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -50,13 +50,19 @@ export class RenderObject { } RenderObject._reg((renderObject) => { const watchSession = watcher.on(); - // + + // 监听属性变化 + watchSession.watch(renderObject, "viewport", () => Viewport._init(renderObject.viewport)); + watchSession.watch(renderObject, "scissorRect", () => ScissorRect._init(renderObject.scissorRect)); watchSession.watch(renderObject, "pipeline", () => RenderPipeline._init(renderObject.pipeline)); + watchSession.watch(renderObject, "geometry", () => Geometry._init(renderObject.geometry)); watchSession.watch(renderObject, "uniforms", () => Uniforms._init(renderObject.uniforms)); // 初始化 renderObject.__type__ = "RenderObject"; - renderObject.uniforms = Uniforms._init({}); + renderObject.pipeline ??= RenderPipeline._init({}); + renderObject.geometry ??= Geometry._init({}); + renderObject.uniforms ??= Uniforms._init({}); return () => { -- Gitee From 7f85b540e00c43884396c1bf3b49b96bc28c2ff0 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 09:53:43 +0800 Subject: [PATCH 056/105] =?UTF-8?q?refactor(data):=20=E5=B0=86=E6=95=B0?= =?UTF-8?q?=E6=8D=AE=E7=B1=BB=E6=94=B9=E4=B8=BA=E6=8E=A5=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将多个数据类改为接口，以提高代码的灵活性和可维护性 - 调整了部分属性的默认值和类型，以符合接口定义的要求 - 移除了不必要的实例方法，简化了接口结构 - 优化了部分属性的描述，提高了代码的可读性 --- src/data/BlendComponent.ts | 10 +-- src/data/BlendState.ts | 11 ++-- src/data/Buffer.ts | 4 +- src/data/BufferBinding.ts | 2 +- src/data/CanvasContext.ts | 4 +- src/data/CanvasTexture.ts | 4 +- src/data/ColorTargetState.ts | 6 +- src/data/CommandEncoder.ts | 4 +- src/data/CopyBufferToBuffer.ts | 8 +-- src/data/CopyTextureToTexture.ts | 4 +- src/data/DepthStencilState.ts | 22 +++---- src/data/DrawIndexed.ts | 8 +-- src/data/DrawVertex.ts | 8 +-- src/data/FragmentState.ts | 6 +- src/data/Geometry.ts | 65 +++++--------------- src/data/ITextureDataSource.ts | 4 +- src/data/ImageCopyTexture.ts | 4 +- src/data/PrimitiveState.ts | 10 +-- src/data/RenderObject.ts | 25 -------- src/data/RenderPass.ts | 4 +- src/data/RenderPassColorAttachment.ts | 10 +-- src/data/RenderPassDepthStencilAttachment.ts | 12 ++-- src/data/RenderPassDescriptor.ts | 8 +-- src/data/RenderPipeline.ts | 15 ----- src/data/Sampler.ts | 22 +++---- src/data/ScissorRect.ts | 10 +-- src/data/StencilFaceState.ts | 12 ++-- src/data/Submit.ts | 4 +- src/data/Texture.ts | 12 ++-- src/data/TextureImageSource.ts | 9 ++- src/data/TextureView.ts | 8 +-- src/data/Uniforms.ts | 4 +- src/data/VertexAttributes.ts | 15 ++--- src/data/VertexState.ts | 4 +- src/data/Viewport.ts | 10 +-- src/data/WriteBuffer.ts | 8 +-- 36 files changed, 156 insertions(+), 220 deletions(-) diff --git a/src/data/BlendComponent.ts b/src/data/BlendComponent.ts index ddd5b17..b17a6e5 100644 --- a/src/data/BlendComponent.ts +++ b/src/data/BlendComponent.ts @@ -10,9 +10,9 @@ * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpucolortargetstate */ -export class BlendComponent +export interface BlendComponent { - __type__?: "BlendComponent" = "BlendComponent"; + __type__?: "BlendComponent"; /** * 混合方式。 @@ -23,7 +23,7 @@ export class BlendComponent * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/blendEquation */ - readonly operation?: IBlendOperation = "add"; + readonly operation?: IBlendOperation; /** * 源混合因子。 @@ -32,7 +32,7 @@ export class BlendComponent * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/blendFunc */ - readonly srcFactor?: IBlendFactor = "one"; + readonly srcFactor?: IBlendFactor; /** * 目标混合因子。 @@ -41,7 +41,7 @@ export class BlendComponent * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/blendFunc */ - readonly dstFactor?: IBlendFactor = "zero"; + readonly dstFactor?: IBlendFactor; } export type IBlendOperation = "add" | "subtract" | "reverse-subtract" | "min" | "max"; diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index e7ddadd..f59a0eb 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -10,9 +10,9 @@ import { IColor } from "./RenderPassColorAttachment"; * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpublendstate */ -export class BlendState +export interface BlendState { - __type__?: "BlendState" = "BlendState"; + __type__?: "BlendState"; /** * 混合时使用的常量值，默认为 [0,0,0,0]。 @@ -24,7 +24,7 @@ export class BlendState * * 注：只取 renderPipeline.fragment?.targets?.[0]?.blend.constantColor 值。 */ - readonly constantColor?: IColor = [0, 0, 0, 0]; + readonly constantColor?: IColor; /** * 为颜色通道定义相应渲染目标的混合行为。 @@ -35,7 +35,10 @@ export class BlendState * 为alpha通道定义相应渲染目标的混合行为。 */ readonly alpha?: BlendComponent; +} +export class BlendState +{ /** * 当混合系数用到了混合常量值时设置混合常量值。 * @@ -65,4 +68,4 @@ export class BlendState return undefined; } -} +} \ No newline at end of file diff --git a/src/data/Buffer.ts b/src/data/Buffer.ts index e0bc14d..8c601b9 100644 --- a/src/data/Buffer.ts +++ b/src/data/Buffer.ts @@ -10,9 +10,9 @@ import { WriteBuffer } from "./WriteBuffer"; * * {@link GPUBuffer} */ -export class Buffer +export interface Buffer { - __type__?: "Buffer" = "Buffer"; + __type__?: "Buffer"; /** * 标签。 diff --git a/src/data/BufferBinding.ts b/src/data/BufferBinding.ts index 5688896..167bc8f 100644 --- a/src/data/BufferBinding.ts +++ b/src/data/BufferBinding.ts @@ -8,7 +8,7 @@ import { TypedArray } from "../types/TypedArray"; * * @see GPUBufferBinding */ -export class BufferBinding +export interface BufferBinding { [name: string]: IBufferBindingItem; diff --git a/src/data/CanvasContext.ts b/src/data/CanvasContext.ts index 06f26f1..1382cd5 100644 --- a/src/data/CanvasContext.ts +++ b/src/data/CanvasContext.ts @@ -3,9 +3,9 @@ * @see HTMLCanvasElement.getContext * @see GPUCanvasContext.configure */ -export class CanvasContext +export interface CanvasContext { - __type__?: "CanvasContext" = "CanvasContext"; + __type__?: "CanvasContext"; /** * 画布id diff --git a/src/data/CanvasTexture.ts b/src/data/CanvasTexture.ts index 8ba8334..8283dc6 100644 --- a/src/data/CanvasTexture.ts +++ b/src/data/CanvasTexture.ts @@ -5,9 +5,9 @@ import { CanvasContext } from "./CanvasContext"; * * 注：只在WebGPU上支持。 */ -export class CanvasTexture +export interface CanvasTexture { - __type__?: "CanvasTexture" = "CanvasTexture"; + __type__?: "CanvasTexture"; context: CanvasContext; } diff --git a/src/data/ColorTargetState.ts b/src/data/ColorTargetState.ts index c35e934..49ac807 100644 --- a/src/data/ColorTargetState.ts +++ b/src/data/ColorTargetState.ts @@ -5,9 +5,9 @@ import { BlendState } from "./BlendState"; * * @see https://gpuweb.github.io/gpuweb/#dictdef-gpucolortargetstate */ -export class ColorTargetState +export interface ColorTargetState { - __type__?: "ColorTargetState" = "ColorTargetState"; + __type__?: "ColorTargetState"; /** * The blending behavior for this color target. If left undefined, disables blending for this @@ -28,7 +28,7 @@ export class ColorTargetState * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/colorMask */ - readonly writeMask?: IWriteMask = [true, true, true, true]; + readonly writeMask?: IWriteMask; } export type IWriteMask = [red: boolean, green: boolean, blue: boolean, alpha: boolean]; diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index b32bf66..100c9eb 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -7,9 +7,9 @@ import { RenderPass } from "./RenderPass"; * * @see https://developer.mozilla.org/en-US/docs/Web/API/GPUCommandEncoder */ -export class CommandEncoder +export interface CommandEncoder { - __type__?: "CommandEncoder" = "CommandEncoder"; + __type__?: "CommandEncoder"; /** * 通道编码器列表。 diff --git a/src/data/CopyBufferToBuffer.ts b/src/data/CopyBufferToBuffer.ts index 8cd17ad..264cfde 100644 --- a/src/data/CopyBufferToBuffer.ts +++ b/src/data/CopyBufferToBuffer.ts @@ -6,12 +6,12 @@ import { Buffer } from "./Buffer"; * {@link WebGL2RenderingContextBase.copyBufferSubData} * {@link GPUCommandEncoder.copyBufferToBuffer} */ -export class CopyBufferToBuffer +export interface CopyBufferToBuffer { /** * 数据类型。 */ - readonly __type__: "CopyBufferToBuffer" = "CopyBufferToBuffer"; + readonly __type__: "CopyBufferToBuffer"; /** * 源缓冲区。 @@ -21,7 +21,7 @@ export class CopyBufferToBuffer /** * 默认为0。 */ - sourceOffset?: number = 0; + sourceOffset?: number; /** * 目标缓冲区。 @@ -31,7 +31,7 @@ export class CopyBufferToBuffer /** * 默认为0。 */ - destinationOffset?: number = 0; + destinationOffset?: number; /** * 默认为源缓冲区尺寸。 diff --git a/src/data/CopyTextureToTexture.ts b/src/data/CopyTextureToTexture.ts index 1ae61b0..a727a89 100644 --- a/src/data/CopyTextureToTexture.ts +++ b/src/data/CopyTextureToTexture.ts @@ -6,12 +6,12 @@ import { ITextureSize } from "./Texture"; * * {@link GPUCommandEncoder.copyTextureToTexture} */ -export class CopyTextureToTexture +export interface CopyTextureToTexture { /** * 数据类型。 */ - readonly __type__: "CopyTextureToTexture" = "CopyTextureToTexture"; + readonly __type__: "CopyTextureToTexture"; /** * Combined with `copySize`, defines the region of the source texture subresources. diff --git a/src/data/DepthStencilState.ts b/src/data/DepthStencilState.ts index 6fe8291..968cc07 100644 --- a/src/data/DepthStencilState.ts +++ b/src/data/DepthStencilState.ts @@ -9,9 +9,9 @@ import { ICompareFunction, StencilFaceState } from "./StencilFaceState"; * * @see https://www.orillusion.com/zh/webgpu.html#depth-stencil-state */ -export class DepthStencilState +export interface DepthStencilState { - __type__?: "DepthStencilState" = "DepthStencilState"; + __type__?: "DepthStencilState"; /** * 指示这个 GPURenderPipeline 是否可以修改 depthStencilAttachment 深度值。 @@ -20,7 +20,7 @@ export class DepthStencilState * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/depthMask */ - readonly depthWriteEnabled?: boolean = true; + readonly depthWriteEnabled?: boolean; /** * 用于测试片元深度与 depthStencilAttachment 深度值的比较操作。 @@ -29,21 +29,21 @@ export class DepthStencilState * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/depthFunc */ - readonly depthCompare?: ICompareFunction = "less"; + readonly depthCompare?: ICompareFunction; /** * 定义了如何为朝前的图元执行模板比较和操作。 * * 默认为 {}。 */ - readonly stencilFront?: StencilFaceState = new StencilFaceState(); + readonly stencilFront?: StencilFaceState; /** * 定义了如何为朝后的图元执行模板比较和操作。 * * 默认为 {}。 */ - readonly stencilBack?: StencilFaceState = new StencilFaceState(); + readonly stencilBack?: StencilFaceState; /** * 模板测试时如果使用 "replace" ，则使用该值填充模板值。 @@ -55,21 +55,21 @@ export class DepthStencilState * * @see https://www.orillusion.com/zh/webgpu.html#dom-gpurenderpassencoder-setstencilreference */ - readonly stencilReference?: number = 0; + readonly stencilReference?: number; /** * 掩码控制在执行模板比较测试时读取哪些 depthStencilAttachment 模板值位。 * * 默认为 0xFFFFFFFF 。 */ - readonly stencilReadMask?: number = 0xFFFFFFFF; + readonly stencilReadMask?: number; /** * 掩码控制可以写入哪些 depthStencilAttachment 模板值位。 * * 默认为 0xFFFFFFFF 。 */ - readonly stencilWriteMask?: number = 0xFFFFFFFF; + readonly stencilWriteMask?: number; /** * 添加到每个片元的恒定深度偏差。 @@ -78,7 +78,7 @@ export class DepthStencilState * * 对应WebGL中的 WebGLRenderingContextBase.polygonOffset 函数的 units 参数。 */ - readonly depthBias?: number = 0; + readonly depthBias?: number; /** * 与片元的斜率成比例的深度偏差。 @@ -87,5 +87,5 @@ export class DepthStencilState * * 对应WebGL中的 WebGLRenderingContextBase.polygonOffset 函数的 factor 参数。 */ - readonly depthBiasSlopeScale?: number = 0; + readonly depthBiasSlopeScale?: number; } diff --git a/src/data/DrawIndexed.ts b/src/data/DrawIndexed.ts index fd3fc41..8d5614c 100644 --- a/src/data/DrawIndexed.ts +++ b/src/data/DrawIndexed.ts @@ -4,12 +4,12 @@ * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements * @see GPURenderCommandsMixin.drawIndexed */ -export class DrawIndexed +export interface DrawIndexed { /** * 数据类型。 */ - readonly __type__: "DrawIndexed" = "DrawIndexed"; + readonly __type__: "DrawIndexed"; /** * The number of indices to draw. @@ -23,12 +23,12 @@ export class DrawIndexed * * 默认为 1 。 */ - readonly instanceCount?: number = 1; + readonly instanceCount?: number; /** * Offset into the index buffer, in indices, begin drawing from. * * 默认为 0 。 */ - readonly firstIndex?: number = 0; + readonly firstIndex?: number; } diff --git a/src/data/DrawVertex.ts b/src/data/DrawVertex.ts index eec0840..aa2cfdb 100644 --- a/src/data/DrawVertex.ts +++ b/src/data/DrawVertex.ts @@ -6,12 +6,12 @@ * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex * @see GPURenderCommandsMixin.draw */ -export class DrawVertex +export interface DrawVertex { /** * 数据类型。 */ - readonly __type__: "DrawVertex" = "DrawVertex"; + readonly __type__: "DrawVertex"; /** * The number of vertices to draw. @@ -23,12 +23,12 @@ export class DrawVertex * * 默认为 1 。 */ - readonly instanceCount?: number = 1; + readonly instanceCount?: number; /** * Offset into the vertex buffers, in vertices, to begin drawing from. * * 默认为 0。 */ - readonly firstVertex?: number = 0; + readonly firstVertex?: number; } \ No newline at end of file diff --git a/src/data/FragmentState.ts b/src/data/FragmentState.ts index eebe5f4..be66cb0 100644 --- a/src/data/FragmentState.ts +++ b/src/data/FragmentState.ts @@ -5,9 +5,9 @@ import { ColorTargetState } from "./ColorTargetState"; * * {@link GPUFragmentState} */ -export class FragmentState +export interface FragmentState { - __type__?: "FragmentState" = "FragmentState"; + __type__?: "FragmentState"; /** * 着色器代码。 @@ -22,5 +22,5 @@ export class FragmentState * * 注：WebGL中没法分别对每个颜色附件进行设置，统一使用第一项（targets[0]）设置！ */ - readonly targets?: readonly ColorTargetState[] = []; + readonly targets?: readonly ColorTargetState[]; } diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index 384dbae..7e5deb8 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -1,4 +1,3 @@ -import { watcher } from "@feng3d/watcher"; import "../polyfills/Function"; import { DrawIndexed } from "./DrawIndexed"; import { DrawVertex } from "./DrawVertex"; @@ -14,21 +13,21 @@ import { VertexAttribute, VertexAttributes } from "./VertexAttributes"; * - 如何渲染 * - 拓扑结构 */ -export class Geometry +export interface Geometry { - __type__?: "Geometry" = "Geometry"; + __type__?: "Geometry"; /** * Describes the primitive-related properties of the pipeline. * * 图元拓扑结构。 */ - primitive?: PrimitiveState = new PrimitiveState(); + primitive?: PrimitiveState; /** * 顶点属性数据映射。 */ - vertices?: VertexAttributes = new VertexAttributes(); + vertices?: VertexAttributes; /** * 顶点索引数据。 @@ -39,6 +38,10 @@ export class Geometry * 绘制。 */ draw?: IDraw; +} + +export class Geometry +{ /** * 获取顶点数量。 @@ -81,38 +84,18 @@ export class Geometry return count; } -} - -Geometry._reg((geometry) => -{ - const watchSession = watcher.on(); - // 监听属性变化 - watchSession.watch(geometry, "primitive", () => PrimitiveState._init(geometry.primitive)); - watchSession.watch(geometry, "vertices", () => VertexAttributes._init(geometry.vertices)); - - // 初始化 - geometry.__type__ = "Geometry"; - geometry.primitive ??= PrimitiveState._init({}); - geometry.vertices ??= VertexAttributes._init({}); - - return () => - { - watchSession.off(); - }; -}) -Object.defineProperty(Geometry.prototype, "draw", { - get: function getDraw(this: Geometry) + static getDraw(geometry: Geometry): DrawIndexed | DrawVertex { - if (this['_draw']) return this['_draw']; + if (geometry['_draw']) return geometry['_draw']; - const instanceCount = Geometry.getInstanceCount(this); + const instanceCount = Geometry.getInstanceCount(geometry); - if (this.indices) + if (geometry.indices) { return { __type__: "DrawIndexed", - indexCount: this.indices.length, + indexCount: geometry.indices.length, firstIndex: 0, instanceCount, }; @@ -120,27 +103,11 @@ Object.defineProperty(Geometry.prototype, "draw", { return { __type__: "DrawVertex", - vertexCount: Geometry.getNumVertex(this), + vertexCount: Geometry.getNumVertex(geometry), instanceCount, }; - }, - set: function setDraw(this: Geometry, value: IDraw) - { - if (!value) - { - this['_draw'] = undefined; - return; - } - if (value.__type__ === "DrawVertex") - { - this['_draw'] = value; - } - else - { - this['_draw'] = value; - } - }, -}); + } +} /** * 顶点索引数据类型。 diff --git a/src/data/ITextureDataSource.ts b/src/data/ITextureDataSource.ts index a6350fd..31425eb 100644 --- a/src/data/ITextureDataSource.ts +++ b/src/data/ITextureDataSource.ts @@ -10,12 +10,12 @@ import { ITextureDataLayout, IDataImageOrigin, ITextureOrigin, ITextureSize } fr * * @see GPUQueue.writeTexture */ -export class TextureDataSource +export interface TextureDataSource { /** * 数据类型。 */ - readonly __type__: "TextureDataSource" = "TextureDataSource"; + readonly __type__: "TextureDataSource"; /** * 纹理数据。 diff --git a/src/data/ImageCopyTexture.ts b/src/data/ImageCopyTexture.ts index 2b793dd..f41c921 100644 --- a/src/data/ImageCopyTexture.ts +++ b/src/data/ImageCopyTexture.ts @@ -7,9 +7,9 @@ import { ITextureLike } from "./TextureView"; * {@link GPUCommandEncoder.copyTextureToTexture} * {@link GPUImageCopyTexture} */ -export class ImageCopyTexture +export interface ImageCopyTexture { - __type__?: "ImageCopyTexture" = "ImageCopyTexture"; + __type__?: "ImageCopyTexture"; /** * Texture to copy to/from. diff --git a/src/data/PrimitiveState.ts b/src/data/PrimitiveState.ts index 66dfdf2..86f90fc 100644 --- a/src/data/PrimitiveState.ts +++ b/src/data/PrimitiveState.ts @@ -5,9 +5,9 @@ * * `stripIndexFormat` 将由引擎自动设置。 */ -export class PrimitiveState +export interface PrimitiveState { - __type__?: "PrimitiveState" = "PrimitiveState"; + __type__?: "PrimitiveState"; /** * The type of primitive to be constructed from the vertex inputs. @@ -26,7 +26,7 @@ export class PrimitiveState * * LINE_LOOP 绘制循环连线。 * * TRIANGLE_FAN 绘制三角扇形。 */ - topology?: IPrimitiveTopology = "triangle-list"; + topology?: IPrimitiveTopology; /** * Defines which polygon orientation will be culled, if any. @@ -39,14 +39,14 @@ export class PrimitiveState * * `front` 剔除正面 * * `back` 剔除背面 */ - cullFace?: ICullFace = "none"; + cullFace?: ICullFace; /** * Defines which polygons are considered front-facing. * * 正向方向。默认 "ccw"，表示三角形逆时针方向为正面。 */ - frontFace?: IFrontFace = "ccw"; + frontFace?: IFrontFace; } /** diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index ef2a3fc..02180b4 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -44,28 +44,3 @@ export interface RenderObject _version?: number; } - -export class RenderObject { } - -RenderObject._reg((renderObject) => -{ - const watchSession = watcher.on(); - - // 监听属性变化 - watchSession.watch(renderObject, "viewport", () => Viewport._init(renderObject.viewport)); - watchSession.watch(renderObject, "scissorRect", () => ScissorRect._init(renderObject.scissorRect)); - watchSession.watch(renderObject, "pipeline", () => RenderPipeline._init(renderObject.pipeline)); - watchSession.watch(renderObject, "geometry", () => Geometry._init(renderObject.geometry)); - watchSession.watch(renderObject, "uniforms", () => Uniforms._init(renderObject.uniforms)); - - // 初始化 - renderObject.__type__ = "RenderObject"; - renderObject.pipeline ??= RenderPipeline._init({}); - renderObject.geometry ??= Geometry._init({}); - renderObject.uniforms ??= Uniforms._init({}); - - return () => - { - watchSession.off(); - }; -}); \ No newline at end of file diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index cebddad..34dad1e 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -6,12 +6,12 @@ import { RenderPassDescriptor } from "./RenderPassDescriptor"; * * 包含渲染通道描述以及需要渲染的对象列表。 */ -export class RenderPass +export interface RenderPass { /** * 数据类型。 */ - readonly __type__?: "RenderPass" = "RenderPass"; + readonly __type__?: "RenderPass"; /** * 渲染通道描述 diff --git a/src/data/RenderPassColorAttachment.ts b/src/data/RenderPassColorAttachment.ts index 8304d32..2cf2c47 100644 --- a/src/data/RenderPassColorAttachment.ts +++ b/src/data/RenderPassColorAttachment.ts @@ -3,9 +3,9 @@ import { TextureView } from "./TextureView"; /** * 渲染通道颜色附件。 */ -export class RenderPassColorAttachment +export interface RenderPassColorAttachment { - __type__?: "RenderPassColorAttachment" = "RenderPassColorAttachment"; + __type__?: "RenderPassColorAttachment"; /** * 颜色附件视图。 @@ -20,7 +20,7 @@ export class RenderPassColorAttachment * 注：引擎运行中该属性可能是 IGLRenderbuffer 类型，用于处理多重采样。 * */ - readonly view?: TextureView = new TextureView(); + readonly view?: TextureView; /** * 清除后填充值。 @@ -39,7 +39,7 @@ export class RenderPassColorAttachment * They are converted [$to a texel value of texture format$] matching the render attachment. * If conversion fails, a validation error is generated. */ - readonly clearValue?: IColor = [0, 0, 0, 0]; + readonly clearValue?: IColor; /** * 是否清除颜色附件。 @@ -56,7 +56,7 @@ export class RenderPassColorAttachment * executing the render pass. * Note: It is recommended to prefer clearing; see {@link GPULoadOp#"clear"} for details. */ - readonly loadOp?: ILoadOp = "clear"; + readonly loadOp?: ILoadOp; } export type IColor = [red: number, green: number, blue: number, alpha: number]; diff --git a/src/data/RenderPassDepthStencilAttachment.ts b/src/data/RenderPassDepthStencilAttachment.ts index ddb4ec1..77573f9 100644 --- a/src/data/RenderPassDepthStencilAttachment.ts +++ b/src/data/RenderPassDepthStencilAttachment.ts @@ -3,9 +3,9 @@ import { TextureView } from "./TextureView"; /** * 深度模板附件。 */ -export class RenderPassDepthStencilAttachment +export interface RenderPassDepthStencilAttachment { - __type__?: "RenderPassDepthStencilAttachment" = "RenderPassDepthStencilAttachment"; + __type__?: "RenderPassDepthStencilAttachment"; /** * 深度附件视图。 @@ -24,7 +24,7 @@ export class RenderPassDepthStencilAttachment * * @see https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/clearDepth */ - readonly depthClearValue?: number = 1; + readonly depthClearValue?: number; /** * 是否清除深度值。 @@ -33,7 +33,7 @@ export class RenderPassDepthStencilAttachment * * @see https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/clear */ - readonly depthLoadOp?: "load" | "clear" = "load"; + readonly depthLoadOp?: "load" | "clear"; /** * 清除后填充模板值。 @@ -42,7 +42,7 @@ export class RenderPassDepthStencilAttachment * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/clearStencil */ - readonly stencilClearValue?: number = 0; + readonly stencilClearValue?: number; /** * 是否清除模板值。 @@ -51,5 +51,5 @@ export class RenderPassDepthStencilAttachment * * @see https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/clear */ - readonly stencilLoadOp?: "load" | "clear" = "load"; + readonly stencilLoadOp?: "load" | "clear"; } \ No newline at end of file diff --git a/src/data/RenderPassDescriptor.ts b/src/data/RenderPassDescriptor.ts index 38454c2..f571aa2 100644 --- a/src/data/RenderPassDescriptor.ts +++ b/src/data/RenderPassDescriptor.ts @@ -4,9 +4,9 @@ import { RenderPassDepthStencilAttachment } from "./RenderPassDepthStencilAttach /** * 渲染通道描述 */ -export class RenderPassDescriptor +export interface RenderPassDescriptor { - __type__?: "RenderPassDescriptor" = "RenderPassDescriptor"; + __type__?: "RenderPassDescriptor"; /** * 标签。 @@ -18,7 +18,7 @@ export class RenderPassDescriptor /** * 颜色附件 */ - readonly colorAttachments?: readonly RenderPassColorAttachment[] = []; + readonly colorAttachments?: readonly RenderPassColorAttachment[]; /** * 深度模板附件。 @@ -39,5 +39,5 @@ export class RenderPassDescriptor * WebGPU: * 是否开启多重采样。WebGPU貌似只支持4重采样。如果在颜色附件中没有给出支持多重采样的纹理时则引擎将会自动为其添加。 */ - readonly sampleCount?: 4 = 4; + readonly sampleCount?: 4; } \ No newline at end of file diff --git a/src/data/RenderPipeline.ts b/src/data/RenderPipeline.ts index 47609e4..55249fa 100644 --- a/src/data/RenderPipeline.ts +++ b/src/data/RenderPipeline.ts @@ -36,18 +36,3 @@ export interface RenderPipeline _version?: number; } - -export class RenderPipeline { } - -RenderPipeline._reg((pipeline) => -{ - // Object.defineProperty(material, 'vertex', { - - // }); - // - pipeline.__type__ = "RenderPipeline"; - return () => - { - - }; -}); \ No newline at end of file diff --git a/src/data/Sampler.ts b/src/data/Sampler.ts index a5c3b29..c30d42d 100644 --- a/src/data/Sampler.ts +++ b/src/data/Sampler.ts @@ -10,9 +10,9 @@ import { ICompareFunction } from "./StencilFaceState"; * @see https://www.orillusion.com/zh/webgpu.html#dictdef-gpusamplerdescriptor * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter */ -export class Sampler +export interface Sampler { - __type__?: "Sampler" = "Sampler"; + __type__?: "Sampler"; /** * 标签。 @@ -29,7 +29,7 @@ export class Sampler * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_wrap_s * @see https://gpuweb.github.io/gpuweb/#dom-gpusamplerdescriptor-addressmodeu */ - addressModeU?: IAddressMode = "repeat"; + addressModeU?: IAddressMode; /** * 用于指定纹理在垂直方向（即T或V坐标轴）上的寻址模式。 @@ -39,7 +39,7 @@ export class Sampler * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_wrap_t * @see https://gpuweb.github.io/gpuweb/#dom-gpusamplerdescriptor-addressmodev */ - addressModeV?: IAddressMode = "repeat"; + addressModeV?: IAddressMode; /** * 用于指定纹理在深度方向（即R或W坐标轴）上的寻址模式。用于3D纹理或者纹理数组。 @@ -49,7 +49,7 @@ export class Sampler * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_wrap_r * @see https://gpuweb.github.io/gpuweb/#dom-gpusamplerdescriptor-addressmodew */ - addressModeW?: IAddressMode = "repeat"; + addressModeW?: IAddressMode; /** * 指定样本足迹小于或等于一个纹素时的采样行为 @@ -59,7 +59,7 @@ export class Sampler * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-magfilter * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_mag_filter */ - magFilter?: IFilterMode = "nearest"; + magFilter?: IFilterMode; /** * 指定样本足迹大于一个纹素时的采样行为。 @@ -71,7 +71,7 @@ export class Sampler * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-minfilter * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_min_filter */ - minFilter?: IFilterMode = "nearest"; + minFilter?: IFilterMode; /** * 指定在 mipmap 级别之间进行采样的行为。 @@ -81,7 +81,7 @@ export class Sampler * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-mipmapfilter * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_min_filter */ - mipmapFilter?: IMipmapFilterMode = "nearest"; + mipmapFilter?: IMipmapFilterMode; /** * 指定采样器使用的最大各向异性值夹具。 @@ -94,21 +94,21 @@ export class Sampler * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-maxanisotropy * @see https://developer.mozilla.org/en-US/docs/Web/API/EXT_texture_filter_anisotropic */ - maxAnisotropy?: number = 1; + maxAnisotropy?: number; /** * 采样时使用的最小Lod等级。 * * 默认 0。 */ - lodMinClamp?: number = 0; + lodMinClamp?: number; /** * 采样时使用的最大Lod等级。 * * 默认 16 。 */ - lodMaxClamp?: number = 16; + lodMaxClamp?: number; /** * 涉及纹理比较操作时需提供，采样器将是具有指定 GPUCompareFunction 的比较采样器。 diff --git a/src/data/ScissorRect.ts b/src/data/ScissorRect.ts index 8659b9f..5ddc496 100644 --- a/src/data/ScissorRect.ts +++ b/src/data/ScissorRect.ts @@ -15,9 +15,9 @@ * @see https://www.orillusion.com/zh/webgpu.html#dom-gpurenderpassencoder-setscissorrect * */ -export class ScissorRect +export interface ScissorRect { - __type__?: "ScissorRect" = "ScissorRect"; + __type__?: "ScissorRect"; /** * 是否为Y轴朝上。 @@ -26,7 +26,7 @@ export class ScissorRect * * 默认为 ture。 */ - readonly isYup?: boolean = true; + readonly isYup?: boolean; /** * 剪刀盒横向坐标（像素）。 @@ -35,7 +35,7 @@ export class ScissorRect * * 默认为 0 。 */ - readonly x?: number = 0; + readonly x?: number; /** * 剪刀盒纵向坐标（像素）。 @@ -44,7 +44,7 @@ export class ScissorRect * * 默认为 0 。 */ - readonly y?: number = 0; + readonly y?: number; /** * 剪刀盒宽度（像素）。 diff --git a/src/data/StencilFaceState.ts b/src/data/StencilFaceState.ts index 46a0290..9706ee5 100644 --- a/src/data/StencilFaceState.ts +++ b/src/data/StencilFaceState.ts @@ -3,37 +3,37 @@ * * @see https://www.orillusion.com/zh/webgpu.html#dictdef-gpustencilfacestate */ -export class StencilFaceState +export interface StencilFaceState { - __type__?: "StencilFaceState" = "StencilFaceState"; + __type__?: "StencilFaceState"; /** * 在测试片元与 depthStencilAttachment 模板值时使用的 GPUCompareFunction。 * * 默认为 "always"。 */ - readonly compare?: ICompareFunction = "always"; + readonly compare?: ICompareFunction; /** * 如果片元模板比较测试（由 compare 描述）失败，则执行的 GPUStencilOperation。 * * 默认为 "keep"。 */ - readonly failOp?: IStencilOperation = "keep"; + readonly failOp?: IStencilOperation; /** * 如果由 depthCompare 描述的片元深度比较失败，则执行的 GPUStencilOperation。 * * 默认为 "keep"。 */ - readonly depthFailOp?: IStencilOperation = "keep"; + readonly depthFailOp?: IStencilOperation; /** * 如果片元模板比较测试通过，则执行由compare描述的GPUStencilOperation。 * * 默认为 "keep"。 */ - readonly passOp?: IStencilOperation = "keep"; + readonly passOp?: IStencilOperation; } export type ICompareFunction = "never" | "less" | "equal" | "less-equal" | "greater" | "not-equal" | "greater-equal" | "always"; diff --git a/src/data/Submit.ts b/src/data/Submit.ts index cb02b17..ba3390f 100644 --- a/src/data/Submit.ts +++ b/src/data/Submit.ts @@ -5,9 +5,9 @@ import { CommandEncoder } from "./CommandEncoder"; * * @see https://developer.mozilla.org/en-US/docs/Web/API/GPUQueue/submit */ -export class Submit +export interface Submit { - __type__?: "Submit" = "Submit"; + __type__?: "Submit"; /** * 命令编码器列表。 diff --git a/src/data/Texture.ts b/src/data/Texture.ts index 7957b54..ad992ea 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -4,9 +4,9 @@ import { TextureImageSource } from "./TextureImageSource"; /** * 纹理 */ -export class Texture +export interface Texture { - __type__?: "Texture" = "Texture"; + __type__?: "Texture"; /** * 标签。 @@ -60,19 +60,21 @@ export class Texture * * WebGL中不支持 "1d" "cube-array"。 */ - readonly dimension?: ITextureDimension = "2d"; + readonly dimension?: ITextureDimension; /** * 纹理格式。 默认为 "rgba8unorm"， */ - readonly format?: ITextureFormat = "rgba8unorm"; + readonly format?: ITextureFormat; /** * The number of mip levels the texture will contain. */ readonly mipLevelCount?: number; +} - +export class Texture +{ /** * 获取纹理每个像素占用的字节数量。 * diff --git a/src/data/TextureImageSource.ts b/src/data/TextureImageSource.ts index c85053f..60508e7 100644 --- a/src/data/TextureImageSource.ts +++ b/src/data/TextureImageSource.ts @@ -12,12 +12,12 @@ import { IImageOrigin, IImageSize, ITextureOrigin, ITextureSize } from "./Textur * * @see GPUQueue.copyExternalImageToTexture */ -export class TextureImageSource +export interface TextureImageSource { /** * 数据类型。 */ - readonly __type__?: "TextureImageSource" = "TextureImageSource"; + readonly __type__?: "TextureImageSource"; /** * 图片资源。 @@ -60,7 +60,10 @@ export class TextureImageSource * 是否需要预乘透明度。 */ premultipliedAlpha?: boolean; +} +export class TextureImageSource +{ /** * 获取纹理的图片资源尺寸。 * @@ -89,4 +92,4 @@ export class TextureImageSource return [width, height]; } -} +} \ No newline at end of file diff --git a/src/data/TextureView.ts b/src/data/TextureView.ts index 55ae568..b353882 100644 --- a/src/data/TextureView.ts +++ b/src/data/TextureView.ts @@ -3,9 +3,9 @@ import { Texture } from "./Texture"; /** * 纹理视图。 */ -export class TextureView +export interface TextureView { - __type__?: "TextureView" = "TextureView"; + __type__?: "TextureView"; /** * 标签。 @@ -24,14 +24,14 @@ export class TextureView * * 默认为 0。 */ - readonly baseMipLevel?: number = 0; + readonly baseMipLevel?: number; /** * 3d纹理的深度索引、纹理数组中的层次、立方体纹理的面索引。 * * 默认为 0。 */ - readonly baseArrayLayer?: number = 0; + readonly baseArrayLayer?: number; } /** diff --git a/src/data/Uniforms.ts b/src/data/Uniforms.ts index 7821bfa..29220d7 100644 --- a/src/data/Uniforms.ts +++ b/src/data/Uniforms.ts @@ -3,9 +3,9 @@ import { BufferBinding, IBufferBindingItem } from "./BufferBinding"; /** * Uniform 数据 */ -export class Uniforms +export interface Uniforms { - __type__?: any = "Uniforms"; + __type__?: any; [key: string]: IUniformType; } diff --git a/src/data/VertexAttributes.ts b/src/data/VertexAttributes.ts index d88b787..7dc3abb 100644 --- a/src/data/VertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -3,11 +3,9 @@ import { vertexFormatMap } from "../consts/vertexFormatMap"; /** * 顶点属性数据映射。 */ -export class VertexAttributes +export interface VertexAttributes { - __type__?: any = "VertexAttributes"; - - // [name: `a_${string}`]: VertexAttribute; + __type__?: any; [name: string]: VertexAttribute; } @@ -15,7 +13,7 @@ export class VertexAttributes /** * 顶点属性数据。 */ -export class VertexAttribute +export interface VertexAttribute { /** * 顶点数据。 @@ -32,7 +30,7 @@ export class VertexAttribute /** * 所在顶点数据中的偏移字节数。 */ - readonly offset?: number = 0; + readonly offset?: number; /** * The stride, in bytes, between elements of this array. @@ -48,8 +46,11 @@ export class VertexAttribute * * 默认 `"vertex"` 。 */ - readonly stepMode?: IVertexStepMode = "vertex"; + readonly stepMode?: IVertexStepMode; +} +export class VertexAttribute +{ /** * 获取顶点属性数据的顶点数量。 * diff --git a/src/data/VertexState.ts b/src/data/VertexState.ts index cd8e064..21335b7 100644 --- a/src/data/VertexState.ts +++ b/src/data/VertexState.ts @@ -1,9 +1,9 @@ /** * 顶点着色器阶段描述。 */ -export class VertexState +export interface VertexState { - __type__?: "VertexState" = "VertexState"; + __type__?: "VertexState"; /** * 着色器代码。 diff --git a/src/data/Viewport.ts b/src/data/Viewport.ts index aec2057..a149698 100644 --- a/src/data/Viewport.ts +++ b/src/data/Viewport.ts @@ -18,9 +18,9 @@ * @see https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-setviewport * */ -export class Viewport +export interface Viewport { - __type__?: "Viewport" = "Viewport"; + __type__?: "Viewport"; /** * 是否为Y轴朝上。 @@ -29,7 +29,7 @@ export class Viewport * * 默认为 ture。 */ - isYup?: boolean = true; + isYup?: boolean; /** * 视窗水平坐标（像素）。 @@ -38,7 +38,7 @@ export class Viewport * * 默认为 0 。 */ - x?: number = 0; + x?: number; /** * 视窗垂直坐标（像素）。 @@ -47,7 +47,7 @@ export class Viewport * * 默认为 0 。 */ - y?: number = 0; + y?: number; /** * 视窗宽度（像素）。 diff --git a/src/data/WriteBuffer.ts b/src/data/WriteBuffer.ts index a4691cb..2b65666 100644 --- a/src/data/WriteBuffer.ts +++ b/src/data/WriteBuffer.ts @@ -1,13 +1,13 @@ import { TypedArray } from "../types/TypedArray"; -export class WriteBuffer +export interface WriteBuffer { - __type__?: "WriteBuffer" = "WriteBuffer"; + __type__?: "WriteBuffer"; /** * GPU缓冲区写入起始位置。 */ - bufferOffset?: number = 0; + bufferOffset?: number; /** * 写入缓冲区数据。 @@ -21,7 +21,7 @@ export class WriteBuffer * * 当写入的数据类型为 {@link ArrayBufferLike} 时单位为字节，当数据类型为 {@link TypedArray} 时单位为元素。 */ - dataOffset?: number = 0; + dataOffset?: number; /** * 写入数据尺寸。 -- Gitee From b0a48f0f505cdd82bfc5ae517b471f510032ad2e Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 10:07:25 +0800 Subject: [PATCH 057/105] =?UTF-8?q?refactor:=20=E7=A7=BB=E9=99=A4=20Functi?= =?UTF-8?q?on=20polyfill?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 移除了 Function polyfill 相关的代码和引用，包括： - 删除了 Geometry.ts、RenderPipeline.ts 和 index.ts 中对 Function polyfill 的引用 - 删除了 Function polyfill 的实现文件 - 删除了 Function polyfill 的测试文件 --- src/data/Geometry.ts | 1 - src/data/RenderPipeline.ts | 1 - src/index.ts | 2 - src/polyfills/Function.ts | 87 ----------------------------- test/polyfills/Function.spec.ts | 97 --------------------------------- 5 files changed, 188 deletions(-) delete mode 100644 src/polyfills/Function.ts delete mode 100644 test/polyfills/Function.spec.ts diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index 7e5deb8..a4d905c 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -1,4 +1,3 @@ -import "../polyfills/Function"; import { DrawIndexed } from "./DrawIndexed"; import { DrawVertex } from "./DrawVertex"; import { PrimitiveState } from "./PrimitiveState"; diff --git a/src/data/RenderPipeline.ts b/src/data/RenderPipeline.ts index 55249fa..188054c 100644 --- a/src/data/RenderPipeline.ts +++ b/src/data/RenderPipeline.ts @@ -1,4 +1,3 @@ -import "../polyfills/Function"; import { DepthStencilState } from "./DepthStencilState"; import { FragmentState } from "./FragmentState"; import { VertexState } from "./VertexState"; diff --git a/src/index.ts b/src/index.ts index c686a85..579c98d 100644 --- a/src/index.ts +++ b/src/index.ts @@ -39,5 +39,3 @@ export * from "./data/WriteBuffer"; export * from "./types/TypedArray"; export * from "./types/UnReadonly"; - -import "./polyfills/Function"; diff --git a/src/polyfills/Function.ts b/src/polyfills/Function.ts deleted file mode 100644 index 7c8e7ed..0000000 --- a/src/polyfills/Function.ts +++ /dev/null @@ -1,87 +0,0 @@ -export { }; -// 扩展Function接口用于添加自定义方法 -declare global -{ - interface Function - { - /** - * 注册对象初始化函数 - * @template T 构造函数类型 - * @param initFunc 初始化函数，接收实例对象并返回清理函数 - */ - _reg(this: new (...args: any) => T, initFunc: (obj: T) => (() => void)): void - - /** - * 初始化对象时调用注册的初始化函数 - * @template T 实例类型 - * @param obj 要初始化的对象实例 - * @returns 初始化后的对象 - */ - _init(this: new (...args: any) => T, obj: Partial): T; - - /** - * 执行对象关联的清理函数 - * @template T 实例类型 - * @param obj 要清理的对象实例 - * @returns 清理后的对象 - */ - _del(this: new (...args: any) => T, obj: T): T; - - /** @internal 存储初始化函数的集合 */ - __initFuncs: ((obj: any) => (() => void))[]; - /** @internal 维护对象与清理函数的映射关系 */ - __map: Map void)[]>; - } -} - -/** - * 实现_reg方法： - * 1. 初始化__initFuncs数组 - * 2. 将初始化函数添加到数组 - * 3. 对现有所有已初始化对象应用新添加的初始化函数 - */ -Function.prototype._reg = function (initFunc: (obj: any) => (() => void)) -{ - if (typeof this !== 'function' || this === Object as any) throw new Error("只能用于不是Object的构造函数！"); - this.__initFuncs || (this.__initFuncs = []); - this.__initFuncs.push(initFunc); - this.__map?.forEach((delFuncs, key) => - { - delFuncs.push(initFunc(key)); - }); -}; - -/** - * 实现_init方法： - * 1. 防止直接使用Object._init - * 2. 初始化映射表__map - * 3. 为对象执行所有注册的初始化函数 - * 4. 存储生成的清理函数 - */ -Function.prototype._init = function (obj: any) -{ - if(!obj) return obj; - if (typeof this !== 'function' || this === Object as any) throw new Error("只能用于不是Object的构造函数！"); - this.__map || (this.__map = new Map()); - if (this.__map.has(obj)) return; - this.__initFuncs || (this.__initFuncs = []); - const delFuncs = this.__initFuncs.map((func) => func(obj)); - this.__map.set(obj, delFuncs); - return obj; -} - -/** - * 实现_del方法： - * 1. 检查对象是否存在清理函数 - * 2. 依次执行所有关联的清理函数 - * 3. 清理完成后移除映射关系 - */ -Function.prototype._del = function (obj: any) -{ - if(!obj) return obj; - if (!this.__map || !this.__map.has(obj)) return; - const delFuncs = this.__map.get(obj); - delFuncs!.forEach((func) => func()); - this.__map.delete(obj); - return obj; -} diff --git a/test/polyfills/Function.spec.ts b/test/polyfills/Function.spec.ts deleted file mode 100644 index 6f987b8..0000000 --- a/test/polyfills/Function.spec.ts +++ /dev/null @@ -1,97 +0,0 @@ -import { assert, describe, it } from "vitest"; -import "../../src/polyfills/Function"; - -describe("Function", () => -{ - it("应该初始化null时直接返回null", () => - { - class TestClass { initialized: boolean } - - TestClass._reg((instance) => - { - instance.initialized = true; - return () => instance.initialized = false; - }); - - { - const result = TestClass._init(null as any); - assert.equal(result, null); - } - - { - const result = TestClass._init(undefined as any); - assert.equal(result, undefined); - } - }); - - it("应该注册初始化函数", () => - { - class TestClass { } - let initialized = false; - - TestClass._reg((instance) => - { - initialized = true; - return () => initialized = false; - }); - - const instance: TestClass = {}; - TestClass._init(instance); - - assert.ok(initialized); - assert.ok(TestClass.__initFuncs); - }); - - it("应该调用初始化函数后返回传入的实例", () => - { - class TestClass { } - - TestClass._reg((instance) => - { - return () => { }; - }); - - const instance: TestClass = {}; - const ins = TestClass._init(instance); - - assert.equal(ins, instance); // 应该返回传入的实例 - }); - - it("应该执行清理函数", () => - { - class TestClass { } - let cleaned = false; - - TestClass._reg(() => () => cleaned = true); - const instance: TestClass = {}; - TestClass._init(instance); - - TestClass._del(instance); - assert.ok(cleaned); - assert.ok(!TestClass.__map.has(instance)); - }); - - it("应该处理多次初始化", () => - { - class TestClass { } - let count = 0; - - TestClass._reg(() => - { - count++; - return () => count--; - }); - - const instance: TestClass = {}; - TestClass._init(instance); - TestClass._init(instance); - - assert.equal(count, 1); - }); - - it("应该处理非构造函数调用", () => - { - assert.throws(() => Object._reg(() => () => { }), /只能用于不是Object的构造函数/); - assert.throws(() => Object._init({}), /只能用于不是Object的构造函数/); - }); -}); -- Gitee From d4f35fd5ef02c2c396acd9995c925f900c9cb361 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 13:29:01 +0800 Subject: [PATCH 058/105] =?UTF-8?q?refactor(data):=20=E7=A7=BB=E9=99=A4=20?= =?UTF-8?q?ITextureDataSource=20=E6=8E=A5=E5=8F=A3=E5=B9=B6=E6=95=B4?= =?UTF-8?q?=E5=90=88=20TextureDataSource=20=E7=B1=BB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 删除了 ITextureDataSource 接口文件 - 新增 TextureDataSource 类，继承自原 ITextureDataSource 接口 - 更新相关引用，使用新的 TextureDataSource 类 - 移除了不再使用的 @feng3d/watcher 依赖 --- package.json | 1 - src/data/RenderObject.ts | 1 - src/data/Texture.ts | 2 +- src/data/{ITextureDataSource.ts => TextureDataSource.ts} | 0 src/index.ts | 2 +- 5 files changed, 2 insertions(+), 4 deletions(-) rename src/data/{ITextureDataSource.ts => TextureDataSource.ts} (100%) diff --git a/package.json b/package.json index 57da773..d871a44 100644 --- a/package.json +++ b/package.json @@ -56,6 +56,5 @@ "vitest": "^0.32.2" }, "dependencies": { - "@feng3d/watcher": "^0.8.11" } } \ No newline at end of file diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 02180b4..09d2dd3 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,4 +1,3 @@ -import { watcher } from "@feng3d/watcher"; import { Geometry } from "./Geometry"; import { RenderPipeline } from "./RenderPipeline"; import { ScissorRect } from "./ScissorRect"; diff --git a/src/data/Texture.ts b/src/data/Texture.ts index ad992ea..cc22dcf 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -1,4 +1,4 @@ -import { TextureDataSource } from "./ITextureDataSource"; +import { TextureDataSource } from "./TextureDataSource"; import { TextureImageSource } from "./TextureImageSource"; /** diff --git a/src/data/ITextureDataSource.ts b/src/data/TextureDataSource.ts similarity index 100% rename from src/data/ITextureDataSource.ts rename to src/data/TextureDataSource.ts diff --git a/src/index.ts b/src/index.ts index 579c98d..3e16cd8 100644 --- a/src/index.ts +++ b/src/index.ts @@ -16,7 +16,7 @@ export * from "./data/DrawVertex"; export * from "./data/FragmentState"; export * from "./data/Geometry"; export * from "./data/ImageCopyTexture"; -export * from "./data/ITextureDataSource"; +export * from "./data/TextureDataSource"; export * from "./data/PrimitiveState"; export * from "./data/RenderObject"; export * from "./data/RenderPass"; -- Gitee From c5110217a18f8836950f7c1358487cadba4d6d73 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 13:42:42 +0800 Subject: [PATCH 059/105] =?UTF-8?q?refactor(src):=20=E7=A7=BB=E9=99=A4?= =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E5=89=8D=E7=BC=80=20I?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除了 IVertexFormat、IVertexDataType、IGLVertexAttributeTypes 等接口的前缀 I - 更新了相关的类型定义和使用 - 此更改统一了代码风格，提高了代码的可读性 --- src/consts/vertexFormatMap.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/consts/vertexFormatMap.ts b/src/consts/vertexFormatMap.ts index 6442e89..a93fc0d 100644 --- a/src/consts/vertexFormatMap.ts +++ b/src/consts/vertexFormatMap.ts @@ -3,7 +3,7 @@ import { IVertexFormat } from "../data/VertexAttributes"; /** * 顶点属性格式信息映射。 */ -export const vertexFormatMap: Record = { +export const vertexFormatMap: Record = { "uint8x2": { "numComponents": 2, "type": "UNSIGNED_BYTE", "normalized": false, "dataType": "unsigned int", "byteSize": 2, "wgslType": "vec2", "typedArrayConstructor": Uint8Array }, "uint8x4": { "numComponents": 4, "type": "UNSIGNED_BYTE", "normalized": false, "dataType": "unsigned int", "byteSize": 4, "wgslType": "vec4", "typedArrayConstructor": Uint8Array }, "sint8x2": { "numComponents": 2, "type": "BYTE", "normalized": false, "dataType": "signed int", "byteSize": 2, "wgslType": "vec2", "typedArrayConstructor": Int8Array }, @@ -45,7 +45,7 @@ export type TypedArrayConstructor = Int8ArrayConstructor | Uint8ArrayConstructor /** * GPU顶点数据类型 */ -export type IVertexDataType = +export type VertexDataType = | "unsigned int" | "signed int" | "unsigned normalized" @@ -94,14 +94,14 @@ export type WGSLVertexType = * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/vertexAttribPointer */ -export type IGLVertexAttributeTypes = "FLOAT" | "BYTE" | "SHORT" | "UNSIGNED_BYTE" | "UNSIGNED_SHORT" // WebGL1 +export type GLVertexAttributeTypes = "FLOAT" | "BYTE" | "SHORT" | "UNSIGNED_BYTE" | "UNSIGNED_SHORT" // WebGL1 | "HALF_FLOAT" | "INT" | "UNSIGNED_INT" | "INT_2_10_10_10_REV" | "UNSIGNED_INT_2_10_10_10_REV"; // WebGL2 /** * 顶点属性格式信息 */ -export type IVertexAttributeFormatInfo = { +export type VertexAttributeFormatInfo = { /** * 部件数量。 @@ -113,12 +113,12 @@ export type IVertexAttributeFormatInfo = { * * 默认从Buffer数据中获取，如果未取到则默认为 "FLOAT" 。 */ - type: IGLVertexAttributeTypes; + type: GLVertexAttributeTypes; /** * 数据类型。 */ - dataType: IVertexDataType, + dataType: VertexDataType, /** * 所占字节尺寸。 -- Gitee From 411759651f9809021bf6dfbd8c29646614430938 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 14:15:31 +0800 Subject: [PATCH 060/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E7=B1=BB=E5=9E=8B=E5=AE=9A=E4=B9=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 ITextureLike 重命名为 TextureLike - 将 IPrimitiveTopology 重命名为 PrimitiveTopology - 将 ICullFace 重命名为 CullFace - 将 IFrontFace 重命名为 FrontFace - 更新相关接口和类型定义 --- src/data/ImageCopyTexture.ts | 4 ++-- src/data/OcclusionQuery.ts | 24 ++++++++++++++++++++++++ src/data/PrimitiveState.ts | 16 ++++++++-------- src/data/ReadPixels.ts | 4 ++++ src/data/RenderPass.ts | 14 ++++++++------ src/data/TextureView.ts | 6 +++--- src/index.ts | 5 ++++- 7 files changed, 53 insertions(+), 20 deletions(-) create mode 100644 src/data/OcclusionQuery.ts create mode 100644 src/data/ReadPixels.ts diff --git a/src/data/ImageCopyTexture.ts b/src/data/ImageCopyTexture.ts index f41c921..de3f44f 100644 --- a/src/data/ImageCopyTexture.ts +++ b/src/data/ImageCopyTexture.ts @@ -1,5 +1,5 @@ import { ITextureOrigin, Texture } from "./Texture"; -import { ITextureLike } from "./TextureView"; +import { TextureLike } from "./TextureView"; /** * 被操作的纹理相关信息。 @@ -14,7 +14,7 @@ export interface ImageCopyTexture /** * Texture to copy to/from. */ - texture: ITextureLike; + texture: TextureLike; /** * Mip-map level of the {@link GPUImageCopyTexture#texture} to copy to/from. diff --git a/src/data/OcclusionQuery.ts b/src/data/OcclusionQuery.ts new file mode 100644 index 0000000..2d9836e --- /dev/null +++ b/src/data/OcclusionQuery.ts @@ -0,0 +1,24 @@ +import { RenderObject } from "./RenderObject"; + +export interface OcclusionQuery +{ + /** + * 数据类型。 + */ + readonly __type__: "OcclusionQuery"; + + /** + * GPU渲染对象列表。 + */ + renderObjects: RenderObject[]; + + /** + * 渲染完成后由引擎自动填充。 + */ + result?: { + /** + * 查询结果。 + */ + result: number; + }; +} \ No newline at end of file diff --git a/src/data/PrimitiveState.ts b/src/data/PrimitiveState.ts index 86f90fc..19ee77a 100644 --- a/src/data/PrimitiveState.ts +++ b/src/data/PrimitiveState.ts @@ -26,7 +26,7 @@ export interface PrimitiveState * * LINE_LOOP 绘制循环连线。 * * TRIANGLE_FAN 绘制三角扇形。 */ - topology?: IPrimitiveTopology; + topology?: PrimitiveTopology; /** * Defines which polygon orientation will be culled, if any. @@ -39,22 +39,22 @@ export interface PrimitiveState * * `front` 剔除正面 * * `back` 剔除背面 */ - cullFace?: ICullFace; + cullFace?: CullFace; /** * Defines which polygons are considered front-facing. * * 正向方向。默认 "ccw"，表示三角形逆时针方向为正面。 */ - frontFace?: IFrontFace; + frontFace?: FrontFace; } /** * 图元拓扑结构。 */ -export type IPrimitiveTopology = IPrimitiveTopologyMap[keyof IPrimitiveTopologyMap]; +export type PrimitiveTopology = PrimitiveTopologyMap[keyof PrimitiveTopologyMap]; -export interface IPrimitiveTopologyMap +export interface PrimitiveTopologyMap { "point-list": "point-list", "line-list": "line-list", @@ -68,9 +68,9 @@ export interface IPrimitiveTopologyMap * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/cullFace */ -export type ICullFace = ICullFaceMap[keyof ICullFaceMap]; +export type CullFace = CullFaceMap[keyof CullFaceMap]; -export interface ICullFaceMap +export interface CullFaceMap { "none": "none", "front": "front", @@ -80,4 +80,4 @@ export interface ICullFaceMap /** * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/frontFace */ -export type IFrontFace = "ccw" | "cw"; \ No newline at end of file +export type FrontFace = "ccw" | "cw"; \ No newline at end of file diff --git a/src/data/ReadPixels.ts b/src/data/ReadPixels.ts new file mode 100644 index 0000000..4c9c415 --- /dev/null +++ b/src/data/ReadPixels.ts @@ -0,0 +1,4 @@ +export interface ReadPixels +{ + +} \ No newline at end of file diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index 34dad1e..cb0addd 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -1,3 +1,4 @@ +import { OcclusionQuery } from "./OcclusionQuery"; import { RenderObject } from "./RenderObject"; import { RenderPassDescriptor } from "./RenderPassDescriptor"; @@ -23,12 +24,12 @@ export interface RenderPass */ readonly renderObjects?: readonly IRenderPassObject[]; - // /** - // * 渲染不被遮挡查询结果。具体数据保存在各子项的"result"属性中。 - // * - // * 当提交WebGL后自动获取结果后填充该属性。 - // */ - // occlusionQueryResults?: IGLOcclusionQuery[]; + /** + * 渲染不被遮挡查询结果。具体数据保存在各子项的"result"属性中。 + * + * 当提交WebGL后自动获取结果后填充该属性。 + */ + occlusionQueryResults?: OcclusionQuery[]; } export type IRenderPassObject = IRenderPassObjectMap[keyof IRenderPassObjectMap]; @@ -36,4 +37,5 @@ export type IRenderPassObject = IRenderPassObjectMap[keyof IRenderPassObjectMap] export interface IRenderPassObjectMap { IRenderObject: RenderObject; + OcclusionQuery: OcclusionQuery } \ No newline at end of file diff --git a/src/data/TextureView.ts b/src/data/TextureView.ts index b353882..158de4c 100644 --- a/src/data/TextureView.ts +++ b/src/data/TextureView.ts @@ -17,7 +17,7 @@ export interface TextureView /** * 产生视图的纹理。 */ - readonly texture: ITextureLike; + readonly texture: TextureLike; /** * mipmap级别。 @@ -39,12 +39,12 @@ export interface TextureView * * 如需扩展 ITextureLike，则需在 ITextureMap 中添加类型。 */ -export type ITextureLike = ITextureLikeMap[keyof ITextureLikeMap]; +export type TextureLike = TextureLikeMap[keyof TextureLikeMap]; /** * 如需扩展 ITextureLike，则需在 ITextureMap 中添加类型。 */ -export interface ITextureLikeMap +export interface TextureLikeMap { /** * 正常纹理。 diff --git a/src/index.ts b/src/index.ts index 3e16cd8..b737267 100644 --- a/src/index.ts +++ b/src/index.ts @@ -16,8 +16,9 @@ export * from "./data/DrawVertex"; export * from "./data/FragmentState"; export * from "./data/Geometry"; export * from "./data/ImageCopyTexture"; -export * from "./data/TextureDataSource"; +export * from "./data/OcclusionQuery"; export * from "./data/PrimitiveState"; +export * from "./data/ReadPixels"; export * from "./data/RenderObject"; export * from "./data/RenderPass"; export * from "./data/RenderPassColorAttachment"; @@ -29,6 +30,7 @@ export * from "./data/ScissorRect"; export * from "./data/StencilFaceState"; export * from "./data/Submit"; export * from "./data/Texture"; +export * from "./data/TextureDataSource"; export * from "./data/TextureImageSource"; export * from "./data/TextureView"; export * from "./data/Uniforms"; @@ -39,3 +41,4 @@ export * from "./data/WriteBuffer"; export * from "./types/TypedArray"; export * from "./types/UnReadonly"; + -- Gitee From cbec67975530820806c7724c961087813db12a2e Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 15:40:29 +0800 Subject: [PATCH 061/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E7=BA=B9=E7=90=86=E7=9B=B8=E5=85=B3=E6=95=B0=E6=8D=AE=E7=BB=93?= =?UTF-8?q?=E6=9E=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 ITextureSize、ITextureOrigin 等类型名称去掉前缀 I - 在 Texture 类中添加 getTextureDataConstructor 方法，用于获取纹理数据构造函数 - 更新相关文件中的类型引用 --- src/data/CopyTextureToTexture.ts | 4 +- src/data/ImageCopyTexture.ts | 4 +- src/data/ReadPixels.ts | 25 ++++++ src/data/Texture.ts | 131 ++++++++++++++++++------------- src/data/TextureDataSource.ts | 10 +-- src/data/TextureImageSource.ts | 10 +-- 6 files changed, 116 insertions(+), 68 deletions(-) diff --git a/src/data/CopyTextureToTexture.ts b/src/data/CopyTextureToTexture.ts index a727a89..c55126a 100644 --- a/src/data/CopyTextureToTexture.ts +++ b/src/data/CopyTextureToTexture.ts @@ -1,5 +1,5 @@ import { ImageCopyTexture } from "./ImageCopyTexture"; -import { ITextureSize } from "./Texture"; +import { TextureSize } from "./Texture"; /** * GPU纹理间拷贝。 @@ -26,5 +26,5 @@ export interface CopyTextureToTexture /** * 拷贝的尺寸。 */ - copySize: ITextureSize; + copySize: TextureSize; } diff --git a/src/data/ImageCopyTexture.ts b/src/data/ImageCopyTexture.ts index de3f44f..ff42f76 100644 --- a/src/data/ImageCopyTexture.ts +++ b/src/data/ImageCopyTexture.ts @@ -1,4 +1,4 @@ -import { ITextureOrigin, Texture } from "./Texture"; +import { TextureOrigin, Texture } from "./Texture"; import { TextureLike } from "./TextureView"; /** @@ -25,7 +25,7 @@ export interface ImageCopyTexture * Defines the origin of the copy - the minimum corner of the texture sub-region to copy to/from. * Together with `copySize`, defines the full copy sub-region. */ - origin?: ITextureOrigin; + origin?: TextureOrigin; /** * Defines which aspects of the {@link GPUImageCopyTexture#texture} to copy to/from. diff --git a/src/data/ReadPixels.ts b/src/data/ReadPixels.ts index 4c9c415..516980a 100644 --- a/src/data/ReadPixels.ts +++ b/src/data/ReadPixels.ts @@ -1,4 +1,29 @@ +import { TextureView } from "./TextureView"; + +/** + * 读取渲染缓冲区或者纹理视图中的像素值。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/readPixels + */ export interface ReadPixels { + /** + * 读取的纹理视图。 + */ + textureView: TextureView; + + /** + * 读取位置。 + */ + origin: [x: number, y: number], + + /** + * 读取尺寸 + */ + copySize: [width: number, height: number] + /** + * 用于保存最后结果。 + */ + result?: ArrayBufferView; } \ No newline at end of file diff --git a/src/data/Texture.ts b/src/data/Texture.ts index cc22dcf..010615e 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -22,7 +22,7 @@ export interface Texture * * 修改尺寸将会引发纹理销毁，使用时重新创建新纹理。 */ - size: ITextureSize; + size: TextureSize; /** * 初始化纹理资源。 @@ -60,12 +60,12 @@ export interface Texture * * WebGL中不支持 "1d" "cube-array"。 */ - readonly dimension?: ITextureDimension; + readonly dimension?: TextureDimension; /** * 纹理格式。 默认为 "rgba8unorm"， */ - readonly format?: ITextureFormat; + readonly format?: TextureFormat; /** * The number of mip levels the texture will contain. @@ -78,9 +78,9 @@ export class Texture /** * 获取纹理每个像素占用的字节数量。 * - * @param format + * @param format 纹理格式。 */ - static getTextureBytesPerPixel(format: ITextureFormat = "rgba8unorm") + static getTextureBytesPerPixel(format: TextureFormat = "rgba8unorm") { const bytesPerPixel = formatMap[format]?.bytesPerPixel; @@ -88,6 +88,21 @@ export class Texture return bytesPerPixel; } + + /** + * 获取纹理数据构造函数。 + + * @param format 纹理格式。 + * @returns + */ + static getTextureDataConstructor(format: TextureFormat = "rgba8unorm") + { + const bytesPerPixel = formatMap[format]?.dataConstructor; + + console.assert(!!bytesPerPixel, `未处理格式 ${format} ，无法查询到该格式的纹理数据构造函数！`); + + return bytesPerPixel; + } } /** @@ -104,7 +119,7 @@ export interface ITextureSourceMap /** * 纹理数据布局。 */ -export interface ITextureDataLayout +export interface TextureDataLayout { /** * 默认为 0。字节偏移，一般用于跳过文件头部非纹理数据部分。 @@ -131,39 +146,39 @@ export interface ITextureDataLayout /** * 图片中的坐标。 */ -export type IImageOrigin = readonly [x: number, y: number]; +export type ImageOrigin = readonly [x: number, y: number]; /** * 数据图片中的坐标。depthOrArrayLayers 表示数据中包含有多张图片中的第几张，只在纹理为2d纹理数组或者3d纹理时生效。 */ -export type IDataImageOrigin = readonly [x: number, y: number, depthOrArrayLayers?: number]; +export type DataImageOrigin = readonly [x: number, y: number, depthOrArrayLayers?: number]; /** * 图片尺寸 */ -export type IImageSize = readonly [width: number, height: number]; +export type ImageSize = readonly [width: number, height: number]; /** * 纹理尺寸，包含纹理的宽度、高度以及深度或者层数。 * * depthOrArrayLayers: 当纹理为3d纹理时表示深度，2d纹理数组时表示数组索引，cube纹理时表示6个面的索引。 */ -export type ITextureSize = readonly [width: number, height: number, depthOrArrayLayers?: number]; +export type TextureSize = readonly [width: number, height: number, depthOrArrayLayers?: number]; /** * 纹理内的坐标位置。 */ -export type ITextureOrigin = readonly [x: number, y: number, depthOrArrayLayers?: number]; +export type TextureOrigin = readonly [x: number, y: number, depthOrArrayLayers?: number]; /** * 纹理规格维度。 */ -export type ITextureDimension = "1d" | "2d" | "2d-array" | "cube" | "cube-array" | "3d"; +export type TextureDimension = "1d" | "2d" | "2d-array" | "cube" | "cube-array" | "3d"; /** * 参考 GPUTextureFormat */ -export type ITextureFormat = +export type TextureFormat = | "r8unorm" | "r8snorm" @@ -266,49 +281,57 @@ const formatMap: { /** * 每个像素占用的字节数量 */ - bytesPerPixel: number + bytesPerPixel: number, + + /** + * 数据构造函数 + */ + dataConstructor?: Uint8ArrayConstructor | Int8ArrayConstructor + | Uint16ArrayConstructor | Int16ArrayConstructor + | Uint32ArrayConstructor | Int32ArrayConstructor + | Float32ArrayConstructor, } } = { - r8unorm: { bytesPerPixel: 1 }, - r8snorm: { bytesPerPixel: 1 }, - r8uint: { bytesPerPixel: 1 }, - r8sint: { bytesPerPixel: 1 }, - r16uint: { bytesPerPixel: 2 }, - r16sint: { bytesPerPixel: 2 }, - r16float: { bytesPerPixel: 2 }, - rg8unorm: { bytesPerPixel: 2 }, - rg8snorm: { bytesPerPixel: 2 }, - rg8uint: { bytesPerPixel: 2 }, - rg8sint: { bytesPerPixel: 2 }, - r32uint: { bytesPerPixel: 4 }, - r32sint: { bytesPerPixel: 4 }, - r32float: { bytesPerPixel: 4 }, - rg16uint: { bytesPerPixel: 4 }, - rg16sint: { bytesPerPixel: 4 }, - rg16float: { bytesPerPixel: 4 }, - rgba8unorm: { bytesPerPixel: 4 }, - "rgba8unorm-srgb": { bytesPerPixel: 4 }, - rgba8snorm: { bytesPerPixel: 4 }, - rgba8uint: { bytesPerPixel: 4 }, - rgba8sint: { bytesPerPixel: 4 }, - bgra8unorm: { bytesPerPixel: 4 }, - "bgra8unorm-srgb": { bytesPerPixel: 4 }, - rgb9e5ufloat: { bytesPerPixel: 4 }, - rgb10a2uint: { bytesPerPixel: 4 }, - rgb10a2unorm: { bytesPerPixel: 4 }, - rg11b10ufloat: { bytesPerPixel: 4 }, - rg32uint: { bytesPerPixel: 8 }, - rg32sint: { bytesPerPixel: 8 }, - rg32float: { bytesPerPixel: 8 }, - rgba16uint: { bytesPerPixel: 8 }, - rgba16sint: { bytesPerPixel: 8 }, - rgba16float: { bytesPerPixel: 8 }, - rgba32uint: { bytesPerPixel: 16 }, - rgba32sint: { bytesPerPixel: 16 }, - rgba32float: { bytesPerPixel: 16 }, - stencil8: { bytesPerPixel: 1 }, - depth16unorm: { bytesPerPixel: 2 }, - depth24plus: { bytesPerPixel: 3 }, + r8unorm: { bytesPerPixel: 1, dataConstructor: Uint8Array }, + r8snorm: { bytesPerPixel: 1, dataConstructor: Int8Array }, + r8uint: { bytesPerPixel: 1, dataConstructor: Uint8Array }, + r8sint: { bytesPerPixel: 1, dataConstructor: Int8Array }, + r16uint: { bytesPerPixel: 2, dataConstructor: Uint16Array }, + r16sint: { bytesPerPixel: 2, dataConstructor: Int16Array }, + r16float: { bytesPerPixel: 2, dataConstructor: Uint16Array }, + rg8unorm: { bytesPerPixel: 2, dataConstructor: Uint8Array }, + rg8snorm: { bytesPerPixel: 2, dataConstructor: Int8Array }, + rg8uint: { bytesPerPixel: 2, dataConstructor: Uint8Array }, + rg8sint: { bytesPerPixel: 2, dataConstructor: Int8Array }, + r32uint: { bytesPerPixel: 4, dataConstructor: Uint32Array }, + r32sint: { bytesPerPixel: 4, dataConstructor: Int32Array }, + r32float: { bytesPerPixel: 4, dataConstructor: Float32Array }, + rg16uint: { bytesPerPixel: 4, dataConstructor: Uint16Array }, + rg16sint: { bytesPerPixel: 4, dataConstructor: Int16Array }, + rg16float: { bytesPerPixel: 4, dataConstructor: Uint16Array }, + rgba8unorm: { bytesPerPixel: 4, dataConstructor: Uint8Array }, + "rgba8unorm-srgb": { bytesPerPixel: 4, dataConstructor: Uint8Array }, + rgba8snorm: { bytesPerPixel: 4, dataConstructor: Int8Array }, + rgba8uint: { bytesPerPixel: 4, dataConstructor: Uint8Array }, + rgba8sint: { bytesPerPixel: 4, dataConstructor: Int8Array }, + bgra8unorm: { bytesPerPixel: 4, dataConstructor: Uint8Array }, + "bgra8unorm-srgb": { bytesPerPixel: 4, dataConstructor: Uint8Array }, + rgb9e5ufloat: { bytesPerPixel: 4, dataConstructor: Uint32Array }, + rgb10a2uint: { bytesPerPixel: 4, dataConstructor: Uint32Array }, + rgb10a2unorm: { bytesPerPixel: 4, dataConstructor: Uint32Array }, + rg11b10ufloat: { bytesPerPixel: 4, dataConstructor: Uint32Array }, + rg32uint: { bytesPerPixel: 8, dataConstructor: Uint32Array }, + rg32sint: { bytesPerPixel: 8, dataConstructor: Int32Array }, + rg32float: { bytesPerPixel: 8, dataConstructor: Float32Array }, + rgba16uint: { bytesPerPixel: 8, dataConstructor: Uint16Array }, + rgba16sint: { bytesPerPixel: 8, dataConstructor: Int16Array }, + rgba16float: { bytesPerPixel: 8, dataConstructor: Uint16Array }, + rgba32uint: { bytesPerPixel: 16, dataConstructor: Uint32Array }, + rgba32sint: { bytesPerPixel: 16, dataConstructor: Int32Array }, + rgba32float: { bytesPerPixel: 16, dataConstructor: Float32Array }, + stencil8: { bytesPerPixel: 1, dataConstructor: Uint8Array }, + depth16unorm: { bytesPerPixel: 2, dataConstructor: Uint16Array }, + depth24plus: { bytesPerPixel: 3, dataConstructor: Uint8Array }, "depth24plus-stencil8": { bytesPerPixel: 4 }, depth32float: { bytesPerPixel: 4 }, "depth32float-stencil8": { bytesPerPixel: 5 }, diff --git a/src/data/TextureDataSource.ts b/src/data/TextureDataSource.ts index 31425eb..1cf65de 100644 --- a/src/data/TextureDataSource.ts +++ b/src/data/TextureDataSource.ts @@ -1,4 +1,4 @@ -import { ITextureDataLayout, IDataImageOrigin, ITextureOrigin, ITextureSize } from "./Texture"; +import { TextureDataLayout, DataImageOrigin, TextureOrigin, TextureSize } from "./Texture"; /** * 纹理的数据资源。 @@ -27,12 +27,12 @@ export interface TextureDataSource * * 纹理数据布局。 */ - dataLayout?: ITextureDataLayout; + dataLayout?: TextureDataLayout; /** * 读取数据图片上的像素坐标。 */ - dataImageOrigin?: IDataImageOrigin; + dataImageOrigin?: DataImageOrigin; /** * 写入mipmap级别。 @@ -47,12 +47,12 @@ export interface TextureDataSource * * 写入纹理的位置。 */ - textureOrigin?: ITextureOrigin; + textureOrigin?: TextureOrigin; /** * Extents of the content to write from `source` to `destination`. * * 写入尺寸。 */ - size?: ITextureSize + size?: TextureSize } diff --git a/src/data/TextureImageSource.ts b/src/data/TextureImageSource.ts index 60508e7..dc9a823 100644 --- a/src/data/TextureImageSource.ts +++ b/src/data/TextureImageSource.ts @@ -1,4 +1,4 @@ -import { IImageOrigin, IImageSize, ITextureOrigin, ITextureSize } from "./Texture"; +import { ImageOrigin, ImageSize, TextureOrigin, TextureSize } from "./Texture"; /** * 纹理的图片资源。 @@ -27,7 +27,7 @@ export interface TextureImageSource /** * 读取图片上的像素坐标。 */ - imageOrigin?: IImageOrigin; + imageOrigin?: ImageOrigin; /** * 写入纹理的mipmap层级索引。 @@ -40,14 +40,14 @@ export interface TextureImageSource * * 写入纹理的位置。 */ - textureOrigin?: ITextureOrigin; + textureOrigin?: TextureOrigin; /** * Extents of the content to write from `source` to `destination`. * * 写入尺寸。 */ - size?: ITextureSize + size?: TextureSize /** * 是否Y轴翻转图片。 @@ -70,7 +70,7 @@ export class TextureImageSource * @param texImageSource 纹理的图片资源。 * @returns */ - static getTexImageSourceSize(image: TexImageSource): IImageSize + static getTexImageSourceSize(image: TexImageSource): ImageSize { let width: number; let height: number; -- Gitee From 8e94fb08fb55c70d7de66d40e096cb0dd26f6a07 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 18:05:16 +0800 Subject: [PATCH 062/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E7=B1=BB=E5=9E=8B=E5=AE=9A=E4=B9=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 修改 BufferBinding、CommandEncoder、RenderPass 和 Uniforms 文件中的类型定义 - 重命名 IUniformDataItem 为 UniformDataItem - 重命名 IBufferBindingItem 为 BufferBindingItem - 重命名 IPassEncoderMap 为 PassEncoderMap - 重命名 IRenderPassObjectMap 为 RenderPassObjectMap - 重命名 IUniformTypeMap 为 UniformTypeMap --- src/data/BufferBinding.ts | 6 +++--- src/data/CommandEncoder.ts | 8 ++++---- src/data/RenderPass.ts | 4 ++-- src/data/Uniforms.ts | 8 ++++---- 4 files changed, 13 insertions(+), 13 deletions(-) diff --git a/src/data/BufferBinding.ts b/src/data/BufferBinding.ts index 167bc8f..e1063e1 100644 --- a/src/data/BufferBinding.ts +++ b/src/data/BufferBinding.ts @@ -10,7 +10,7 @@ import { TypedArray } from "../types/TypedArray"; */ export interface BufferBinding { - [name: string]: IBufferBindingItem; + [name: string]: BufferBindingItem; /** * 如果未设置引擎将自动生成。 @@ -18,8 +18,8 @@ export interface BufferBinding readonly bufferView?: TypedArray; } -export type IUniformDataItem = number | number[] | number[][] | TypedArray | TypedArray[] +export type UniformDataItem = number | number[] | number[][] | TypedArray | TypedArray[] | { toArray(): number[] | Float32Array } | { toArray(): number[] | Float32Array }[] ; -export type IBufferBindingItem = IUniformDataItem | { [key: string]: IBufferBindingItem }; +export type BufferBindingItem = UniformDataItem | { [key: string]: BufferBindingItem }; diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index 100c9eb..a1465ea 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -22,14 +22,14 @@ export interface CommandEncoder /** * 通道编码器。 * - * 如需扩展 IPassEncoder ，请在 IPassEncoderMap 中进行添加。 + * 如需扩展 IPassEncoder ，请在 PassEncoderMap 中进行添加。 */ -export type IPassEncoder = IPassEncoderMap[keyof IPassEncoderMap]; +export type IPassEncoder = PassEncoderMap[keyof PassEncoderMap]; /** - * 如需扩展 IPassEncoder ，请在 IPassEncoderMap 中进行添加。 + * 如需扩展 IPassEncoder ，请在 PassEncoderMap 中进行添加。 */ -export interface IPassEncoderMap +export interface PassEncoderMap { /** * 渲染通道。 diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index cb0addd..81d4a24 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -32,9 +32,9 @@ export interface RenderPass occlusionQueryResults?: OcclusionQuery[]; } -export type IRenderPassObject = IRenderPassObjectMap[keyof IRenderPassObjectMap]; +export type IRenderPassObject = RenderPassObjectMap[keyof RenderPassObjectMap]; -export interface IRenderPassObjectMap +export interface RenderPassObjectMap { IRenderObject: RenderObject; OcclusionQuery: OcclusionQuery diff --git a/src/data/Uniforms.ts b/src/data/Uniforms.ts index 29220d7..da2dde4 100644 --- a/src/data/Uniforms.ts +++ b/src/data/Uniforms.ts @@ -1,4 +1,4 @@ -import { BufferBinding, IBufferBindingItem } from "./BufferBinding"; +import { BufferBinding, BufferBindingItem } from "./BufferBinding"; /** * Uniform 数据 @@ -13,13 +13,13 @@ export interface Uniforms /** * Uniform 类型 */ -export type IUniformType = IUniformTypeMap[keyof IUniformTypeMap]; +export type IUniformType = UniformTypeMap[keyof UniformTypeMap]; -export interface IUniformTypeMap +export interface UniformTypeMap { /** * 缓冲区绑定。 */ IBufferBinding: BufferBinding; - IBufferBindingItem: IBufferBindingItem; + IBufferBindingItem: BufferBindingItem; } -- Gitee From dbab2ab048c84aa117fb1a7cff5a5d840e6e86c8 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 19:46:43 +0800 Subject: [PATCH 063/105] =?UTF-8?q?refactor(src):=20=E6=9B=B4=E6=96=B0=20C?= =?UTF-8?q?anvasContext=20=E6=8E=A5=E5=8F=A3=E6=96=87=E6=A1=A3=E6=B3=A8?= =?UTF-8?q?=E9=87=8A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除了冗余的英文注释 - 添加了简明的中文注释 "画布上下文" - 提高了代码的可读性和维护性 --- src/data/CanvasContext.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/data/CanvasContext.ts b/src/data/CanvasContext.ts index 1382cd5..0c357d7 100644 --- a/src/data/CanvasContext.ts +++ b/src/data/CanvasContext.ts @@ -1,7 +1,5 @@ /** - * @see GPUCanvasContext - * @see HTMLCanvasElement.getContext - * @see GPUCanvasContext.configure + * 画布上下文 */ export interface CanvasContext { -- Gitee From c14d18b12dfdf9b9ea45de7346d17f1427792353 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 19:47:12 +0800 Subject: [PATCH 064/105] =?UTF-8?q?refactor(data):=20=E7=A7=BB=E9=99=A4=20?= =?UTF-8?q?CanvasContext=20=E6=8E=A5=E5=8F=A3=E4=B8=AD=E6=9C=AA=E4=BD=BF?= =?UTF-8?q?=E7=94=A8=E7=9A=84=E9=85=8D=E7=BD=AE=E5=B1=9E=E6=80=A7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 移除了 CanvasContext 接口中未使用的 configuration 属性。该属性原本用于画布配置，但目前并未在引擎中使用。此次修改简化了接口结构，提高了代码的可读性和维护性。 --- src/data/CanvasContext.ts | 5 ----- 1 file changed, 5 deletions(-) diff --git a/src/data/CanvasContext.ts b/src/data/CanvasContext.ts index 0c357d7..486eb08 100644 --- a/src/data/CanvasContext.ts +++ b/src/data/CanvasContext.ts @@ -9,9 +9,4 @@ export interface CanvasContext * 画布id */ readonly canvasId: string; - - /** - * 画布配置。默认有引擎自动设置。 - */ - // configuration?: IGPUCanvasConfiguration; } -- Gitee From 29b7f28a69e7469c02ebe3dc14af59be5680e295 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 20:25:31 +0800 Subject: [PATCH 065/105] =?UTF-8?q?refactor(data):=20=E4=BC=98=E5=8C=96=20?= =?UTF-8?q?CanvasTexture=20=E6=8E=A5=E5=8F=A3=E5=AE=9A=E4=B9=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除了 CanvasTexture 接口中的冗余注释 - 添加了对 context 属性的注释说明 - 简化了接口的描述，使其更加通用 --- src/data/CanvasTexture.ts | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/data/CanvasTexture.ts b/src/data/CanvasTexture.ts index 8283dc6..6737ac7 100644 --- a/src/data/CanvasTexture.ts +++ b/src/data/CanvasTexture.ts @@ -1,13 +1,14 @@ import { CanvasContext } from "./CanvasContext"; /** - * 画布纹理，从画布的WebGPU上下文获取纹理 - * - * 注：只在WebGPU上支持。 + * 画布纹理，从画布的上下文获取纹理 */ export interface CanvasTexture { __type__?: "CanvasTexture"; + /** + * 画布上下文。 + */ context: CanvasContext; } -- Gitee From 6c9058607af879f153c211ef0935acd9e1d726a3 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 21:33:57 +0800 Subject: [PATCH 066/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84=20?= =?UTF-8?q?Uniforms=20=E7=9B=B8=E5=85=B3=E7=B1=BB=E5=9E=8B=E5=AE=9A?= =?UTF-8?q?=E4=B9=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 IUniformType 重命名为 UniformType，简化类型名称 - 更新 Uniforms 接口使用新的 UniformType 类型 - 这些更改提高了代码的一致性和可读性 --- src/data/Uniforms.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/data/Uniforms.ts b/src/data/Uniforms.ts index da2dde4..30104f0 100644 --- a/src/data/Uniforms.ts +++ b/src/data/Uniforms.ts @@ -7,13 +7,13 @@ export interface Uniforms { __type__?: any; - [key: string]: IUniformType; + [key: string]: UniformType; } /** * Uniform 类型 */ -export type IUniformType = UniformTypeMap[keyof UniformTypeMap]; +export type UniformType = UniformTypeMap[keyof UniformTypeMap]; export interface UniformTypeMap { -- Gitee From a6963da4057a24d7b36e52620f6a12861bfb98b6 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 21:53:53 +0800 Subject: [PATCH 067/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E7=B1=BB=E5=9E=8B=E5=AE=9A=E4=B9=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 IVertexFormat 改为 VertexFormat - 将 IColor 改为 Color - 将 ILoadOp 改为 LoadOp - 将 IVertexStepMode 改为 VertexStepMode - 将 IVertexDataTypes 改为 VertexDataTypes --- src/consts/vertexFormatMap.ts | 4 ++-- src/data/BlendState.ts | 6 +++--- src/data/RenderPassColorAttachment.ts | 8 ++++---- src/data/VertexAttributes.ts | 12 ++++++------ 4 files changed, 15 insertions(+), 15 deletions(-) diff --git a/src/consts/vertexFormatMap.ts b/src/consts/vertexFormatMap.ts index a93fc0d..01c7489 100644 --- a/src/consts/vertexFormatMap.ts +++ b/src/consts/vertexFormatMap.ts @@ -1,9 +1,9 @@ -import { IVertexFormat } from "../data/VertexAttributes"; +import { VertexFormat } from "../data/VertexAttributes"; /** * 顶点属性格式信息映射。 */ -export const vertexFormatMap: Record = { +export const vertexFormatMap: Record = { "uint8x2": { "numComponents": 2, "type": "UNSIGNED_BYTE", "normalized": false, "dataType": "unsigned int", "byteSize": 2, "wgslType": "vec2", "typedArrayConstructor": Uint8Array }, "uint8x4": { "numComponents": 4, "type": "UNSIGNED_BYTE", "normalized": false, "dataType": "unsigned int", "byteSize": 4, "wgslType": "vec4", "typedArrayConstructor": Uint8Array }, "sint8x2": { "numComponents": 2, "type": "BYTE", "normalized": false, "dataType": "signed int", "byteSize": 2, "wgslType": "vec2", "typedArrayConstructor": Int8Array }, diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index f59a0eb..7e131bf 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -1,5 +1,5 @@ import { BlendComponent } from "./BlendComponent"; -import { IColor } from "./RenderPassColorAttachment"; +import { Color } from "./RenderPassColorAttachment"; /** * 混合状态。 @@ -24,7 +24,7 @@ export interface BlendState * * 注：只取 renderPipeline.fragment?.targets?.[0]?.blend.constantColor 值。 */ - readonly constantColor?: IColor; + readonly constantColor?: Color; /** * 为颜色通道定义相应渲染目标的混合行为。 @@ -45,7 +45,7 @@ export class BlendState * @param blend * @returns */ - static getBlendConstantColor(blendState: BlendState): IColor + static getBlendConstantColor(blendState: BlendState): Color { if (!blendState) return undefined; diff --git a/src/data/RenderPassColorAttachment.ts b/src/data/RenderPassColorAttachment.ts index 2cf2c47..f7970f2 100644 --- a/src/data/RenderPassColorAttachment.ts +++ b/src/data/RenderPassColorAttachment.ts @@ -39,7 +39,7 @@ export interface RenderPassColorAttachment * They are converted [$to a texel value of texture format$] matching the render attachment. * If conversion fails, a validation error is generated. */ - readonly clearValue?: IColor; + readonly clearValue?: Color; /** * 是否清除颜色附件。 @@ -56,9 +56,9 @@ export interface RenderPassColorAttachment * executing the render pass. * Note: It is recommended to prefer clearing; see {@link GPULoadOp#"clear"} for details. */ - readonly loadOp?: ILoadOp; + readonly loadOp?: LoadOp; } -export type IColor = [red: number, green: number, blue: number, alpha: number]; +export type Color = [red: number, green: number, blue: number, alpha: number]; -export type ILoadOp = "load" | "clear"; +export type LoadOp = "load" | "clear"; diff --git a/src/data/VertexAttributes.ts b/src/data/VertexAttributes.ts index 7dc3abb..e2e44cd 100644 --- a/src/data/VertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -18,14 +18,14 @@ export interface VertexAttribute /** * 顶点数据。 */ - data: IVertexDataTypes; + data: VertexDataTypes; /** * 顶点数据格式。 * * 由于提供的数据并不一定与着色器中格式一直，因此必须提供与着色器中兼容的数据格式。 */ - readonly format: IVertexFormat; + readonly format: VertexFormat; /** * 所在顶点数据中的偏移字节数。 @@ -46,7 +46,7 @@ export interface VertexAttribute * * 默认 `"vertex"` 。 */ - readonly stepMode?: IVertexStepMode; + readonly stepMode?: VertexStepMode; } export class VertexAttribute @@ -83,9 +83,9 @@ export class VertexAttribute } } -export type IVertexStepMode = "vertex" | "instance"; +export type VertexStepMode = "vertex" | "instance"; -export type IVertexDataTypes = | Float32Array +export type VertexDataTypes = | Float32Array | Uint32Array | Int32Array | Uint16Array @@ -97,7 +97,7 @@ export type IVertexDataTypes = | Float32Array /** * 顶点数据格式。 */ -export type IVertexFormat = +export type VertexFormat = | "uint8x2" | "uint8x4" | "sint8x2" -- Gitee From 9e38bf41f2cdacb3d36cfe2951673e23cbd8f5a6 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 13 Mar 2025 13:22:53 +0800 Subject: [PATCH 068/105] =?UTF-8?q?refactor:=20=E6=B7=BB=E5=8A=A0=20Buffer?= =?UTF-8?q?BindingInfo=20=E7=9A=84=E5=AF=BC=E5=87=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 src/index.ts 中添加了对 internal/BufferBindingInfo 的导出 - 这个改动使得 BufferBindingInfo 可以在外部访问，可能对某些高级用例有用 --- src/index.ts | 2 ++ src/internal/BufferBindingInfo.ts | 13 +++++++++++++ 2 files changed, 15 insertions(+) create mode 100644 src/internal/BufferBindingInfo.ts diff --git a/src/index.ts b/src/index.ts index b737267..e2ff293 100644 --- a/src/index.ts +++ b/src/index.ts @@ -39,6 +39,8 @@ export * from "./data/VertexState"; export * from "./data/Viewport"; export * from "./data/WriteBuffer"; +export * from "./internal/BufferBindingInfo"; + export * from "./types/TypedArray"; export * from "./types/UnReadonly"; diff --git a/src/internal/BufferBindingInfo.ts b/src/internal/BufferBindingInfo.ts new file mode 100644 index 0000000..764a0d5 --- /dev/null +++ b/src/internal/BufferBindingInfo.ts @@ -0,0 +1,13 @@ +/** + * 缓冲区绑定信息。 + */ +export interface BufferBindingInfo +{ + size: number; + items: { + paths: string[]; + offset: number; + size: number; + Cls: Float32ArrayConstructor | Int32ArrayConstructor | Uint32ArrayConstructor | Int16ArrayConstructor; + }[] +} -- Gitee From 56788cbd7c7fa9754c0cd13285e4f7f80dac7ac1 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 13 Mar 2025 23:34:19 +0800 Subject: [PATCH 069/105] =?UTF-8?q?refactor(data):=20=E5=B0=86=20Buffer=20?= =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E4=B8=AD=E7=9A=84=20writeBuffers=20=E5=B1=9E?= =?UTF-8?q?=E6=80=A7=E6=A0=87=E8=AE=B0=E4=B8=BA=E5=8F=AA=E8=AF=BB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 Buffer 接口中，将 writeBuffers 属性添加 readonly 修饰符 - 此更改表示该属性在创建后不应被修改，提高了代码的可读性和安全性 --- src/data/Buffer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/data/Buffer.ts b/src/data/Buffer.ts index 8c601b9..4108b9f 100644 --- a/src/data/Buffer.ts +++ b/src/data/Buffer.ts @@ -38,5 +38,5 @@ export interface Buffer * * {@link GPUQueue.writeBuffer} */ - writeBuffers?: WriteBuffer[]; + readonly writeBuffers?: WriteBuffer[]; } -- Gitee From 0c8a9751d2baabf3f2e52b4f83568565b06ac197 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 14 Mar 2025 18:01:27 +0800 Subject: [PATCH 070/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84=20?= =?UTF-8?q?Uniforms=20=E6=8E=A5=E5=8F=A3=E5=B9=B6=E6=94=B9=E5=90=8D?= =?UTF-8?q?=E4=B8=BA=20BindingResources?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 Uniforms 接口重命名为 BindingResources，以更好地反映其功能 - 更新了相关文件中的引用，以适应这一更改 - 删除了 Uniforms.ts 文件，因其内容已迁移到 BindingResources --- src/data/{Uniforms.ts => BindingResources.ts} | 14 ++++++++------ src/data/RenderObject.ts | 4 ++-- src/data/RenderPass.ts | 4 ++-- src/index.ts | 2 +- 4 files changed, 13 insertions(+), 11 deletions(-) rename src/data/{Uniforms.ts => BindingResources.ts} (40%) diff --git a/src/data/Uniforms.ts b/src/data/BindingResources.ts similarity index 40% rename from src/data/Uniforms.ts rename to src/data/BindingResources.ts index 30104f0..50d4e12 100644 --- a/src/data/Uniforms.ts +++ b/src/data/BindingResources.ts @@ -1,21 +1,23 @@ import { BufferBinding, BufferBindingItem } from "./BufferBinding"; /** - * Uniform 数据 + * 绑定资源。 + * + * 与WGSL中名称对应的绑定资源（纹理、采样器、统一数据、存储数据等）。 */ -export interface Uniforms +export interface BindingResources { __type__?: any; - [key: string]: UniformType; + [key: string]: BindingResource; } /** - * Uniform 类型 + * 绑定资源 类型 */ -export type UniformType = UniformTypeMap[keyof UniformTypeMap]; +export type BindingResource = BindingResourceTypeMap[keyof BindingResourceTypeMap]; -export interface UniformTypeMap +export interface BindingResourceTypeMap { /** * 缓冲区绑定。 diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 09d2dd3..46a5606 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,7 +1,7 @@ import { Geometry } from "./Geometry"; import { RenderPipeline } from "./RenderPipeline"; import { ScissorRect } from "./ScissorRect"; -import { Uniforms } from "./Uniforms"; +import { BindingResources } from "./BindingResources"; import { Viewport } from "./Viewport"; /** @@ -39,7 +39,7 @@ export interface RenderObject /** * Uniform变量数据 */ - uniforms?: Uniforms; + uniforms?: BindingResources; _version?: number; } diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index 81d4a24..d34a58f 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -22,7 +22,7 @@ export interface RenderPass /** * 渲染对象列表 */ - readonly renderObjects?: readonly IRenderPassObject[]; + readonly renderObjects?: readonly RenderPassObject[]; /** * 渲染不被遮挡查询结果。具体数据保存在各子项的"result"属性中。 @@ -32,7 +32,7 @@ export interface RenderPass occlusionQueryResults?: OcclusionQuery[]; } -export type IRenderPassObject = RenderPassObjectMap[keyof RenderPassObjectMap]; +export type RenderPassObject = RenderPassObjectMap[keyof RenderPassObjectMap]; export interface RenderPassObjectMap { diff --git a/src/index.ts b/src/index.ts index e2ff293..db3c056 100644 --- a/src/index.ts +++ b/src/index.ts @@ -33,7 +33,7 @@ export * from "./data/Texture"; export * from "./data/TextureDataSource"; export * from "./data/TextureImageSource"; export * from "./data/TextureView"; -export * from "./data/Uniforms"; +export * from "./data/BindingResources"; export * from "./data/VertexAttributes"; export * from "./data/VertexState"; export * from "./data/Viewport"; -- Gitee From 1b461fa2fcc9e00ed0514b6363044058d377cacb Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 14 Mar 2025 18:12:56 +0800 Subject: [PATCH 071/105] =?UTF-8?q?build(dependencies):=20=E6=B7=BB?= =?UTF-8?q?=E5=8A=A0=20Vue=20=E5=8F=8D=E5=BA=94=E6=80=A7=E5=BA=93=E5=B9=B6?= =?UTF-8?q?=E8=B0=83=E6=95=B4=E5=AF=BC=E5=87=BA=E9=A1=BA=E5=BA=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 package.json 中添加 @vue/reactivity 依赖，版本为 ^3.5.13 - 在 src/index.ts 中导入并导出 reactivity 模块 - 调整 BindingResources 的导出顺序，移到 VertexAttributes 之前 --- package.json | 1 + src/index.ts | 4 +++- src/reactivity.ts | 12 ++++++++++++ 3 files changed, 16 insertions(+), 1 deletion(-) create mode 100644 src/reactivity.ts diff --git a/package.json b/package.json index d871a44..a426988 100644 --- a/package.json +++ b/package.json @@ -56,5 +56,6 @@ "vitest": "^0.32.2" }, "dependencies": { + "@vue/reactivity": "^3.5.13" } } \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index db3c056..7930ed0 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,6 @@ export * from "./consts/vertexFormatMap"; +export * from "./data/BindingResources"; export * from "./data/BlendComponent"; export * from "./data/BlendState"; export * from "./data/Buffer"; @@ -33,12 +34,13 @@ export * from "./data/Texture"; export * from "./data/TextureDataSource"; export * from "./data/TextureImageSource"; export * from "./data/TextureView"; -export * from "./data/BindingResources"; export * from "./data/VertexAttributes"; export * from "./data/VertexState"; export * from "./data/Viewport"; export * from "./data/WriteBuffer"; +export * from "./reactivity"; + export * from "./internal/BufferBindingInfo"; export * from "./types/TypedArray"; diff --git a/src/reactivity.ts b/src/reactivity.ts new file mode 100644 index 0000000..a6b45bc --- /dev/null +++ b/src/reactivity.ts @@ -0,0 +1,12 @@ +import { UnReadonly } from "@feng3d/render-api"; +import { reactive as vueReactive } from "@vue/reactivity"; + +export { computed, type ComputedRef, effect } from "@vue/reactivity"; + +/** + * Vue响应式。 + * + * 额外把只读属性去掉（引擎希望原始数据只用于访问，不直接修改，通过修改响应式数据来触发引擎更新逻辑并间接修改原始数据）。 + */ +export const reactive: (target: T) => UnReadonly = vueReactive as any; + -- Gitee From a8ae421d865589a1614391f3e5acf61064c34a50 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 14 Mar 2025 18:17:32 +0800 Subject: [PATCH 072/105] =?UTF-8?q?refactor(data):=20=E5=B0=86=20Buffer=20?= =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E9=87=8D=E5=91=BD=E5=90=8D=E4=B8=BA=20GBuffe?= =?UTF-8?q?r?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 src/data/Buffer.ts 中将 Buffer 接口重命名为 GBuffer - 在 src/data/CopyBufferToBuffer.ts 中更新了相关的导入和类型引用 --- src/data/Buffer.ts | 2 +- src/data/CopyBufferToBuffer.ts | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/data/Buffer.ts b/src/data/Buffer.ts index 4108b9f..23bdf1e 100644 --- a/src/data/Buffer.ts +++ b/src/data/Buffer.ts @@ -10,7 +10,7 @@ import { WriteBuffer } from "./WriteBuffer"; * * {@link GPUBuffer} */ -export interface Buffer +export interface GBuffer { __type__?: "Buffer"; diff --git a/src/data/CopyBufferToBuffer.ts b/src/data/CopyBufferToBuffer.ts index 264cfde..89cd239 100644 --- a/src/data/CopyBufferToBuffer.ts +++ b/src/data/CopyBufferToBuffer.ts @@ -1,4 +1,4 @@ -import { Buffer } from "./Buffer"; +import { GBuffer } from "./Buffer"; /** * GPU缓冲区之间拷贝。 @@ -16,7 +16,7 @@ export interface CopyBufferToBuffer /** * 源缓冲区。 */ - source: Buffer; + source: GBuffer; /** * 默认为0。 @@ -26,7 +26,7 @@ export interface CopyBufferToBuffer /** * 目标缓冲区。 */ - destination: Buffer; + destination: GBuffer; /** * 默认为0。 -- Gitee From 573d49d7d63493a501fd7c018efaa179e00743b2 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 14 Mar 2025 18:23:00 +0800 Subject: [PATCH 073/105] =?UTF-8?q?refactor(data):=20=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E7=BB=91=E5=AE=9A=E8=B5=84=E6=BA=90=E5=92=8C=E6=B8=B2=E6=9F=93?= =?UTF-8?q?=E5=AF=B9=E8=B1=A1=E7=9A=84=E5=AE=9A=E4=B9=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 更新 BindingResources 接口的注释，明确其与着色器中名称的对应关系 - 修改 RenderObject 接口中的 uniforms 属性名称为 bindingResources，以更准确地反映其内容 --- src/data/BindingResources.ts | 2 +- src/data/RenderObject.ts | 6 ++++-- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/src/data/BindingResources.ts b/src/data/BindingResources.ts index 50d4e12..cc71199 100644 --- a/src/data/BindingResources.ts +++ b/src/data/BindingResources.ts @@ -3,7 +3,7 @@ import { BufferBinding, BufferBindingItem } from "./BufferBinding"; /** * 绑定资源。 * - * 与WGSL中名称对应的绑定资源（纹理、采样器、统一数据、存储数据等）。 + * 与着色器中名称对应的绑定资源（纹理、采样器、统一数据、存储数据等）。 */ export interface BindingResources { diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 46a5606..9c95fc6 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -37,9 +37,11 @@ export interface RenderObject geometry: Geometry; /** - * Uniform变量数据 + * 绑定资源。 + * + * 与着色器中名称对应的绑定资源（纹理、采样器、统一数据、存储数据等）。 */ - uniforms?: BindingResources; + bindingResources?: BindingResources; _version?: number; } -- Gitee From 0530a659c5a4cd337cabbf16ec5879da63c4c742 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 14 Mar 2025 20:58:25 +0800 Subject: [PATCH 074/105] =?UTF-8?q?refactor(data):=20=E7=A7=BB=E9=99=A4?= =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E4=B8=AD=E7=9A=84=20=5F=5Ftype=5F=5F=20?= =?UTF-8?q?=E5=B1=9E=E6=80=A7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 移除了多个接口中不必要的 __type__ 属性，包括： - BindingResources - BlendComponent - BlendState - Buffer - CanvasContext - CanvasTexture - ColorTargetState - CommandEncoder - DepthStencilState - FragmentState - Geometry - ImageCopyTexture - PrimitiveState - RenderPassColorAttachment - RenderPassDepthStencilAttachment - RenderPassDescriptor - RenderPipeline - Sampler - ScissorRect - StencilFaceState - Submit - Texture - TextureView - VertexAttributes - VertexState - Viewport - WriteBuffer 这个改动简化了接口定义，并减少了冗余的类型信息。 --- src/data/BindingResources.ts | 2 -- src/data/BlendComponent.ts | 2 -- src/data/BlendState.ts | 2 -- src/data/Buffer.ts | 2 -- src/data/CanvasContext.ts | 2 -- src/data/CanvasTexture.ts | 2 -- src/data/ColorTargetState.ts | 2 -- src/data/CommandEncoder.ts | 2 -- src/data/DepthStencilState.ts | 2 -- src/data/FragmentState.ts | 2 -- src/data/Geometry.ts | 2 -- src/data/ImageCopyTexture.ts | 5 +---- src/data/PrimitiveState.ts | 2 -- src/data/RenderPassColorAttachment.ts | 2 -- src/data/RenderPassDepthStencilAttachment.ts | 2 -- src/data/RenderPassDescriptor.ts | 2 -- src/data/RenderPipeline.ts | 2 -- src/data/Sampler.ts | 2 -- src/data/ScissorRect.ts | 2 -- src/data/StencilFaceState.ts | 2 -- src/data/Submit.ts | 2 -- src/data/Texture.ts | 20 ++++++++++++++++-- src/data/TextureView.ts | 22 +------------------- src/data/VertexAttributes.ts | 2 -- src/data/VertexState.ts | 2 -- src/data/Viewport.ts | 2 -- src/data/WriteBuffer.ts | 2 -- 27 files changed, 20 insertions(+), 75 deletions(-) diff --git a/src/data/BindingResources.ts b/src/data/BindingResources.ts index cc71199..2253ce6 100644 --- a/src/data/BindingResources.ts +++ b/src/data/BindingResources.ts @@ -7,8 +7,6 @@ import { BufferBinding, BufferBindingItem } from "./BufferBinding"; */ export interface BindingResources { - __type__?: any; - [key: string]: BindingResource; } diff --git a/src/data/BlendComponent.ts b/src/data/BlendComponent.ts index b17a6e5..b9e906b 100644 --- a/src/data/BlendComponent.ts +++ b/src/data/BlendComponent.ts @@ -12,8 +12,6 @@ */ export interface BlendComponent { - __type__?: "BlendComponent"; - /** * 混合方式。 * diff --git a/src/data/BlendState.ts b/src/data/BlendState.ts index 7e131bf..5b68384 100644 --- a/src/data/BlendState.ts +++ b/src/data/BlendState.ts @@ -12,8 +12,6 @@ import { Color } from "./RenderPassColorAttachment"; */ export interface BlendState { - __type__?: "BlendState"; - /** * 混合时使用的常量值，默认为 [0,0,0,0]。 * diff --git a/src/data/Buffer.ts b/src/data/Buffer.ts index 23bdf1e..f7563f3 100644 --- a/src/data/Buffer.ts +++ b/src/data/Buffer.ts @@ -12,8 +12,6 @@ import { WriteBuffer } from "./WriteBuffer"; */ export interface GBuffer { - __type__?: "Buffer"; - /** * 标签。 * diff --git a/src/data/CanvasContext.ts b/src/data/CanvasContext.ts index 486eb08..3f9a20c 100644 --- a/src/data/CanvasContext.ts +++ b/src/data/CanvasContext.ts @@ -3,8 +3,6 @@ */ export interface CanvasContext { - __type__?: "CanvasContext"; - /** * 画布id */ diff --git a/src/data/CanvasTexture.ts b/src/data/CanvasTexture.ts index 6737ac7..5ad3990 100644 --- a/src/data/CanvasTexture.ts +++ b/src/data/CanvasTexture.ts @@ -5,8 +5,6 @@ import { CanvasContext } from "./CanvasContext"; */ export interface CanvasTexture { - __type__?: "CanvasTexture"; - /** * 画布上下文。 */ diff --git a/src/data/ColorTargetState.ts b/src/data/ColorTargetState.ts index 49ac807..73d964d 100644 --- a/src/data/ColorTargetState.ts +++ b/src/data/ColorTargetState.ts @@ -7,8 +7,6 @@ import { BlendState } from "./BlendState"; */ export interface ColorTargetState { - __type__?: "ColorTargetState"; - /** * The blending behavior for this color target. If left undefined, disables blending for this * color target. diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index a1465ea..ea29b80 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -9,8 +9,6 @@ import { RenderPass } from "./RenderPass"; */ export interface CommandEncoder { - __type__?: "CommandEncoder"; - /** * 通道编码器列表。 * diff --git a/src/data/DepthStencilState.ts b/src/data/DepthStencilState.ts index 968cc07..9fff8ab 100644 --- a/src/data/DepthStencilState.ts +++ b/src/data/DepthStencilState.ts @@ -11,8 +11,6 @@ import { ICompareFunction, StencilFaceState } from "./StencilFaceState"; */ export interface DepthStencilState { - __type__?: "DepthStencilState"; - /** * 指示这个 GPURenderPipeline 是否可以修改 depthStencilAttachment 深度值。 * diff --git a/src/data/FragmentState.ts b/src/data/FragmentState.ts index be66cb0..db702d5 100644 --- a/src/data/FragmentState.ts +++ b/src/data/FragmentState.ts @@ -7,8 +7,6 @@ import { ColorTargetState } from "./ColorTargetState"; */ export interface FragmentState { - __type__?: "FragmentState"; - /** * 着色器代码。 */ diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index a4d905c..385166f 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -14,8 +14,6 @@ import { VertexAttribute, VertexAttributes } from "./VertexAttributes"; */ export interface Geometry { - __type__?: "Geometry"; - /** * Describes the primitive-related properties of the pipeline. * diff --git a/src/data/ImageCopyTexture.ts b/src/data/ImageCopyTexture.ts index ff42f76..4f62594 100644 --- a/src/data/ImageCopyTexture.ts +++ b/src/data/ImageCopyTexture.ts @@ -1,5 +1,4 @@ -import { TextureOrigin, Texture } from "./Texture"; -import { TextureLike } from "./TextureView"; +import { TextureLike, TextureOrigin } from "./Texture"; /** * 被操作的纹理相关信息。 @@ -9,8 +8,6 @@ import { TextureLike } from "./TextureView"; */ export interface ImageCopyTexture { - __type__?: "ImageCopyTexture"; - /** * Texture to copy to/from. */ diff --git a/src/data/PrimitiveState.ts b/src/data/PrimitiveState.ts index 19ee77a..e4a03e0 100644 --- a/src/data/PrimitiveState.ts +++ b/src/data/PrimitiveState.ts @@ -7,8 +7,6 @@ */ export interface PrimitiveState { - __type__?: "PrimitiveState"; - /** * The type of primitive to be constructed from the vertex inputs. * diff --git a/src/data/RenderPassColorAttachment.ts b/src/data/RenderPassColorAttachment.ts index f7970f2..c708709 100644 --- a/src/data/RenderPassColorAttachment.ts +++ b/src/data/RenderPassColorAttachment.ts @@ -5,8 +5,6 @@ import { TextureView } from "./TextureView"; */ export interface RenderPassColorAttachment { - __type__?: "RenderPassColorAttachment"; - /** * 颜色附件视图。 * diff --git a/src/data/RenderPassDepthStencilAttachment.ts b/src/data/RenderPassDepthStencilAttachment.ts index 77573f9..3341033 100644 --- a/src/data/RenderPassDepthStencilAttachment.ts +++ b/src/data/RenderPassDepthStencilAttachment.ts @@ -5,8 +5,6 @@ import { TextureView } from "./TextureView"; */ export interface RenderPassDepthStencilAttachment { - __type__?: "RenderPassDepthStencilAttachment"; - /** * 深度附件视图。 * diff --git a/src/data/RenderPassDescriptor.ts b/src/data/RenderPassDescriptor.ts index f571aa2..3f44a05 100644 --- a/src/data/RenderPassDescriptor.ts +++ b/src/data/RenderPassDescriptor.ts @@ -6,8 +6,6 @@ import { RenderPassDepthStencilAttachment } from "./RenderPassDepthStencilAttach */ export interface RenderPassDescriptor { - __type__?: "RenderPassDescriptor"; - /** * 标签。 * diff --git a/src/data/RenderPipeline.ts b/src/data/RenderPipeline.ts index 188054c..601e5cc 100644 --- a/src/data/RenderPipeline.ts +++ b/src/data/RenderPipeline.ts @@ -9,8 +9,6 @@ import { VertexState } from "./VertexState"; */ export interface RenderPipeline { - __type__?: "RenderPipeline"; - /** * 标签。 * diff --git a/src/data/Sampler.ts b/src/data/Sampler.ts index c30d42d..d7ddee1 100644 --- a/src/data/Sampler.ts +++ b/src/data/Sampler.ts @@ -12,8 +12,6 @@ import { ICompareFunction } from "./StencilFaceState"; */ export interface Sampler { - __type__?: "Sampler"; - /** * 标签。 * diff --git a/src/data/ScissorRect.ts b/src/data/ScissorRect.ts index 5ddc496..f4d9996 100644 --- a/src/data/ScissorRect.ts +++ b/src/data/ScissorRect.ts @@ -17,8 +17,6 @@ */ export interface ScissorRect { - __type__?: "ScissorRect"; - /** * 是否为Y轴朝上。 * diff --git a/src/data/StencilFaceState.ts b/src/data/StencilFaceState.ts index 9706ee5..e82cc0e 100644 --- a/src/data/StencilFaceState.ts +++ b/src/data/StencilFaceState.ts @@ -5,8 +5,6 @@ */ export interface StencilFaceState { - __type__?: "StencilFaceState"; - /** * 在测试片元与 depthStencilAttachment 模板值时使用的 GPUCompareFunction。 * diff --git a/src/data/Submit.ts b/src/data/Submit.ts index ba3390f..9a05068 100644 --- a/src/data/Submit.ts +++ b/src/data/Submit.ts @@ -7,8 +7,6 @@ import { CommandEncoder } from "./CommandEncoder"; */ export interface Submit { - __type__?: "Submit"; - /** * 命令编码器列表。 */ diff --git a/src/data/Texture.ts b/src/data/Texture.ts index 010615e..6cbb607 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -1,13 +1,29 @@ import { TextureDataSource } from "./TextureDataSource"; import { TextureImageSource } from "./TextureImageSource"; +/** + * 类似纹理，包含画布纹理以及正常纹理。 + * + * 如需扩展 ITextureLike，则需在 ITextureMap 中添加类型。 + */ +export type TextureLike = TextureLikeMap[keyof TextureLikeMap]; + +/** + * 如需扩展 ITextureLike，则需在 ITextureMap 中添加类型。 + */ +export interface TextureLikeMap +{ + /** + * 正常纹理。 + */ + Texture: Texture; +} + /** * 纹理 */ export interface Texture { - __type__?: "Texture"; - /** * 标签。 * diff --git a/src/data/TextureView.ts b/src/data/TextureView.ts index 158de4c..da6fd2c 100644 --- a/src/data/TextureView.ts +++ b/src/data/TextureView.ts @@ -1,12 +1,10 @@ -import { Texture } from "./Texture"; +import { TextureLike } from "./Texture"; /** * 纹理视图。 */ export interface TextureView { - __type__?: "TextureView"; - /** * 标签。 * @@ -33,21 +31,3 @@ export interface TextureView */ readonly baseArrayLayer?: number; } - -/** - * 类似纹理，包含画布纹理以及正常纹理。 - * - * 如需扩展 ITextureLike，则需在 ITextureMap 中添加类型。 - */ -export type TextureLike = TextureLikeMap[keyof TextureLikeMap]; - -/** - * 如需扩展 ITextureLike，则需在 ITextureMap 中添加类型。 - */ -export interface TextureLikeMap -{ - /** - * 正常纹理。 - */ - Texture: Texture; -} \ No newline at end of file diff --git a/src/data/VertexAttributes.ts b/src/data/VertexAttributes.ts index e2e44cd..fdd8fa9 100644 --- a/src/data/VertexAttributes.ts +++ b/src/data/VertexAttributes.ts @@ -5,8 +5,6 @@ import { vertexFormatMap } from "../consts/vertexFormatMap"; */ export interface VertexAttributes { - __type__?: any; - [name: string]: VertexAttribute; } diff --git a/src/data/VertexState.ts b/src/data/VertexState.ts index 21335b7..033479e 100644 --- a/src/data/VertexState.ts +++ b/src/data/VertexState.ts @@ -3,8 +3,6 @@ */ export interface VertexState { - __type__?: "VertexState"; - /** * 着色器代码。 */ diff --git a/src/data/Viewport.ts b/src/data/Viewport.ts index a149698..4676c45 100644 --- a/src/data/Viewport.ts +++ b/src/data/Viewport.ts @@ -20,8 +20,6 @@ */ export interface Viewport { - __type__?: "Viewport"; - /** * 是否为Y轴朝上。 * diff --git a/src/data/WriteBuffer.ts b/src/data/WriteBuffer.ts index 2b65666..98bdb5d 100644 --- a/src/data/WriteBuffer.ts +++ b/src/data/WriteBuffer.ts @@ -2,8 +2,6 @@ import { TypedArray } from "../types/TypedArray"; export interface WriteBuffer { - __type__?: "WriteBuffer"; - /** * GPU缓冲区写入起始位置。 */ -- Gitee From aea2ae05a717ea5937d06f5c32d4b0efd9463fc5 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 14 Mar 2025 23:09:53 +0800 Subject: [PATCH 075/105] =?UTF-8?q?refactor:=20=E5=9C=A8=20index.ts=20?= =?UTF-8?q?=E4=B8=AD=E5=AF=BC=E5=85=A5=20global=20=E6=A8=A1=E5=9D=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/global.ts | 8 ++++++++ src/index.ts | 1 + 2 files changed, 9 insertions(+) create mode 100644 src/global.ts diff --git a/src/global.ts b/src/global.ts new file mode 100644 index 0000000..0777368 --- /dev/null +++ b/src/global.ts @@ -0,0 +1,8 @@ +export { }; +declare global +{ + /** + * 是否为开发模式。 + */ + var __DEV__: boolean; +} diff --git a/src/index.ts b/src/index.ts index 7930ed0..802e8f5 100644 --- a/src/index.ts +++ b/src/index.ts @@ -46,3 +46,4 @@ export * from "./internal/BufferBindingInfo"; export * from "./types/TypedArray"; export * from "./types/UnReadonly"; +import "./global" \ No newline at end of file -- Gitee From 433a448b6e63360ca49ceda257f6e8cf480ce1b8 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 15 Mar 2025 00:26:13 +0800 Subject: [PATCH 076/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84=20?= =?UTF-8?q?OcclusionQuery=20=E5=92=8C=20RenderPass=20=E6=8E=A5=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 OcclusionQuery 接口中添加了中文注释和 onQuery 回调方法 - 移除了 RenderPass 接口中的 occlusionQueryResults 属性 --- src/data/OcclusionQuery.ts | 14 +++++++------- src/data/RenderPass.ts | 7 ------- 2 files changed, 7 insertions(+), 14 deletions(-) diff --git a/src/data/OcclusionQuery.ts b/src/data/OcclusionQuery.ts index 2d9836e..4c8eac9 100644 --- a/src/data/OcclusionQuery.ts +++ b/src/data/OcclusionQuery.ts @@ -1,5 +1,8 @@ import { RenderObject } from "./RenderObject"; +/** + * 遮挡查询 + */ export interface OcclusionQuery { /** @@ -13,12 +16,9 @@ export interface OcclusionQuery renderObjects: RenderObject[]; /** - * 渲染完成后由引擎自动填充。 + * 查询结束回调。 + * + * @param result 是否被渲染。true表示被渲染，false表示未被渲染。 */ - result?: { - /** - * 查询结果。 - */ - result: number; - }; + onQuery?(result: boolean): void; } \ No newline at end of file diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index d34a58f..f3635da 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -23,13 +23,6 @@ export interface RenderPass * 渲染对象列表 */ readonly renderObjects?: readonly RenderPassObject[]; - - /** - * 渲染不被遮挡查询结果。具体数据保存在各子项的"result"属性中。 - * - * 当提交WebGL后自动获取结果后填充该属性。 - */ - occlusionQueryResults?: OcclusionQuery[]; } export type RenderPassObject = RenderPassObjectMap[keyof RenderPassObjectMap]; -- Gitee From fc8c0c601b6275a932a38039c91d0d542bb658ec Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 15 Mar 2025 00:42:44 +0800 Subject: [PATCH 077/105] =?UTF-8?q?feat(data):=20=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E9=81=AE=E6=8C=A1=E6=9F=A5=E8=AF=A2=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 OcclusionQuery 接口中的 onQuery 方法的参数类型从 boolean 改为 number - 在 RenderPass 接口中添加 onOcclusionQuery 方法，用于处理遮挡查询结果 --- src/data/OcclusionQuery.ts | 2 +- src/data/RenderPass.ts | 8 ++++++++ 2 files changed, 9 insertions(+), 1 deletion(-) diff --git a/src/data/OcclusionQuery.ts b/src/data/OcclusionQuery.ts index 4c8eac9..a8f960d 100644 --- a/src/data/OcclusionQuery.ts +++ b/src/data/OcclusionQuery.ts @@ -20,5 +20,5 @@ export interface OcclusionQuery * * @param result 是否被渲染。true表示被渲染，false表示未被渲染。 */ - onQuery?(result: boolean): void; + onQuery?(result: number): void; } \ No newline at end of file diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index f3635da..10826ab 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -23,6 +23,14 @@ export interface RenderPass * 渲染对象列表 */ readonly renderObjects?: readonly RenderPassObject[]; + + /** + * 当渲染通道中存在遮挡查询时，在查询结束后调用该函数返回查询结果。 + * + * @param occlusionQuerys 遮挡查询列表 + * @param results 是否被渲染。true表示被渲染，false表示未被渲染。 + */ + onOcclusionQuery?(occlusionQuerys: OcclusionQuery[], results: number[]): void; } export type RenderPassObject = RenderPassObjectMap[keyof RenderPassObjectMap]; -- Gitee From 165d051acbd04655d73d6b9d43d0c4900124af46 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 15 Mar 2025 20:45:12 +0800 Subject: [PATCH 078/105] =?UTF-8?q?refactor(data):=20=E6=9B=B4=E6=96=B0=20?= =?UTF-8?q?CommandEncoder=20=E6=8E=A5=E5=8F=A3=E5=8F=8A=E7=9B=B8=E5=85=B3?= =?UTF-8?q?=E7=B1=BB=E5=9E=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 IPassEncoder 重命名为 PassEncoder - 更新 CommandEncoder 接口中的 passEncoders 类型 - 修改 PassEncoderMap 中的键值类型 --- src/data/CommandEncoder.ts | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/data/CommandEncoder.ts b/src/data/CommandEncoder.ts index ea29b80..b311f3e 100644 --- a/src/data/CommandEncoder.ts +++ b/src/data/CommandEncoder.ts @@ -14,7 +14,7 @@ export interface CommandEncoder * * 包括计算通道编码器、渲染通道编码器 以及 GPU中缓存与纹理之间拷贝。 */ - passEncoders: IPassEncoder[] + passEncoders: PassEncoder[] } /** @@ -22,7 +22,7 @@ export interface CommandEncoder * * 如需扩展 IPassEncoder ，请在 PassEncoderMap 中进行添加。 */ -export type IPassEncoder = PassEncoderMap[keyof PassEncoderMap]; +export type PassEncoder = PassEncoderMap[keyof PassEncoderMap]; /** * 如需扩展 IPassEncoder ，请在 PassEncoderMap 中进行添加。 @@ -32,13 +32,13 @@ export interface PassEncoderMap /** * 渲染通道。 */ - IRenderPass: RenderPass; + RenderPass: RenderPass; /** * 纹理之间拷贝。 */ - ICopyTextureToTexture: CopyTextureToTexture; + CopyTextureToTexture: CopyTextureToTexture; - ICopyBufferToBuffer: CopyBufferToBuffer; + CopyBufferToBuffer: CopyBufferToBuffer; } -- Gitee From a75cd0a0b2340bc0b112bf88cf6af987f87c1559 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 16 Mar 2025 13:23:50 +0800 Subject: [PATCH 079/105] =?UTF-8?q?refactor(data):=20=E6=89=A9=E5=B1=95=20?= =?UTF-8?q?CanvasContext=20=E6=8E=A5=E5=8F=A3=E5=AE=9A=E4=B9=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 更新 CanvasContext 接口中的 canvasId 属性类型 - 允许 canvasId 是字符串、HTMLCanvasElement 或 OffscreenCanvas 类型 - 添加属性注释以解释其可能的用途 --- src/data/CanvasContext.ts | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/data/CanvasContext.ts b/src/data/CanvasContext.ts index 3f9a20c..5722931 100644 --- a/src/data/CanvasContext.ts +++ b/src/data/CanvasContext.ts @@ -4,7 +4,9 @@ export interface CanvasContext { /** - * 画布id + * 画布。 + * + * 可能是画布的编号，也可能是画布元素或者离屏画布。 */ - readonly canvasId: string; + readonly canvasId: string | HTMLCanvasElement | OffscreenCanvas; } -- Gitee From b2794a34229b33a1f769b961feb7eb817d719f10 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 16 Mar 2025 17:26:15 +0800 Subject: [PATCH 080/105] =?UTF-8?q?feat(export):=20=E6=B7=BB=E5=8A=A0=20Ch?= =?UTF-8?q?ainMap=20=E5=AE=9E=E7=94=A8=E5=B7=A5=E5=85=B7=E7=9A=84=E5=AF=BC?= =?UTF-8?q?=E5=87=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 在 src/index.ts 文件中添加了对 ChainMap 工具的导出，使得外部可以更方便地使用 ChainMap 功能。 --- src/index.ts | 2 ++ src/utils/ChainMap.ts | 79 +++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 81 insertions(+) create mode 100644 src/utils/ChainMap.ts diff --git a/src/index.ts b/src/index.ts index 802e8f5..6c183f4 100644 --- a/src/index.ts +++ b/src/index.ts @@ -46,4 +46,6 @@ export * from "./internal/BufferBindingInfo"; export * from "./types/TypedArray"; export * from "./types/UnReadonly"; +export * from "./utils/ChainMap"; + import "./global" \ No newline at end of file diff --git a/src/utils/ChainMap.ts b/src/utils/ChainMap.ts new file mode 100644 index 0000000..067a6f9 --- /dev/null +++ b/src/utils/ChainMap.ts @@ -0,0 +1,79 @@ +/** + * 链式Map。 + * + * 多个key数组对应一个值。 + * + * 由于键值可能是字面值也可能是对象，因此无法使用 {@link WeakMap} 来构建{@link ChainMap}，只能使用 {@link Map}。 + */ +export class ChainMap, V> +{ + private _map: Map | WeakMap; + + /** + * 获取键对应的值。 + * + * @param keys 键。 + * @returns 值。 + */ + get(keys: K): V + { + if (!this._map) return undefined; + let map = this._map; + + for (let i = 0, n = keys.length - 1; i < n; i++) + { + map = map.get(keys[i]); + + if (map === undefined) return undefined; + } + + return map.get(keys[keys.length - 1]); + } + + /** + * 设置映射。 + * + * @param keys 键。 + * @param value 值。 + */ + set(keys: K, value: V) + { + let map = this._map = this._map || ((typeof keys[0] === "string") ? new Map() : new WeakMap()); + + for (let i = 0; i < keys.length - 1; i++) + { + const key = keys[i]; + + if (!map.has(key)) + { + map.set(key, typeof key === "string" ? new Map() : new WeakMap()); + } + + map = map.get(key); + } + + map.set(keys[keys.length - 1], value); + } + + /** + * 删除映射。 + * + * @param keys 键。 + * @returns 如果找到目标值且被删除返回 `true` ，否则返回 `false` 。 + */ + delete(keys: K): boolean + { + if (!this._map) return false; + let map = this._map; + + for (let i = 0; i < keys.length - 1; i++) + { + map = map.get(keys[i]); + + if (map === undefined) return false; + } + + return map.delete(keys[keys.length - 1]); + } +} + -- Gitee From ac772903d3ebe6264b3c0256efe2cc237b333773 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 16 Mar 2025 20:26:08 +0800 Subject: [PATCH 081/105] =?UTF-8?q?refactor(utils):=20=E4=BC=98=E5=8C=96?= =?UTF-8?q?=20ChainMap=20=E5=AE=9E=E7=8E=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 初始化 _map 属性为新的 Map 实例，移除条件判断 - 在 set 方法中简化了 map 实例的创建逻辑，统一使用 Map - 删除了 get 和 delete 方法中对 _map 的空值检查，因为现在 _map 总是会被初始化 --- src/utils/ChainMap.ts | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/src/utils/ChainMap.ts b/src/utils/ChainMap.ts index 067a6f9..798c14e 100644 --- a/src/utils/ChainMap.ts +++ b/src/utils/ChainMap.ts @@ -7,7 +7,7 @@ */ export class ChainMap, V> { - private _map: Map | WeakMap; + private _map = new Map(); /** * 获取键对应的值。 @@ -17,7 +17,6 @@ export class ChainMap, V> */ get(keys: K): V { - if (!this._map) return undefined; let map = this._map; for (let i = 0, n = keys.length - 1; i < n; i++) @@ -38,7 +37,7 @@ export class ChainMap, V> */ set(keys: K, value: V) { - let map = this._map = this._map || ((typeof keys[0] === "string") ? new Map() : new WeakMap()); + let map = this._map; for (let i = 0; i < keys.length - 1; i++) { @@ -46,7 +45,7 @@ export class ChainMap, V> if (!map.has(key)) { - map.set(key, typeof key === "string" ? new Map() : new WeakMap()); + map.set(key, new Map()); } map = map.get(key); @@ -63,7 +62,6 @@ export class ChainMap, V> */ delete(keys: K): boolean { - if (!this._map) return false; let map = this._map; for (let i = 0; i < keys.length - 1; i++) -- Gitee From 719f2ec47cc762703777da3c19b29159d4e8a91a Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 16 Mar 2025 23:43:51 +0800 Subject: [PATCH 082/105] =?UTF-8?q?refactor(data):=20=E5=B0=86=20FragmentS?= =?UTF-8?q?tate=20=E6=8E=A5=E5=8F=A3=E4=B8=AD=E7=9A=84=20code=20=E5=B1=9E?= =?UTF-8?q?=E6=80=A7=E6=A0=87=E8=AE=B0=E4=B8=BA=E5=8F=AA=E8=AF=BB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 FragmentState.ts 文件中，将 code 属性从 string 类型改为 readonly string 类型 - 这个改动确保了 FragmentState 实例的 code 属性在创建后不可修改，提高了代码的健壮性和可维护性 --- src/data/FragmentState.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/data/FragmentState.ts b/src/data/FragmentState.ts index db702d5..e21ada0 100644 --- a/src/data/FragmentState.ts +++ b/src/data/FragmentState.ts @@ -10,7 +10,7 @@ export interface FragmentState /** * 着色器代码。 */ - code: string; + readonly code: string; /** * A list of {@link GPUColorTargetState} defining the formats and behaviors of the color targets -- Gitee From eb9611cba3eab0968128ac6b2d311726c116e2a8 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Mon, 17 Mar 2025 23:01:36 +0800 Subject: [PATCH 083/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E5=91=BD?= =?UTF-8?q?=E5=90=8D=20IWriteMask=20=E4=B8=BA=20WriteMask?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除了 IWriteMask 接口名称中的 "I" 前缀 - 更新了 ColorTargetState 接口中的 writeMask 属性类型引用 --- src/data/ColorTargetState.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/data/ColorTargetState.ts b/src/data/ColorTargetState.ts index 73d964d..52fedb3 100644 --- a/src/data/ColorTargetState.ts +++ b/src/data/ColorTargetState.ts @@ -26,7 +26,7 @@ export interface ColorTargetState * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/colorMask */ - readonly writeMask?: IWriteMask; + readonly writeMask?: WriteMask; } -export type IWriteMask = [red: boolean, green: boolean, blue: boolean, alpha: boolean]; +export type WriteMask = [red: boolean, green: boolean, blue: boolean, alpha: boolean]; -- Gitee From dff052a94c07374c1b3779fc4fe7ae21d4222f1b Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Tue, 18 Mar 2025 12:13:47 +0800 Subject: [PATCH 084/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E6=8E=A5=E5=8F=A3=E5=B9=B6=E7=BB=9F=E4=B8=80?= =?UTF-8?q?=E6=AF=94=E8=BE=83=E5=87=BD=E6=95=B0=E5=92=8C=E6=A8=A1=E6=9D=BF?= =?UTF-8?q?=E6=93=8D=E4=BD=9C=E7=B1=BB=E5=9E=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 ICompareFunction 和 IStencilOperation 重命名为 CompareFunction 和 StencilOperation - 在 DepthStencilState、Geometry、RenderPipeline、Sampler 和 VertexState 中更新相关引用 - 从 StencilFaceState 中导出 CompareFunction 和 StencilOperation - 在 reactivity.ts 中添加 toRaw 函数引用 --- src/data/DepthStencilState.ts | 4 ++-- src/data/Geometry.ts | 7 ------- src/data/RenderPipeline.ts | 13 +++++++++++-- src/data/Sampler.ts | 4 ++-- src/data/StencilFaceState.ts | 12 ++++++------ src/data/VertexState.ts | 2 +- src/reactivity.ts | 7 ++++++- 7 files changed, 28 insertions(+), 21 deletions(-) diff --git a/src/data/DepthStencilState.ts b/src/data/DepthStencilState.ts index 9fff8ab..7d1fe47 100644 --- a/src/data/DepthStencilState.ts +++ b/src/data/DepthStencilState.ts @@ -1,4 +1,4 @@ -import { ICompareFunction, StencilFaceState } from "./StencilFaceState"; +import { CompareFunction as CompareFunction, StencilFaceState } from "./StencilFaceState"; /** * 深度模板阶段描述。 @@ -27,7 +27,7 @@ export interface DepthStencilState * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/depthFunc */ - readonly depthCompare?: ICompareFunction; + readonly depthCompare?: CompareFunction; /** * 定义了如何为朝前的图元执行模板比较和操作。 diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index 385166f..2f91a72 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -14,13 +14,6 @@ import { VertexAttribute, VertexAttributes } from "./VertexAttributes"; */ export interface Geometry { - /** - * Describes the primitive-related properties of the pipeline. - * - * 图元拓扑结构。 - */ - primitive?: PrimitiveState; - /** * 顶点属性数据映射。 */ diff --git a/src/data/RenderPipeline.ts b/src/data/RenderPipeline.ts index 601e5cc..948c12d 100644 --- a/src/data/RenderPipeline.ts +++ b/src/data/RenderPipeline.ts @@ -1,5 +1,7 @@ +import { readonly } from "@vue/reactivity"; import { DepthStencilState } from "./DepthStencilState"; import { FragmentState } from "./FragmentState"; +import { PrimitiveState } from "./PrimitiveState"; import { VertexState } from "./VertexState"; /** @@ -19,12 +21,19 @@ export interface RenderPipeline /** * 顶点着色器阶段描述。 */ - vertex: VertexState; + readonly vertex: VertexState; /** * 片段着色器阶段描述。 */ - fragment?: FragmentState; + readonly fragment?: FragmentState; + + /** + * Describes the primitive-related properties of the pipeline. + * + * 图元拓扑结构。 + */ + readonly primitive?: PrimitiveState; /** * 深度模板阶段描述。 diff --git a/src/data/Sampler.ts b/src/data/Sampler.ts index d7ddee1..ed7627f 100644 --- a/src/data/Sampler.ts +++ b/src/data/Sampler.ts @@ -1,4 +1,4 @@ -import { ICompareFunction } from "./StencilFaceState"; +import { CompareFunction } from "./StencilFaceState"; /** * 纹理采样器。 @@ -115,7 +115,7 @@ export interface Sampler * * 注：比较采样器可能会使用过滤，但采样结果将是 依赖于实现并且可能不同于正常的过滤规则。 */ - compare?: ICompareFunction; + compare?: CompareFunction; } /** diff --git a/src/data/StencilFaceState.ts b/src/data/StencilFaceState.ts index e82cc0e..94cde7d 100644 --- a/src/data/StencilFaceState.ts +++ b/src/data/StencilFaceState.ts @@ -10,30 +10,30 @@ export interface StencilFaceState * * 默认为 "always"。 */ - readonly compare?: ICompareFunction; + readonly compare?: CompareFunction; /** * 如果片元模板比较测试（由 compare 描述）失败，则执行的 GPUStencilOperation。 * * 默认为 "keep"。 */ - readonly failOp?: IStencilOperation; + readonly failOp?: StencilOperation; /** * 如果由 depthCompare 描述的片元深度比较失败，则执行的 GPUStencilOperation。 * * 默认为 "keep"。 */ - readonly depthFailOp?: IStencilOperation; + readonly depthFailOp?: StencilOperation; /** * 如果片元模板比较测试通过，则执行由compare描述的GPUStencilOperation。 * * 默认为 "keep"。 */ - readonly passOp?: IStencilOperation; + readonly passOp?: StencilOperation; } -export type ICompareFunction = "never" | "less" | "equal" | "less-equal" | "greater" | "not-equal" | "greater-equal" | "always"; +export type CompareFunction = "never" | "less" | "equal" | "less-equal" | "greater" | "not-equal" | "greater-equal" | "always"; -export type IStencilOperation = "keep" | "zero" | "replace" | "invert" | "increment-clamp" | "decrement-clamp" | "increment-wrap" | "decrement-wrap"; \ No newline at end of file +export type StencilOperation = "keep" | "zero" | "replace" | "invert" | "increment-clamp" | "decrement-clamp" | "increment-wrap" | "decrement-wrap"; \ No newline at end of file diff --git a/src/data/VertexState.ts b/src/data/VertexState.ts index 033479e..ec5a64c 100644 --- a/src/data/VertexState.ts +++ b/src/data/VertexState.ts @@ -6,5 +6,5 @@ export interface VertexState /** * 着色器代码。 */ - code: string; + readonly code: string; } \ No newline at end of file diff --git a/src/reactivity.ts b/src/reactivity.ts index a6b45bc..77016ed 100644 --- a/src/reactivity.ts +++ b/src/reactivity.ts @@ -1,5 +1,5 @@ import { UnReadonly } from "@feng3d/render-api"; -import { reactive as vueReactive } from "@vue/reactivity"; +import { toRaw as vueToRaw, reactive as vueReactive } from "@vue/reactivity"; export { computed, type ComputedRef, effect } from "@vue/reactivity"; @@ -10,3 +10,8 @@ export { computed, type ComputedRef, effect } from "@vue/reactivity"; */ export const reactive: (target: T) => UnReadonly = vueReactive as any; +/** + * Vue原始数据。 + * + */ +export const toRaw: (observed: T) => T = vueToRaw as any; -- Gitee From 92a12e81784646c9f1a18c27776713652cca2427 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Tue, 18 Mar 2025 16:29:47 +0800 Subject: [PATCH 085/105] =?UTF-8?q?refactor(data):=20=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E5=92=8C=E7=B1=BB=E5=9E=8B=E5=AE=9A=E4=B9=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 ColorTargetState 和 PrimitiveState 接口中添加 readonly 修饰符，提高代码的不可变性和安全性 - 在 WriteMask 类型中添加 readonly 修饰符，确保数组类型的安全使用 - 移除未使用的 import 语句，清理无用代码 - 在 VertexState 接口中移除 readonly 修饰符，允许 code 属性的修改 --- src/data/ColorTargetState.ts | 4 ++-- src/data/PrimitiveState.ts | 6 +++--- src/data/RenderPipeline.ts | 1 - src/data/VertexState.ts | 2 +- 4 files changed, 6 insertions(+), 7 deletions(-) diff --git a/src/data/ColorTargetState.ts b/src/data/ColorTargetState.ts index 52fedb3..e421f6e 100644 --- a/src/data/ColorTargetState.ts +++ b/src/data/ColorTargetState.ts @@ -15,7 +15,7 @@ export interface ColorTargetState * * 默认 `undefined`，表示不进行混合。 */ - blend?: BlendState; + readonly blend?: BlendState; /** * 控制那些颜色分量是否可以被写入到颜色中。 @@ -29,4 +29,4 @@ export interface ColorTargetState readonly writeMask?: WriteMask; } -export type WriteMask = [red: boolean, green: boolean, blue: boolean, alpha: boolean]; +export type WriteMask = readonly [red: boolean, green: boolean, blue: boolean, alpha: boolean]; diff --git a/src/data/PrimitiveState.ts b/src/data/PrimitiveState.ts index e4a03e0..b2f77d8 100644 --- a/src/data/PrimitiveState.ts +++ b/src/data/PrimitiveState.ts @@ -24,7 +24,7 @@ export interface PrimitiveState * * LINE_LOOP 绘制循环连线。 * * TRIANGLE_FAN 绘制三角扇形。 */ - topology?: PrimitiveTopology; + readonly topology?: PrimitiveTopology; /** * Defines which polygon orientation will be culled, if any. @@ -37,14 +37,14 @@ export interface PrimitiveState * * `front` 剔除正面 * * `back` 剔除背面 */ - cullFace?: CullFace; + readonly cullFace?: CullFace; /** * Defines which polygons are considered front-facing. * * 正向方向。默认 "ccw"，表示三角形逆时针方向为正面。 */ - frontFace?: FrontFace; + readonly frontFace?: FrontFace; } /** diff --git a/src/data/RenderPipeline.ts b/src/data/RenderPipeline.ts index 948c12d..f68d53b 100644 --- a/src/data/RenderPipeline.ts +++ b/src/data/RenderPipeline.ts @@ -1,4 +1,3 @@ -import { readonly } from "@vue/reactivity"; import { DepthStencilState } from "./DepthStencilState"; import { FragmentState } from "./FragmentState"; import { PrimitiveState } from "./PrimitiveState"; diff --git a/src/data/VertexState.ts b/src/data/VertexState.ts index ec5a64c..033479e 100644 --- a/src/data/VertexState.ts +++ b/src/data/VertexState.ts @@ -6,5 +6,5 @@ export interface VertexState /** * 着色器代码。 */ - readonly code: string; + code: string; } \ No newline at end of file -- Gitee From 36cef6cac464bc9f4b66dfc66385a43a9da891f7 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 19 Mar 2025 10:17:56 +0800 Subject: [PATCH 086/105] =?UTF-8?q?refactor(data):=20=E4=BD=BF=20VertexSta?= =?UTF-8?q?te=20=E6=8E=A5=E5=8F=A3=E4=B8=AD=E7=9A=84=20code=20=E5=B1=9E?= =?UTF-8?q?=E6=80=A7=E4=B8=BA=E5=8F=AA=E8=AF=BB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/data/VertexState.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/data/VertexState.ts b/src/data/VertexState.ts index 033479e..ec5a64c 100644 --- a/src/data/VertexState.ts +++ b/src/data/VertexState.ts @@ -6,5 +6,5 @@ export interface VertexState /** * 着色器代码。 */ - code: string; + readonly code: string; } \ No newline at end of file -- Gitee From 3eeb5e24145e9abe094ebff96ab204a34ad04835 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 19 Mar 2025 12:20:42 +0800 Subject: [PATCH 087/105] =?UTF-8?q?feat(ChainMap):=20=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E9=94=AE=E9=95=BF=E5=BA=A6=E5=A4=84=E7=90=86=E5=B9=B6=E6=B7=BB?= =?UTF-8?q?=E5=8A=A0=E6=96=AD=E8=A8=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 添加 _keyLength 属性以存储键长度 - 在 set 和 delete 方法中添加对键长度的断言 - 优化 get、set 和 delete 方法中的循环逻辑 - 提高代码可读性和性能 --- src/utils/ChainMap.ts | 48 ++++++++++++++++++++++++++++++++++--------- 1 file changed, 38 insertions(+), 10 deletions(-) diff --git a/src/utils/ChainMap.ts b/src/utils/ChainMap.ts index 798c14e..6cc6e56 100644 --- a/src/utils/ChainMap.ts +++ b/src/utils/ChainMap.ts @@ -7,7 +7,14 @@ */ export class ChainMap, V> { + /** + * 根字典。 + */ private _map = new Map(); + /** + * 键长度。 + */ + private _keyLength: number; /** * 获取键对应的值。 @@ -17,16 +24,22 @@ export class ChainMap, V> */ get(keys: K): V { + __DEV__ && console.assert(keys.length === this._keyLength, `键长度必须为${this._keyLength}。`); + + const keysLength = keys.length; let map = this._map; + let key: any; - for (let i = 0, n = keys.length - 1; i < n; i++) + for (let i = 0, n = keysLength - 1; i < n; i++) { - map = map.get(keys[i]); + key = keys[i]; + map = map.get(key); if (map === undefined) return undefined; } - return map.get(keys[keys.length - 1]); + key = keys[keysLength - 1]; + return map.get(key); } /** @@ -34,14 +47,21 @@ export class ChainMap, V> * * @param keys 键。 * @param value 值。 + * + * @returns 返回设置的值。 */ set(keys: K, value: V) { + this._keyLength ??= keys.length; + __DEV__ && console.assert(keys.length === this._keyLength, `键长度必须为${this._keyLength}。`); + + const keysLength = keys.length; let map = this._map; + let key: any; - for (let i = 0; i < keys.length - 1; i++) + for (let i = 0; i < keysLength - 1; i++) { - const key = keys[i]; + key = keys[i]; if (!map.has(key)) { @@ -51,7 +71,10 @@ export class ChainMap, V> map = map.get(key); } - map.set(keys[keys.length - 1], value); + key = keys[keysLength - 1]; + map.set(key, value); + + return value; } /** @@ -62,16 +85,21 @@ export class ChainMap, V> */ delete(keys: K): boolean { + __DEV__ && console.assert(keys.length === this._keyLength, `键长度必须为${this._keyLength}。`); + + const keysLength = keys.length; let map = this._map; + let key: any; - for (let i = 0; i < keys.length - 1; i++) + for (let i = 0; i < keysLength - 1; i++) { - map = map.get(keys[i]); + key = keys[i]; + map = map.get(key); if (map === undefined) return false; } - return map.delete(keys[keys.length - 1]); + key = keys[keysLength - 1]; + return map.delete(key); } } - -- Gitee From 4edb5c88bf0d9db4a58e6f993ec48a7d5f308d39 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 19 Mar 2025 15:47:07 +0800 Subject: [PATCH 088/105] =?UTF-8?q?fix(utils):=20=E4=BF=AE=E5=A4=8D=20Chai?= =?UTF-8?q?nMap=20=E5=9C=A8=E6=9C=AA=E8=AE=BE=E7=BD=AE=E9=94=AE=E9=95=BF?= =?UTF-8?q?=E5=BA=A6=E6=97=B6=E7=9A=84=E5=BC=82=E5=B8=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 get 和 delete 方法中添加了对 _keyLength 为 0 的判断 - 避免在未设置键长度时执行后续操作，提高代码的健壮性 --- src/utils/ChainMap.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/utils/ChainMap.ts b/src/utils/ChainMap.ts index 6cc6e56..7915ba8 100644 --- a/src/utils/ChainMap.ts +++ b/src/utils/ChainMap.ts @@ -24,6 +24,7 @@ export class ChainMap, V> */ get(keys: K): V { + if (!this._keyLength) return undefined; __DEV__ && console.assert(keys.length === this._keyLength, `键长度必须为${this._keyLength}。`); const keysLength = keys.length; @@ -85,6 +86,7 @@ export class ChainMap, V> */ delete(keys: K): boolean { + if (!this._keyLength) return false; __DEV__ && console.assert(keys.length === this._keyLength, `键长度必须为${this._keyLength}。`); const keysLength = keys.length; -- Gitee From b6497393b91ee6d225621bc70c22f3cf533ee724 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 19 Mar 2025 16:07:15 +0800 Subject: [PATCH 089/105] =?UTF-8?q?refactor(utils):=20=E7=A7=BB=E9=99=A4?= =?UTF-8?q?=20ChainMap=20=E4=B8=AD=E7=9A=84=E9=94=AE=E9=95=BF=E5=BA=A6?= =?UTF-8?q?=E9=99=90=E5=88=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 移除了 ChainMap 类中用于限制键长度的代码，包括： - 删除了 _keyLength 属性 - 移除了 get、set 和 delete 方法中关于键长度的检查和断言 这些更改简化了代码结构，并消除了不必要的限制。 --- src/utils/ChainMap.ts | 13 ------------- 1 file changed, 13 deletions(-) diff --git a/src/utils/ChainMap.ts b/src/utils/ChainMap.ts index 7915ba8..99e9ad5 100644 --- a/src/utils/ChainMap.ts +++ b/src/utils/ChainMap.ts @@ -11,10 +11,6 @@ export class ChainMap, V> * 根字典。 */ private _map = new Map(); - /** - * 键长度。 - */ - private _keyLength: number; /** * 获取键对应的值。 @@ -24,9 +20,6 @@ export class ChainMap, V> */ get(keys: K): V { - if (!this._keyLength) return undefined; - __DEV__ && console.assert(keys.length === this._keyLength, `键长度必须为${this._keyLength}。`); - const keysLength = keys.length; let map = this._map; let key: any; @@ -53,9 +46,6 @@ export class ChainMap, V> */ set(keys: K, value: V) { - this._keyLength ??= keys.length; - __DEV__ && console.assert(keys.length === this._keyLength, `键长度必须为${this._keyLength}。`); - const keysLength = keys.length; let map = this._map; let key: any; @@ -86,9 +76,6 @@ export class ChainMap, V> */ delete(keys: K): boolean { - if (!this._keyLength) return false; - __DEV__ && console.assert(keys.length === this._keyLength, `键长度必须为${this._keyLength}。`); - const keysLength = keys.length; let map = this._map; let key: any; -- Gitee From 8e2041f35374c70d566f329738d90c1ee54dc609 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Mar 2025 00:27:09 +0800 Subject: [PATCH 090/105] =?UTF-8?q?refactor(data):=20=E4=B8=BA=20Texture?= =?UTF-8?q?=20=E6=8E=A5=E5=8F=A3=E7=9A=84=E5=B1=9E=E6=80=A7=E6=B7=BB?= =?UTF-8?q?=E5=8A=A0=20readonly=20=E4=BF=AE=E9=A5=B0=E7=AC=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 Texture 接口中，将 size、sources 和 writeTextures 属性标记为 readonly - 这样做可以更好地表达这些属性的不可变性，提高代码的可读性和安全性 - 在文件顶部添加了对 @vue/reactivity 的 readonly 函数的导入 --- src/data/Texture.ts | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/data/Texture.ts b/src/data/Texture.ts index 6cbb607..48e9a9b 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -1,3 +1,4 @@ +import { readonly } from "@vue/reactivity"; import { TextureDataSource } from "./TextureDataSource"; import { TextureImageSource } from "./TextureImageSource"; @@ -38,7 +39,7 @@ export interface Texture * * 修改尺寸将会引发纹理销毁，使用时重新创建新纹理。 */ - size: TextureSize; + readonly size: TextureSize; /** * 初始化纹理资源。 @@ -51,7 +52,7 @@ export interface Texture * @see GPUQueue.copyExternalImageToTexture * @see GPUQueue.writeTexture */ - sources?: readonly TextureSource[]; + readonly sources?: readonly TextureSource[]; /** * 初始化纹理后是否生成mipmap @@ -69,7 +70,7 @@ export interface Texture * @see GPUQueue.copyExternalImageToTexture * @see GPUQueue.writeTexture */ - writeTextures?: readonly TextureSource[]; + readonly writeTextures?: readonly TextureSource[]; /** * 纹理维度，默认为 "2d" 。 -- Gitee From c7977e9ea7cb833bdbfaaf4f41d096eebedd8a61 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Mar 2025 11:38:16 +0800 Subject: [PATCH 091/105] =?UTF-8?q?refactor(data):=20=E4=B8=BA=20Sampler?= =?UTF-8?q?=20=E6=8E=A5=E5=8F=A3=E7=9A=84=E5=B1=9E=E6=80=A7=E6=B7=BB?= =?UTF-8?q?=E5=8A=A0=20readonly=20=E4=BF=AE=E9=A5=B0=E7=AC=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 Sampler.ts 文件中，为 Sampler 接口的所有属性添加了 readonly 修饰符 - 这个改动使得这些属性在创建后不可更改，提高了代码的健壮性和可维护性 - 受影响的属性包括 addressModeU、addressModeV、addressModeW、magFilter、minFilter、mipmapFilter、maxAnisotropy、lodMinClamp、lodMaxClamp 和 compare --- src/data/Sampler.ts | 23 +++++++++++++---------- 1 file changed, 13 insertions(+), 10 deletions(-) diff --git a/src/data/Sampler.ts b/src/data/Sampler.ts index ed7627f..aa84604 100644 --- a/src/data/Sampler.ts +++ b/src/data/Sampler.ts @@ -1,3 +1,4 @@ +import { readonly } from "@vue/reactivity"; import { CompareFunction } from "./StencilFaceState"; /** @@ -27,7 +28,7 @@ export interface Sampler * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_wrap_s * @see https://gpuweb.github.io/gpuweb/#dom-gpusamplerdescriptor-addressmodeu */ - addressModeU?: IAddressMode; + readonly addressModeU?: IAddressMode; /** * 用于指定纹理在垂直方向（即T或V坐标轴）上的寻址模式。 @@ -37,7 +38,7 @@ export interface Sampler * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_wrap_t * @see https://gpuweb.github.io/gpuweb/#dom-gpusamplerdescriptor-addressmodev */ - addressModeV?: IAddressMode; + readonly addressModeV?: IAddressMode; /** * 用于指定纹理在深度方向（即R或W坐标轴）上的寻址模式。用于3D纹理或者纹理数组。 @@ -47,7 +48,7 @@ export interface Sampler * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_wrap_r * @see https://gpuweb.github.io/gpuweb/#dom-gpusamplerdescriptor-addressmodew */ - addressModeW?: IAddressMode; + readonly addressModeW?: IAddressMode; /** * 指定样本足迹小于或等于一个纹素时的采样行为 @@ -57,7 +58,7 @@ export interface Sampler * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-magfilter * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_mag_filter */ - magFilter?: IFilterMode; + readonly magFilter?: IFilterMode; /** * 指定样本足迹大于一个纹素时的采样行为。 @@ -69,7 +70,7 @@ export interface Sampler * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-minfilter * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_min_filter */ - minFilter?: IFilterMode; + readonly minFilter?: IFilterMode; /** * 指定在 mipmap 级别之间进行采样的行为。 @@ -79,12 +80,14 @@ export interface Sampler * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-mipmapfilter * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/samplerParameter#gl.texture_min_filter */ - mipmapFilter?: IMipmapFilterMode; + readonly mipmapFilter?: IMipmapFilterMode; /** * 指定采样器使用的最大各向异性值夹具。 * 各向异性过滤。使用各向异性过滤能够使纹理的效果更好，但是会消耗更多的内存、CPU、GPU时间。默认为1。 * + * 仅当 minFilter 、magFilter 或 mipmapFilter 为 "linear" 时才有效，否则取 1。 + * * 默认 1。 * * 注：大多数实现支持范围在1到16之间（包括1和16）的maxAnisotropy值。所使用的maxAnisotropy值将被限制在平台支持的最大值内 @@ -92,21 +95,21 @@ export interface Sampler * @see https://www.orillusion.com/zh/webgpu.html#dom-gpusamplerdescriptor-maxanisotropy * @see https://developer.mozilla.org/en-US/docs/Web/API/EXT_texture_filter_anisotropic */ - maxAnisotropy?: number; + readonly maxAnisotropy?: number; /** * 采样时使用的最小Lod等级。 * * 默认 0。 */ - lodMinClamp?: number; + readonly lodMinClamp?: number; /** * 采样时使用的最大Lod等级。 * * 默认 16 。 */ - lodMaxClamp?: number; + readonly lodMaxClamp?: number; /** * 涉及纹理比较操作时需提供，采样器将是具有指定 GPUCompareFunction 的比较采样器。 @@ -115,7 +118,7 @@ export interface Sampler * * 注：比较采样器可能会使用过滤，但采样结果将是 依赖于实现并且可能不同于正常的过滤规则。 */ - compare?: CompareFunction; + readonly compare?: CompareFunction; } /** -- Gitee From b5b25988aaf58867ec8170e9ba50f9c25dbd8e40 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Mar 2025 14:25:24 +0800 Subject: [PATCH 092/105] =?UTF-8?q?refactor(data):=20=E6=9B=B4=E6=96=B0=20?= =?UTF-8?q?BindingResources=20=E6=8E=A5=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 IBufferBinding 和 IBufferBindingItem 接口名称修改为 PascalCase 命名规范 - 重命名为 BufferBinding 和 BufferBindingItem，去掉前导的 "I" --- src/data/BindingResources.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/data/BindingResources.ts b/src/data/BindingResources.ts index 2253ce6..3e76a8b 100644 --- a/src/data/BindingResources.ts +++ b/src/data/BindingResources.ts @@ -20,6 +20,6 @@ export interface BindingResourceTypeMap /** * 缓冲区绑定。 */ - IBufferBinding: BufferBinding; - IBufferBindingItem: BufferBindingItem; + BufferBinding: BufferBinding; + BufferBindingItem: BufferBindingItem; } -- Gitee From c6c43cabde8b9ab179eeeaca1f57c2fd59b1ff99 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Mar 2025 15:16:19 +0800 Subject: [PATCH 093/105] =?UTF-8?q?refactor(data):=20=E6=B7=BB=E5=8A=A0=20?= =?UTF-8?q?readonly=20=E4=BF=AE=E9=A5=B0=E7=AC=A6=E4=BB=A5=E6=8F=90?= =?UTF-8?q?=E9=AB=98=E4=BB=A3=E7=A0=81=E5=AE=89=E5=85=A8=E6=80=A7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 BindingResources 接口中为键值对添加 readonly 修饰符 - 在 BufferBinding 接口中为键值对添加 readonly 修饰符 - 更新 UniformDataItem 类型定义，添加 readonly 修饰符 - 更新 BufferBindingItem 类型定义，添加 readonly 修饰符 --- src/data/BindingResources.ts | 2 +- src/data/BufferBinding.ts | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/data/BindingResources.ts b/src/data/BindingResources.ts index 3e76a8b..5a41490 100644 --- a/src/data/BindingResources.ts +++ b/src/data/BindingResources.ts @@ -7,7 +7,7 @@ import { BufferBinding, BufferBindingItem } from "./BufferBinding"; */ export interface BindingResources { - [key: string]: BindingResource; + readonly [key: string]: BindingResource; } /** diff --git a/src/data/BufferBinding.ts b/src/data/BufferBinding.ts index e1063e1..5c37ab7 100644 --- a/src/data/BufferBinding.ts +++ b/src/data/BufferBinding.ts @@ -10,7 +10,7 @@ import { TypedArray } from "../types/TypedArray"; */ export interface BufferBinding { - [name: string]: BufferBindingItem; + readonly [name: string]: BufferBindingItem; /** * 如果未设置引擎将自动生成。 @@ -18,8 +18,8 @@ export interface BufferBinding readonly bufferView?: TypedArray; } -export type UniformDataItem = number | number[] | number[][] | TypedArray | TypedArray[] - | { toArray(): number[] | Float32Array } - | { toArray(): number[] | Float32Array }[] +export type UniformDataItem = number | readonly number[] | readonly number[][] | TypedArray | readonly TypedArray[] + | { toArray(): number[] | TypedArray } + | readonly { toArray(): number[] | TypedArray }[] ; -export type BufferBindingItem = UniformDataItem | { [key: string]: BufferBindingItem }; +export type BufferBindingItem = UniformDataItem | { readonly [key: string]: BufferBindingItem }; -- Gitee From a03ac8f3cb6dbc6058d9f732ba7f8e236bf265a5 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Mar 2025 18:52:26 +0800 Subject: [PATCH 094/105] =?UTF-8?q?refactor(data):=20=E4=BF=AE=E6=94=B9=20?= =?UTF-8?q?Geometry=20=E7=B1=BB=E4=B8=AD=E9=A1=B6=E7=82=B9=E7=B4=A2?= =?UTF-8?q?=E5=BC=95=E6=95=B0=E6=8D=AE=E7=B1=BB=E5=9E=8B=E7=9A=84=E5=90=8D?= =?UTF-8?q?=E7=A7=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将接口 Geometry 中的 indices 属性类型从 IIndicesDataTypes 改为 IndicesDataTypes - 将类型定义 IIndicesDataTypes 改为 IndicesDataTypes，去掉前缀 I --- src/data/Geometry.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts index 2f91a72..92ab75d 100644 --- a/src/data/Geometry.ts +++ b/src/data/Geometry.ts @@ -22,7 +22,7 @@ export interface Geometry /** * 顶点索引数据。 */ - indices?: IIndicesDataTypes; + indices?: IndicesDataTypes; /** * 绘制。 @@ -102,7 +102,7 @@ export class Geometry /** * 顶点索引数据类型。 */ -export type IIndicesDataTypes = Uint16Array | Uint32Array; +export type IndicesDataTypes = Uint16Array | Uint32Array; /** * 绘制图形。 -- Gitee From a4dc0ef395e29631c5a712865031de2a99268e40 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Mar 2025 19:05:55 +0800 Subject: [PATCH 095/105] =?UTF-8?q?refactor(data):=20=E7=A7=BB=E9=99=A4=20?= =?UTF-8?q?Geometry=20=E7=B1=BB=E5=B9=B6=E6=95=B4=E5=90=88=E5=85=B6?= =?UTF-8?q?=E5=8A=9F=E8=83=BD=E5=88=B0=20RenderObject?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 删除了 Geometry.ts 文件 - 将 Geometry 类的 getNumVertex、getInstanceCount 和 getDraw 方法移到 RenderObject 类 - 更新了 RenderObject 接口，添加了 vertices、indices 和 draw 属性 - 移除了 index.ts 中对 Geometry 的引用 --- src/data/Geometry.ts | 110 --------------------------------------- src/data/RenderObject.ts | 100 +++++++++++++++++++++++++++++++++-- src/index.ts | 1 - 3 files changed, 96 insertions(+), 115 deletions(-) delete mode 100644 src/data/Geometry.ts diff --git a/src/data/Geometry.ts b/src/data/Geometry.ts deleted file mode 100644 index 92ab75d..0000000 --- a/src/data/Geometry.ts +++ /dev/null @@ -1,110 +0,0 @@ -import { DrawIndexed } from "./DrawIndexed"; -import { DrawVertex } from "./DrawVertex"; -import { PrimitiveState } from "./PrimitiveState"; -import { VertexAttribute, VertexAttributes } from "./VertexAttributes"; - -/** - * 几何数据。 - * - * 包含以下数据： - * - 顶点属性数据 - * - 顶点索引数据 - * - 如何渲染 - * - 拓扑结构 - */ -export interface Geometry -{ - /** - * 顶点属性数据映射。 - */ - vertices?: VertexAttributes; - - /** - * 顶点索引数据。 - */ - indices?: IndicesDataTypes; - - /** - * 绘制。 - */ - draw?: IDraw; -} - -export class Geometry -{ - - /** - * 获取顶点数量。 - * - * @returns 顶点数量。 - */ - static getNumVertex(geometry: Geometry) - { - const attributes = geometry.vertices; - const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => (v.data && v.stepMode !== "instance")); - - const count = vertexList.length > 0 ? VertexAttribute.getVertexCount(vertexList[0]) : 0; - - // 验证所有顶点属性数据的顶点数量一致。 - if (vertexList.length > 0) - { - console.assert(vertexList.every((v) => count === VertexAttribute.getVertexCount(v))); - } - - return count; - } - - /** - * 获取实例数量。 - * - * @returns 实例数量。 - */ - static getInstanceCount(geometry: Geometry) - { - const attributes = geometry.vertices; - const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => (v.data && v.stepMode === "instance")); - - const count = vertexList.length > 0 ? VertexAttribute.getVertexCount(vertexList[0]) : 1; - - // 验证所有顶点属性数据的顶点数量一致。 - if (vertexList.length > 0) - { - console.assert(vertexList.every((v) => count === VertexAttribute.getVertexCount(v))); - } - - return count; - } - - static getDraw(geometry: Geometry): DrawIndexed | DrawVertex - { - if (geometry['_draw']) return geometry['_draw']; - - const instanceCount = Geometry.getInstanceCount(geometry); - - if (geometry.indices) - { - return { - __type__: "DrawIndexed", - indexCount: geometry.indices.length, - firstIndex: 0, - instanceCount, - }; - } - - return { - __type__: "DrawVertex", - vertexCount: Geometry.getNumVertex(geometry), - instanceCount, - }; - } -} - -/** - * 顶点索引数据类型。 - */ -export type IndicesDataTypes = Uint16Array | Uint32Array; - -/** - * 绘制图形。 - */ -export type IDraw = DrawVertex | DrawIndexed; diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 9c95fc6..028ac12 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,7 +1,9 @@ -import { Geometry } from "./Geometry"; +import { BindingResources } from "./BindingResources"; +import { DrawIndexed } from "./DrawIndexed"; +import { DrawVertex } from "./DrawVertex"; import { RenderPipeline } from "./RenderPipeline"; import { ScissorRect } from "./ScissorRect"; -import { BindingResources } from "./BindingResources"; +import { VertexAttribute, VertexAttributes } from "./VertexAttributes"; import { Viewport } from "./Viewport"; /** @@ -32,9 +34,19 @@ export interface RenderObject pipeline: RenderPipeline; /** - * 渲染几何数据。 + * 顶点属性数据映射。 + */ + vertices?: VertexAttributes; + + /** + * 顶点索引数据。 */ - geometry: Geometry; + indices?: IndicesDataTypes; + + /** + * 绘制。 + */ + draw?: IDraw; /** * 绑定资源。 @@ -45,3 +57,83 @@ export interface RenderObject _version?: number; } + + +export class RenderObject +{ + + /** + * 获取顶点数量。 + * + * @returns 顶点数量。 + */ + static getNumVertex(geometry: RenderObject) + { + const attributes = geometry.vertices; + const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => (v.data && v.stepMode !== "instance")); + + const count = vertexList.length > 0 ? VertexAttribute.getVertexCount(vertexList[0]) : 0; + + // 验证所有顶点属性数据的顶点数量一致。 + if (vertexList.length > 0) + { + console.assert(vertexList.every((v) => count === VertexAttribute.getVertexCount(v))); + } + + return count; + } + + /** + * 获取实例数量。 + * + * @returns 实例数量。 + */ + static getInstanceCount(geometry: RenderObject) + { + const attributes = geometry.vertices; + const vertexList = Object.keys(attributes).map((v) => attributes[v]).filter((v) => (v.data && v.stepMode === "instance")); + + const count = vertexList.length > 0 ? VertexAttribute.getVertexCount(vertexList[0]) : 1; + + // 验证所有顶点属性数据的顶点数量一致。 + if (vertexList.length > 0) + { + console.assert(vertexList.every((v) => count === VertexAttribute.getVertexCount(v))); + } + + return count; + } + + static getDraw(geometry: RenderObject): DrawIndexed | DrawVertex + { + if (geometry['_draw']) return geometry['_draw']; + + const instanceCount = RenderObject.getInstanceCount(geometry); + + if (geometry.indices) + { + return { + __type__: "DrawIndexed", + indexCount: geometry.indices.length, + firstIndex: 0, + instanceCount, + }; + } + + return { + __type__: "DrawVertex", + vertexCount: RenderObject.getNumVertex(geometry), + instanceCount, + }; + } +} + +/** + * 顶点索引数据类型。 + */ +export type IndicesDataTypes = Uint16Array | Uint32Array; + +/** + * 绘制图形。 + */ +export type IDraw = DrawVertex | DrawIndexed; diff --git a/src/index.ts b/src/index.ts index 6c183f4..4d890eb 100644 --- a/src/index.ts +++ b/src/index.ts @@ -15,7 +15,6 @@ export * from "./data/DepthStencilState"; export * from "./data/DrawIndexed"; export * from "./data/DrawVertex"; export * from "./data/FragmentState"; -export * from "./data/Geometry"; export * from "./data/ImageCopyTexture"; export * from "./data/OcclusionQuery"; export * from "./data/PrimitiveState"; -- Gitee From 1a80b35e3ae156b070c7426a9db4dfc31b3e8e7e Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 21 Mar 2025 10:43:21 +0800 Subject: [PATCH 096/105] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84=20?= =?UTF-8?q?Buffer=20=E6=8E=A5=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 GBuffer 接口重命名为 Buffer - 为 CopyBufferToBuffer 接口中的 source 和 destination 属性重命名 - 在 Buffer 接口中添加关于 size 属性的注释说明 - 将 Buffer 接口中的 data 属性标记为 readonly --- src/data/Buffer.ts | 6 ++++-- src/data/CopyBufferToBuffer.ts | 6 +++--- 2 files changed, 7 insertions(+), 5 deletions(-) diff --git a/src/data/Buffer.ts b/src/data/Buffer.ts index f7563f3..f39971b 100644 --- a/src/data/Buffer.ts +++ b/src/data/Buffer.ts @@ -10,7 +10,7 @@ import { WriteBuffer } from "./WriteBuffer"; * * {@link GPUBuffer} */ -export interface GBuffer +export interface Buffer { /** * 标签。 @@ -23,13 +23,15 @@ export interface GBuffer * 缓冲区尺寸，单位为字节。 * * 尺寸必须为4的倍数。 + * + * 注：修改尺寸时，会重新创建缓冲区。 */ readonly size: number; /** * 缓冲区数据。 */ - data?: TypedArray; + readonly data?: TypedArray; /** * 写缓冲区。 diff --git a/src/data/CopyBufferToBuffer.ts b/src/data/CopyBufferToBuffer.ts index 89cd239..264cfde 100644 --- a/src/data/CopyBufferToBuffer.ts +++ b/src/data/CopyBufferToBuffer.ts @@ -1,4 +1,4 @@ -import { GBuffer } from "./Buffer"; +import { Buffer } from "./Buffer"; /** * GPU缓冲区之间拷贝。 @@ -16,7 +16,7 @@ export interface CopyBufferToBuffer /** * 源缓冲区。 */ - source: GBuffer; + source: Buffer; /** * 默认为0。 @@ -26,7 +26,7 @@ export interface CopyBufferToBuffer /** * 目标缓冲区。 */ - destination: GBuffer; + destination: Buffer; /** * 默认为0。 -- Gitee From 07cb9a7b580bada7678ecb25619cb12b8dd7da24 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 21 Mar 2025 13:17:25 +0800 Subject: [PATCH 097/105] =?UTF-8?q?feat(ChainMap):=20=E5=A2=9E=E5=8A=A0?= =?UTF-8?q?=E8=AE=A1=E6=95=B0=E5=8A=9F=E8=83=BD=E5=B9=B6=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在 ChainMap 类中添加 _数量 属性，用于记录键值对数量 - 重命名 _map 为 _根字典，提高代码可读性 - 在 set 方法中增加对新键值对的判断，更新 _数量 - 在 delete 方法中添加对删除成功的处理，更新 _数量 --- src/utils/ChainMap.ts | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/src/utils/ChainMap.ts b/src/utils/ChainMap.ts index 99e9ad5..6622e07 100644 --- a/src/utils/ChainMap.ts +++ b/src/utils/ChainMap.ts @@ -10,7 +10,8 @@ export class ChainMap, V> /** * 根字典。 */ - private _map = new Map(); + private _根字典 = new Map(); + private _数量 = 0; /** * 获取键对应的值。 @@ -21,7 +22,7 @@ export class ChainMap, V> get(keys: K): V { const keysLength = keys.length; - let map = this._map; + let map = this._根字典; let key: any; for (let i = 0, n = keysLength - 1; i < n; i++) @@ -47,7 +48,7 @@ export class ChainMap, V> set(keys: K, value: V) { const keysLength = keys.length; - let map = this._map; + let map = this._根字典; let key: any; for (let i = 0; i < keysLength - 1; i++) @@ -63,7 +64,11 @@ export class ChainMap, V> } key = keys[keysLength - 1]; - map.set(key, value); + if (!map.has(key)) + { + map.set(key, value); + this._数量++; + } return value; } @@ -77,7 +82,7 @@ export class ChainMap, V> delete(keys: K): boolean { const keysLength = keys.length; - let map = this._map; + let map = this._根字典; let key: any; for (let i = 0; i < keysLength - 1; i++) @@ -89,6 +94,9 @@ export class ChainMap, V> } key = keys[keysLength - 1]; - return map.delete(key); + const result = map.delete(key); + if (result) this._数量--; + + return result; } } -- Gitee From 68b7004f622cd8c1af80c79f16b946f3ecc09849 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 21 Mar 2025 13:45:10 +0800 Subject: [PATCH 098/105] =?UTF-8?q?refactor(utils):=20=E4=BC=98=E5=8C=96?= =?UTF-8?q?=20ChainMap=20=E5=AE=9E=E7=8E=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将根字典从 Map 改为 WeakMap，以支持对象作为键 - 新增 wrapKey 函数，用于包装非对象键值 - 通过 keyMap 和 idCounter 实现键值的唯一包装 - 优化 get、set 和 delete 方法，以适应新的实现 --- src/utils/ChainMap.ts | 54 ++++++++++++++++++++++++++++++++----------- 1 file changed, 41 insertions(+), 13 deletions(-) diff --git a/src/utils/ChainMap.ts b/src/utils/ChainMap.ts index 6622e07..2fc6348 100644 --- a/src/utils/ChainMap.ts +++ b/src/utils/ChainMap.ts @@ -1,16 +1,14 @@ /** - * 链式Map。 - * - * 多个key数组对应一个值。 - * - * 由于键值可能是字面值也可能是对象，因此无法使用 {@link WeakMap} 来构建{@link ChainMap}，只能使用 {@link Map}。 + * 链式字典。 + * + * 使用WeakMap构建的，支持多个key数组对应一个值。 */ export class ChainMap, V> { /** * 根字典。 */ - private _根字典 = new Map(); + private _根字典 = new WeakMap(); private _数量 = 0; /** @@ -27,13 +25,13 @@ export class ChainMap, V> for (let i = 0, n = keysLength - 1; i < n; i++) { - key = keys[i]; + key = wrapKey(keys[i]); map = map.get(key); if (map === undefined) return undefined; } - key = keys[keysLength - 1]; + key = wrapKey(keys[keysLength - 1]); return map.get(key); } @@ -53,17 +51,17 @@ export class ChainMap, V> for (let i = 0; i < keysLength - 1; i++) { - key = keys[i]; + key = wrapKey(keys[i]); if (!map.has(key)) { - map.set(key, new Map()); + map.set(key, new WeakMap()); } map = map.get(key); } - key = keys[keysLength - 1]; + key = wrapKey(keys[keysLength - 1]); if (!map.has(key)) { map.set(key, value); @@ -87,16 +85,46 @@ export class ChainMap, V> for (let i = 0; i < keysLength - 1; i++) { - key = keys[i]; + key = wrapKey(keys[i]); map = map.get(key); if (map === undefined) return false; } - key = keys[keysLength - 1]; + key = wrapKey(keys[keysLength - 1]); const result = map.delete(key); if (result) this._数量--; return result; } } + +// 创建一个普通 Map 用于存储原始值和包装对象的映射 +const keyMap = new Map(); +// 用于生成唯一 ID 的计数器 +let idCounter = 0; + +// 包装函数，将非对象值包装成对象 +function wrapKey(key: any) +{ + if (typeof key === 'object' && key !== null) + { + // 如果 key 已经是对象，则直接返回 + return key; + } + if (keyMap.has(key)) + { + // 如果原始值已经有对应的包装对象，直接返回 + return keyMap.get(key); + } + // 为非对象 key 生成一个唯一 ID + const id = idCounter++; + // 创建一个包装对象 + const wrapper = { + __id: id, + __value: key + }; + // 存储原始值和包装对象的映射 + keyMap.set(key, wrapper); + return wrapper; +} \ No newline at end of file -- Gitee From 007df47ed699528007b3c00c49616272de44a650 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 21 Mar 2025 17:14:56 +0800 Subject: [PATCH 099/105] =?UTF-8?q?refactor(data):=20=E4=BC=98=E5=8C=96=20?= =?UTF-8?q?RenderObject=20=E6=8E=A5=E5=8F=A3=E5=AE=9A=E4=B9=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 为 RenderObject 接口中的属性添加 readonly 修饰符，确保其不可变性 - 移除了未使用的 _version 属性 - 通过引入 readonly 依赖项，提高了代码的可维护性和可读性 --- src/data/RenderObject.ts | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 028ac12..829f0cd 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,3 +1,4 @@ +import { readonly } from "@vue/reactivity"; import { BindingResources } from "./BindingResources"; import { DrawIndexed } from "./DrawIndexed"; import { DrawVertex } from "./DrawVertex"; @@ -21,41 +22,39 @@ export interface RenderObject * * 描述渲染在画布的哪个区域，默认整个画布。 */ - viewport?: Viewport; + readonly viewport?: Viewport; /** * 光栅化阶段中使用的剪刀矩形。 */ - scissorRect?: ScissorRect; + readonly scissorRect?: ScissorRect; /** * 渲染管线描述。 */ - pipeline: RenderPipeline; + readonly pipeline: RenderPipeline; /** * 顶点属性数据映射。 */ - vertices?: VertexAttributes; + readonly vertices?: VertexAttributes; /** * 顶点索引数据。 */ - indices?: IndicesDataTypes; + readonly indices?: IndicesDataTypes; /** * 绘制。 */ - draw?: IDraw; + readonly draw?: IDraw; /** * 绑定资源。 * * 与着色器中名称对应的绑定资源（纹理、采样器、统一数据、存储数据等）。 */ - bindingResources?: BindingResources; - - _version?: number; + readonly bindingResources?: BindingResources; } -- Gitee From 91a27d3b175624643ff66e751f7a16f1105308bb Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 21 Mar 2025 17:25:39 +0800 Subject: [PATCH 100/105] =?UTF-8?q?refactor(data):=20=E7=A7=BB=E9=99=A4=20?= =?UTF-8?q?RenderObject=20=E4=B8=AD=E6=9C=AA=E4=BD=BF=E7=94=A8=E7=9A=84?= =?UTF-8?q?=E5=AF=BC=E5=85=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 移除了 RenderObject.ts 文件中未使用的 readonly 导入语句。这个更改是为了清理无用的代码，提高代码的可读性和维护性。 --- src/data/RenderObject.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/data/RenderObject.ts b/src/data/RenderObject.ts index 829f0cd..740155a 100644 --- a/src/data/RenderObject.ts +++ b/src/data/RenderObject.ts @@ -1,4 +1,3 @@ -import { readonly } from "@vue/reactivity"; import { BindingResources } from "./BindingResources"; import { DrawIndexed } from "./DrawIndexed"; import { DrawVertex } from "./DrawVertex"; -- Gitee From c25575fb9c548b63e46b2f14a441984254c4d90f Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Mar 2025 10:27:38 +0800 Subject: [PATCH 101/105] =?UTF-8?q?refactor(data):=20=E4=BF=AE=E6=94=B9=20?= =?UTF-8?q?RenderPass=20=E6=8E=A5=E5=8F=A3=E4=B8=AD=E7=9A=84=E5=B1=9E?= =?UTF-8?q?=E6=80=A7=E5=90=8D=E7=A7=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 renderObjects 属性重命名为 renderPassObjects - 此修改提高了代码的清晰度和一致性 --- src/data/RenderPass.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/data/RenderPass.ts b/src/data/RenderPass.ts index 10826ab..4c27a56 100644 --- a/src/data/RenderPass.ts +++ b/src/data/RenderPass.ts @@ -22,7 +22,7 @@ export interface RenderPass /** * 渲染对象列表 */ - readonly renderObjects?: readonly RenderPassObject[]; + readonly renderPassObjects?: readonly RenderPassObject[]; /** * 当渲染通道中存在遮挡查询时，在查询结束后调用该函数返回查询结果。 -- Gitee From 99ece3a055d6bfd3c7a844f493168e10f38d6b1d Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 29 Mar 2025 00:33:42 +0800 Subject: [PATCH 102/105] =?UTF-8?q?build(dependencies):=20=E6=9B=B4?= =?UTF-8?q?=E6=96=B0=20reactivity=20=E4=BE=9D=E8=B5=96=E8=87=B3=20@feng3d/?= =?UTF-8?q?reactivity@1.0.2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 @vue/reactivity 替换为 @feng3d/reactivity - 更新相关导入语句 - 调整部分 API 使用，如 ComputedRef 改为 Computed --- package.json | 3 ++- src/data/Sampler.ts | 1 - src/data/Texture.ts | 1 - src/reactivity.ts | 8 ++++++-- 4 files changed, 8 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index a426988..1639e5a 100644 --- a/package.json +++ b/package.json @@ -56,6 +56,7 @@ "vitest": "^0.32.2" }, "dependencies": { + "@feng3d/reactivity": "^1.0.2", "@vue/reactivity": "^3.5.13" } -} \ No newline at end of file +} diff --git a/src/data/Sampler.ts b/src/data/Sampler.ts index aa84604..5079cbd 100644 --- a/src/data/Sampler.ts +++ b/src/data/Sampler.ts @@ -1,4 +1,3 @@ -import { readonly } from "@vue/reactivity"; import { CompareFunction } from "./StencilFaceState"; /** diff --git a/src/data/Texture.ts b/src/data/Texture.ts index 48e9a9b..e29efe1 100644 --- a/src/data/Texture.ts +++ b/src/data/Texture.ts @@ -1,4 +1,3 @@ -import { readonly } from "@vue/reactivity"; import { TextureDataSource } from "./TextureDataSource"; import { TextureImageSource } from "./TextureImageSource"; diff --git a/src/reactivity.ts b/src/reactivity.ts index 77016ed..9618d3e 100644 --- a/src/reactivity.ts +++ b/src/reactivity.ts @@ -1,7 +1,11 @@ import { UnReadonly } from "@feng3d/render-api"; -import { toRaw as vueToRaw, reactive as vueReactive } from "@vue/reactivity"; -export { computed, type ComputedRef, effect } from "@vue/reactivity"; +// import { reactive as vueReactive, toRaw as vueToRaw } from "@feng3d/reactivity"; +// export { computed, type Computed, effect } from "@feng3d/reactivity"; + +import { reactive as vueReactive, toRaw as vueToRaw } from "@vue/reactivity"; +export { computed, effect, type ComputedRef as Computed } from "@vue/reactivity"; + /** * Vue响应式。 -- Gitee From 7418a0f46d7c7d64e8c58d7d55c2c52d67c49062 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 29 Mar 2025 04:31:11 +0800 Subject: [PATCH 103/105] =?UTF-8?q?refactor(reactivity):=20=E5=88=87?= =?UTF-8?q?=E6=8D=A2=E5=8F=8D=E5=BA=94=E6=80=A7=E6=A8=A1=E5=9D=97=E7=9A=84?= =?UTF-8?q?=E5=AF=BC=E5=85=A5=E6=BA=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 启用 @feng3d/reactivity 的导入 - 禁用 @vue/reactivity 的导入 - 调整导入语句和导出内容 --- src/reactivity.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/reactivity.ts b/src/reactivity.ts index 9618d3e..7446edc 100644 --- a/src/reactivity.ts +++ b/src/reactivity.ts @@ -1,10 +1,10 @@ import { UnReadonly } from "@feng3d/render-api"; -// import { reactive as vueReactive, toRaw as vueToRaw } from "@feng3d/reactivity"; -// export { computed, type Computed, effect } from "@feng3d/reactivity"; +import { reactive as vueReactive, toRaw as vueToRaw } from "@feng3d/reactivity"; +export { computed, type Computed, effect } from "@feng3d/reactivity"; -import { reactive as vueReactive, toRaw as vueToRaw } from "@vue/reactivity"; -export { computed, effect, type ComputedRef as Computed } from "@vue/reactivity"; +// import { reactive as vueReactive, toRaw as vueToRaw } from "@vue/reactivity"; +// export { computed, effect, type ComputedRef as Computed } from "@vue/reactivity"; /** -- Gitee From d8e193e2c7f3d09ad1908f8c21045104748743dd Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 29 Mar 2025 15:34:20 +0800 Subject: [PATCH 104/105] =?UTF-8?q?refactor(data):=20=E5=9C=A8=20CanvasTex?= =?UTF-8?q?ture=20=E6=8E=A5=E5=8F=A3=E4=B8=AD=E6=B7=BB=E5=8A=A0=20=5Fcanva?= =?UTF-8?q?sSizeVersion=20=E5=B1=9E=E6=80=A7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 画布尺寸发生变化后引擎自动递增的版本号 - 引擎内部监听这个值，在画布尺寸发生变化后重新获取纹理 --- src/data/CanvasTexture.ts | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/data/CanvasTexture.ts b/src/data/CanvasTexture.ts index 5ad3990..fc72794 100644 --- a/src/data/CanvasTexture.ts +++ b/src/data/CanvasTexture.ts @@ -9,4 +9,13 @@ export interface CanvasTexture * 画布上下文。 */ context: CanvasContext; + + /** + * 画布尺寸发生变化后引擎自动递增。 + * + * 引擎内部监听这个值，在画布尺寸发生变化后重新获取纹理。 + * + * @private + */ + _canvasSizeVersion?: number; } -- Gitee From 36f08b1463b70b40a4db8f19f82fdae7407d69af Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 2 Apr 2025 10:08:10 +0800 Subject: [PATCH 105/105] build(dependencies): update @feng3d/reactivity and remove @vue/reactivity - Update @feng3d/reactivity from 1.0.2 to 1.0.4 - Remove @vue/reactivity dependency --- package.json | 3 +-- src/reactivity.ts | 4 ---- 2 files changed, 1 insertion(+), 6 deletions(-) diff --git a/package.json b/package.json index 1639e5a..f3cbef9 100644 --- a/package.json +++ b/package.json @@ -56,7 +56,6 @@ "vitest": "^0.32.2" }, "dependencies": { - "@feng3d/reactivity": "^1.0.2", - "@vue/reactivity": "^3.5.13" + "@feng3d/reactivity": "^1.0.4" } } diff --git a/src/reactivity.ts b/src/reactivity.ts index 7446edc..dbfb887 100644 --- a/src/reactivity.ts +++ b/src/reactivity.ts @@ -3,10 +3,6 @@ import { UnReadonly } from "@feng3d/render-api"; import { reactive as vueReactive, toRaw as vueToRaw } from "@feng3d/reactivity"; export { computed, type Computed, effect } from "@feng3d/reactivity"; -// import { reactive as vueReactive, toRaw as vueToRaw } from "@vue/reactivity"; -// export { computed, effect, type ComputedRef as Computed } from "@vue/reactivity"; - - /** * Vue响应式。 * -- Gitee