修复pma 皮肤渲染

js/spine-canvas-clipping.js

@@ -35,8 +35,13 @@ function imageForCanvas(image, context, premultipliedAlpha) {
 	try {
 		const ownerDocument = context.canvas && context.canvas.ownerDocument;
 		const doc = ownerDocument || (typeof document !== 'undefined' ? document : null);
-		if (!doc || !image.width || !image.height) return image;
-		const canvas = doc.createElement('canvas');
+		if (!image.width || !image.height) return image;
+		let canvas;
+		if (doc) canvas = doc.createElement('canvas');
+		else {
+			try { canvas = require('@napi-rs/canvas').createCanvas(image.width, image.height); }
+			catch (e) { return image; }
+		}
 		canvas.width = image.width;
 		canvas.height = image.height;
 		const ctx = canvas.getContext('2d', { willReadFrequently: true });

js/spine-render.js

@@ -152,6 +152,7 @@ async function renderThumbnail({ skeletonPath, atlasPath, texturePaths, version,
 	const isBinary = /\.skel(\.bytes)?$/i.test(skeletonPath);
 	const dir = path.dirname(skeletonPath);
 	const atlasText = fs.readFileSync(atlasPath, 'utf8');
+	const premultipliedAlpha = utils.parseAtlasPma(atlasText) === true;
 
 	const spine = loadRuntime(runtimeDir);
 	const atlas = await buildTextureAtlas(spine, atlasText, dir, texturePaths);
@@ -162,6 +163,7 @@ async function renderThumbnail({ skeletonPath, atlasPath, texturePaths, version,
 		throw new Error('骨骼数据为空：' + name);
 	}
 	const skeleton = new spine.Skeleton(skeletonData);
+	utils.applySkin(skeleton, utils.preferredSkin(skeletonData));
 
 	// 计算所有动画的包围盒，取最合适的姿态用于缩略图。
 	// 默认使用 setup pose（编辑器内的标准站姿），保证缩略图稳定、接近编辑视图。
@@ -191,13 +193,17 @@ async function renderThumbnail({ skeletonPath, atlasPath, texturePaths, version,
 		ctx.translate(-cx, -cy);
 
 		let renderer = null;
-		if (runtimeDir === '3.4' || runtimeDir === '3.5') renderer = require('./spine-canvas-clipping.js').createRenderer(spine, ctx, runtimeDir);
-		else if (spine.canvas && spine.canvas.SkeletonRenderer) renderer = new spine.canvas.SkeletonRenderer(ctx);
-		else if (spine.SkeletonRenderer) renderer = new spine.SkeletonRenderer(ctx);
+		try { renderer = require('./spine-canvas-clipping.js').createRenderer(spine, ctx, runtimeDir); }
+		catch (e) {
+			if (spine.canvas && spine.canvas.SkeletonRenderer) renderer = new spine.canvas.SkeletonRenderer(ctx);
+			else if (spine.SkeletonRenderer) renderer = new spine.SkeletonRenderer(ctx);
+		}
 		if (renderer) {
 			// 使用三角渲染，正确处理 mesh 附件（如角色身体的网格）
 			if ('triangleRendering' in renderer) renderer.triangleRendering = true;
+			renderer.premultipliedAlpha = premultipliedAlpha;
 			renderer.draw(skeleton);
+			if (renderer.dispose) renderer.dispose();
 		}
 		ctx.restore();
 	}

js/spine-utils.js

@@ -644,6 +644,37 @@ function parseAtlasPages(atlasText) {
 	return pages.filter((p) => !/[=,:]/.test(p));
 }
 
+/**
+ * 读取 Atlas 页面声明的预乘设置。Spine 4.x 会为每个页面写入
+ * `pma:true/false`；旧版 Atlas 通常没有该字段，此时返回 undefined。
+ * Spine 的一次导出会让所有页面使用同一设置。若遇到手工拼接且声明冲突
+ * 的 Atlas，采用第一个页面的声明，保持与页面/区域读取顺序一致。
+ */
+function parseAtlasPma(atlasText) {
+	if (typeof atlasText !== 'string') return undefined;
+	const matches = Array.from(atlasText.matchAll(/^\s*pma\s*:\s*(true|false)\s*$/gim));
+	return matches.length ? matches[0][1].toLowerCase() === 'true' : undefined;
+}
+
+/** 找到应在首次预览时使用的皮肤：defaultSkin、名为 default 的皮肤、第一个皮肤。 */
+function preferredSkin(skeletonData) {
+	if (!skeletonData) return null;
+	if (skeletonData.defaultSkin) return skeletonData.defaultSkin;
+	const skins = skeletonData.skins || [];
+	return skins.find((skin) => skin && skin.name === 'default') || skins[0] || null;
+}
+
+/** 应用皮肤并按 setup pose 重新解析槽位附件，跨 Spine 3.4–4.3 使用。 */
+function applySkin(skeleton, skin) {
+	if (!skeleton || !skin) return false;
+	if (typeof skeleton.setSkin === 'function') skeleton.setSkin(skin);
+	else if (typeof skeleton.setSkinByName === 'function') skeleton.setSkinByName(skin.name);
+	else return false;
+	if (typeof skeleton.setSlotsToSetupPose === 'function') skeleton.setSlotsToSetupPose();
+	else if (typeof skeleton.setToSetupPose === 'function') skeleton.setToSetupPose();
+	return true;
+}
+
 module.exports = {
 	SKELETON_EXTS,
 	ATLAS_EXTS,
@@ -663,6 +694,9 @@ module.exports = {
 	looksLikeSkeletonJson,
 	discoverAssets,
 	parseAtlasPages,
+	parseAtlasPma,
+	preferredSkin,
+	applySkin,
 	isEagleItemDir,
 	getSearchRoots,
 	collectSpineFiles,