求教！如何将某节点下多个精灵数据合并生成一个新的RenderTexture呢？

Creator 3.x
#1

层级结构
Canvas

  • Node1
    • Sprite1
    • Sprite2
    • Sprite3
  • Node2
    …
    我的需求是获取Node1，生成一个RenderTexture。我需要用RenderTexture 这个的数据做一些事情。比如修改，然后放到一个新的SpriteFrame上！！ 哪位大佬会辛苦给出的Demo，万分感激。
#2

不做没钱，论坛上之前有对应的方案，你可以搜索“截图”

#3

今天逛了半天也没有找到合适的。[哭死] 我自己写了个demo，看上去不能用。

image
image1374×1146 170 KB

#4

:pray: 有人懂的好心人解答下了。另外我这个和截图还有点区别，就是只要节点下的纹理数据，不希望有节点外的数据，不是截一块屏的事

#5

function RenderSpTexture(renderNode?: cc.Node) {

    LogFunc.log("开始截图")

    let size = cc.winSize

    let gl = cc.game['_renderContext'];

    var renderTexture = new cc.RenderTexture()

    renderTexture['_premultiplyAlpha'] = true;

    renderTexture.initWithSize(size.width, size.height, gl.STENCIL_INDEX8)

    var targetSprite = (new cc.Node("targetSprite")).addComponent(cc.Sprite)

    targetSprite.spriteFrame = new cc.SpriteFrame(renderTexture)

    targetSprite.node.group = "RenderSpriteGroup"

    targetSprite.srcBlendFactor = cc.macro.BlendFactor.ONE;

    var targetCamera = (new cc.Node("targetCamera")).addComponent(cc.Camera)

    targetCamera.depth = 1

    targetCamera.backgroundColor = cc.Color.BLACK

    targetCamera.clearFlags = cc.Camera.ClearFlags.DEPTH | cc.Camera.ClearFlags.STENCIL | cc.Camera.ClearFlags.COLOR

    targetCamera.rect = cc.rect(0, 0, 1, 1)

    targetCamera.zoomRatio = 1

    targetCamera.alignWithScreen = true

    targetCamera.node.group = "default"

    let listValues = Object.values(cc.game.config.groupList)

    let groupIndex = listValues.indexOf("RenderSpriteGroup")

    targetCamera.cullingMask=listValues.indexOf("node1的分组")

    targetCamera.cullingMask &= ~(1 << groupIndex);

    targetCamera.targetTexture = renderTexture

    targetCamera.node.parent = $app.view.RootNode

    targetSprite.node.parent = $app.view.RootNode

    targetSprite.node.scaleY = -1

    targetCamera.render(renderNode)

    setTimeout(() => {//切后台就不能保证 当前截图和bundle的释放时机了

        targetCamera?.node?.destroy()

        LogFunc.log("截图关闭")

    }, 0)

    return targetSprite//可以设置targetSprite的大小和node1的大小一样

}

RenderSpriteGroup是不截取的部分 你把你的node1设置好分组 ,然后相机就只照这一部分就行了,然后稍微修改下就可以用了,注意这个是2.4.13的版本哟

1赞
#6

谢谢！不过v2 版本的我已经有了，最近是升级了v3版本，发现好多地方都需要改，之前的v2版本的不行用了！！

#7

我的demo结果是空的，目前还不知道原因是啥

#8

复制一个节点，把你想要的都装进去？

#9

如果是类似这样的有选择地截图或者仅渲染某个节点的话，可以考虑使用相机进行分组分层渲染截图数据：

https://store.cocos.com/app/detail/3611

#11

谢谢大佬！我自己解决了这个问题，解决思路就是你说这个。我新建了一个Layers层，然后将节点下的图片放到自定义层，然后使用相机进行拍摄，和预期的结果一样，并且也能保留透明通道部分。拍摄出来的是反转的，不过好像问题不大，应该反转一下就好了。 :grinning: :grinning:

1赞
#12

不就是我发的这个嘛 单独的一个group

#13

谢啦没用你那个呢，我是v3版本。不过思路上大致一样。