CocosCreator-原生平台和web平台的截图方案
2019-09-28 本文已影响0人
vectorZ
因为原生平台和web平台的环境不同,所以截图方案不同,下面提供了2个平台的不同截图方案。作者使用的cocoscreator的版本为1.10.3,可能后续版本有修改,如果后续版本无法使用该方法,请在评论中指出!
原生平台
原生平台使用cc.RenderTexture
类缓存当前场景的显示数据。使用的很多方法官方没有向外提供,编辑器会有语法报错,可以在行前使用//@ts-ignore
忽略报错。
sceneShot_Naive1() {
let size = cc.director.getWinSize();
let fileName = "sceneShot_navie1.png";
// 两种初始化方式,如果第一种截的图是白色的,需要使用第二种
// let renderTexture = new cc.RenderTexture(size.width, size.height);
let renderTexture = new cc.RenderTexture(Math.floor(size.width), Math.floor(size.height), cc.Texture2D.PIXEL_FORMAT_RGBA8888, gl.DEPTH24_STENCIL8_OES);
renderTexture.setPosition(cc.v2(size.width / 2, size.height / 2));
renderTexture.begin();
cc.director.getRunningScene().visit();
renderTexture.end();
// 保存到本地
// 注意传入的是*文件名*,该方法会默认输出到`jsb.fileUtils.getWritablePath()`的目录下。
renderTexture.saveToFile("naive_shot.png", cc.ImageFormat.PNG, true);
// 显示到界面
// 注意不要这样赋值spriteFrame : this.sprite.spriteFrame = renderTexture.getSprite().getSpriteFrame();
let texture2d = renderTexture.getSprite().getSpriteFrame().getTexture();
this.sprite.spriteFrame.setTexture(texture2d);
}
web平台
使用网页元素生成图片的base64数据来截图。
sceneShot_web1() {
return new Promise<cc.Texture2D>((resolve, reject) => {
let func = () => {
cc.director.off(cc.Director.EVENT_AFTER_DRAW, func);
//@ts-ignore
let canvas: HTMLCanvasElement = document.getElementById("GameCanvas");
let base64 = canvas.toDataURL();
var img = new Image();
img.src = base64;
img.onload = function () {
var texture = new cc.Texture2D();
texture.initWithElement(img);
texture.handleLoadedTexture();
resolve(texture);
}
img.onerror = reject;
};
// 必须要在渲染过后触发截图方法,并记得一定要取消该方法的注册
cc.director.on(cc.Director.EVENT_AFTER_DRAW, func);
});
}