```
(function()
{
const canvasNode = cc.director.getScene().getChildByName("Canvas");
if (!canvasNode) {
console.error("未找到 Canvas 节点");
}
// 创建临时 Camera 和 RenderTexture(原始代码)
const cameraNode = new cc.Node();
cameraNode.parent = cc.find("Canvas"); // 挂载到 Canvas 下避免层级问题
const camera = cameraNode.addComponent(cc.Camera);
// 配置相机参数
camera.targetTexture = new cc.RenderTexture();
camera.targetTexture.initWithSize(canvasNode.width, canvasNode.height);
camera.cullingMask = 0xffffffff; // 渲染所有层
camera.clearFlags = cc.Camera.ClearFlags.DEPTH; // 只清除深度缓冲
camera.render(canvasNode); // 渲染 Canvas 节点
// 从 RenderTexture 读取像素数据并转换为图片(原始代码)
const texture2D = new cc.Texture2D();
var canvas2 = document.getElementById('GameCanvas');
texture2D.initWithElement(canvas2); // 或使用 RenderTexture 的数据(需额外处理)
// 转换为 SpriteFrame 并显示(示例)(原始代码)
const spriteFrame = new cc.SpriteFrame(texture2D);
const previewNode = new cc.Node();
const sprite = previewNode.addComponent(cc.Sprite);
sprite.spriteFrame = spriteFrame;
cc.director.getScene().addChild(previewNode);
//canvasNode.children.unshift(previewNode);
// ==================== 新增:保存 previewNode 的纹理为图片 ====================
// 1. 创建一个新的 RenderTexture 专门用于渲染 previewNode
const saveRenderTexture = new cc.RenderTexture();
saveRenderTexture.initWithSize(previewNode.width, previewNode.height);
// 2. 创建一个临时 Camera 专门用于渲染 previewNode
const saveCameraNode = new cc.Node();
saveCameraNode.parent = cc.director.getScene(); // 直接挂载到场景下
const saveCamera = saveCameraNode.addComponent(cc.Camera);
saveCamera.targetTexture = saveRenderTexture;
saveCamera.cullingMask = 0xffffffff; // 渲染所有层
saveCamera.clearFlags = cc.Camera.ClearFlags.DEPTH; // 只清除深度缓冲
// 3. 调整 Camera 的视口,使其只渲染 previewNode
// (这里简化处理,直接渲染整个节点)
saveCamera.render(previewNode);
// 4. 从 saveRenderTexture 读取像素数据
const pixels = saveRenderTexture.readPixels();
const width = saveRenderTexture.width;
const height = saveRenderTexture.height;
// 5. 创建 ImageData 并转换 BGRA -> RGBA,同时上下翻转
const imageData = new ImageData(width, height);
const data = imageData.data;
// 遍历每一行,从下往上读取像素(实现上下翻转)
for (let y = 0; y < height; y++) {
for (let x = 0; x < width; x++) {
// 计算原始像素位置(从左下角开始)
const srcIndex = (y * width + x) * 4;
// 计算翻转后的像素位置(从左上角开始)
const dstIndex = ((height - 1 - y) * width + x) * 4;
// BGRA -> RGBA
data[dstIndex] = pixels[srcIndex ]; // R (原 B)
data[dstIndex + 1] = pixels[srcIndex + 1]; // G (原 G)
data[dstIndex + 2] = pixels[srcIndex + 2]; // B (原 R)
data[dstIndex + 3] = pixels[srcIndex + 3]; // A (原 A)
}
}
// 6. 创建 canvas 并绘制图像
const canvas = document.createElement('canvas');
canvas.width = width;
canvas.height = height;
const ctx = canvas.getContext('2d');
ctx.putImageData(imageData, 0, 0);
// 7. 将 canvas 转换为 base64 图片数据
const dataURL = canvas.toDataURL('image/png');
// 8. 创建 <a> 标签并触发下载
const link = document.createElement('a');
link.download = 'preview_screenshot.png';
link.href = dataURL;
link.click(); // 触发下载
// ==================== 新增代码结束 ====================
// 9. 截屏完成后移除 previewNode
previewNode.removeFromParent();
// 销毁临时 Camera 和 RenderTexture
saveCameraNode.destroy();
saveRenderTexture.destroy();
// 销毁原始临时相机
cameraNode.destroy();
})()
```
1352

被折叠的 条评论
为什么被折叠?



