关于截图终极解决
2021-01-17 本文已影响0人
凡凡的小web
drawPath()
function drawPath(){
let pointArr = []
let totalLen = getTotalLength(line)
for (let pathLen = 0; pathLen < totalLen; pathLen += 12) {
let preMove = getPointAtLength(line, pathLen)
let apha = getPointApha(childs[1], preMove.x / fix, 414 - preMove.y)
if(apha){
pointArr.push({
x: (preMove.x - 368),
y: (207 - preMove.y) * fix,
apha: 1
})
}else{
pointArr.push({
x: (preMove.x - 368),
y: (207 - preMove.y) * fix,
apha: 0
})
}
}
let apha = 1
let num = [0]
for(let index = 0, pointLength = pointArr.length; index < pointLength; index++){
if(pointArr[index].apha == apha){
num.push(index)
if(apha == 0){
apha = 1
}else{
apha = 0
}
}
}
num.push(pointArr.length)
cc.log(num)
that.pigNumArr = num
that.pointArr.push(pointArr)
cc.log(pointArr)
// cc.log(that.pointArr)
// let graphics1 = childs[2].getComponent(cc.Graphics)
// for(let j = 1, l= pointArr.length;j<l-1;j +=1 ){
// graphics1.lineWidth = 15
// graphics1.lineCap = cc.Graphics.LineCap.BUTT
// if(pointArr[j].apha){
// graphics1.strokeColor = new cc.Color(93,137,154,0)
// }else{
// graphics1.strokeColor = new cc.Color(255,0,0)
// }
// graphics1.moveTo(pointArr[j].x,pointArr[j].y)
// graphics1.lineTo(pointArr[j+1].x, pointArr[j+1].y)
// graphics1.stroke()
// }
}
function getPointApha (node, x, y) {
var oldGroup = node.group
node.group = 'capture'
var camera = cc.find('Canvas/Capture Camera').getComponent(cc.Camera)
// var camera = node.getComponent(cc.Camera);
// if(!camera){
// camera = node.addComponent(cc.Camera);
// camera.cullingMask = 1 << node.groupIndex
// camera.zoomRatio = 1
// camera.alignWithScreen = true;
// camera.orthoSize = 220; // camera.alignWithScreen 设为false这个才有效
// 设置backgroundColor
// camera.backgroundColor = new cc.Color(0, 0, 0, 0);//可以保留截图的透明部分
// }
// 新建一个 RenderTexture，并且设置 camera 的 targetTexture 为新建的 RenderTexture，这样camera 的内容将会渲染到新建的 RenderTexture 中。
var texture = new cc.RenderTexture();
var gl = cc.game._renderContext;
// 如果截图内容中不包含 Mask 组件，可以不用传递第三个参数
texture.initWithSize(cc.visibleRect.width, cc.visibleRect.height, gl.STENCIL_INDEX8);
// texture.initWithSize(cc.visibleRect.width, cc.visibleRect.height);
camera.targetTexture = texture;
camera.render();
// 2. 获取指定区域的像素点信息
var pixels = new Uint8Array(4);
var data = texture.readPixels(pixels, x, y, 1, 1);
node.group = oldGroup
return data[3]
// 这样我们就能从 RenderTexture 中获取到数据了
// let data = texture.readPixels();
// 接下来就可以对这些数据进行操作了
// let canvas = document.createElement('canvas');
// let ctx = canvas.getContext('2d');
// let width = canvas.width = texture.width;
// let height = canvas.height = texture.height;
// let rowBytes = width * 4;
// for (let row = 0; row < height; row++) {
// let srow = height - 1 - row;
// let imageData = ctx.createImageData(width, 1);
// let start = srow*width*4;
// for (let i = 0; i < rowBytes; i++) {
// imageData.data[i] = data[start+i];
// }
// ctx.putImageData(imageData, 0, row);
// }
// let dataURL = canvas.toDataURL("image/png");
// let img = new Image();
// img.src = dataURL;
// img.onload = function(){
// var texture = new cc.Texture2D();
// texture.initWithElement(img);
// texture.handleLoadedTexture();
// var newframe = new cc.SpriteFrame(texture);
// that.player_node.getComponent(cc.Sprite).spriteFrame = newframe;
// }
// let a=document.createElement("a")
// a.href=dataURL;
// a.download="image";
// document.body.appendChild(a);
// a.click();
// document.body.removeChild(a);
}
// childs[0].on(cc.Node.EventType.TOUCH_END, onTouch, this)
// function onTouch(e){
// cc.log(e.getLocation())
// cc.log(getPointApha(childs[1], e.getLocation().x, e.getLocation().y))
// }
截图不显示问题
https://forum.cocos.org/t/topic/79377/3
1.原生截图换DEPTH24_STENCIL8_OES
2.截图放到EVENT_AFTER_DRAW之后
3.1.x版本截图时关闭渲染优化剪枝功能
问题已解决，在使用遮罩时候，千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万千万不要使用反向遮罩
// 渲染一次摄像机，即更新一次内容到 RenderTexture 中
cc.director.getScene().scaleY = -1;
camera.render();
cc.director.getScene().scaleY = 1;
