用anysdk做微信分享,遇到一个头疼的事。首先是截图,官方没有提供一个这样的插件,找了半天,截图是可以截了。ios中还必须自己提供缩略图,找了半天也没找到生成缩略图的api。后来自己写了一个截图并生成缩略图的插件,分享给大家。
主要原理:首先截全屏,然后新建一个节点,将截图的图片放入节点中,缩放到适当的位置,并放到左上角,然后再次截图,最后删除节点。
插件代码如下:
export default class ScreenShot {
x: number = 0;
y: number = 0;
width: number = 100;
height: number = 100;
hasMask: boolean = false;
targetWidth: number = 100;
targetHeight: number = 100;
renderTexture = null;
/**
* 设置截屏区域
* @param x
* @param y
* @param width
* @param height
*/
setRect(x: number, y: number, width: number, height: number) {
this.x = x;
this.y = y;
this.width = width;
this.height = height;
}
/**
* 通过节点设置截屏区域
* @param node
*/
setRectFromNode(node: cc.Node) {
var ox = - node.width * node.anchorX;
var oy = - node.height * node.anchorY;
var ex = + node.width * node.anchorX;
var ey = + node.height * node.anchorY;
var op = node.convertToWorldSpaceAR(new cc.Vec2(ox, oy));
var ep = node.convertToWorldSpaceAR(new cc.Vec2(ex, ey));
this.x = op.x;
this.y = op.y;
this.width = ep.x - op.x;
this.height = ep.y - op.y;
}
/**
* 设置截屏后保存的尺寸
* @param width
* @param height
*/
setSize(width: number, height: number) {
this.targetWidth = width;
this.targetHeight = height;
}
shot() {
var scene = cc.director.getScene();
var canvas = cc.find("/Canvas");
var rt = this.createRenderTexture(canvas.width, canvas.height);
rt.begin();
cc.director.getRunningScene().visit();
rt.end();
var scaleX = this.targetWidth / this.width;
var scaleY = this.targetHeight / this.height;
var node = new cc.Node();
node.width = canvas.width;
node.height = canvas.height;
node.scaleX = scaleX;
node.scaleY = scaleY;
node.x = (node.width / 2 - this.x) * scaleX;
node.y = (node.height / 2 - this.y) * scaleY;
node._sgNode.addChild(rt);
cc.director.getScene().addChild(node);
this.renderTexture = this.createRenderTexture(this.targetWidth, this.targetHeight);
this.renderTexture.begin();
cc.director.getRunningScene().visit();
this.renderTexture.end();
node.destroy();
}
saveToFile(path: string, format: cc.ImageFormat, callback: Function) {
if (null == this.renderTexture) {
throw new Error("请先截图!");
}
this.renderTexture.saveToFile(path, format, true, callback);
}
private createRenderTexture(width, height) {
if (this.hasMask) {
return cc.RenderTexture.create(width, height, cc.Texture2D.PIXEL_FORMAT_RGBA8888, gl.DEPTH24_STENCIL8_OES);
} else {
return cc.RenderTexture.create(width, height);
}
}
}
直接可以使用,我是用ts写的,用js的同学自己想办法。
调用方式如下:
var ss = new ScreenShot();
ss.setRect(100, 100, 200, 200);
ss.setSize(64, 64);
ss.shot();
ss.saveToFile(“image.png”, cc.ImageFormat.JPG, function(){
cc.log(“success”);
});