希望官方提供一个spriteFrame转化成base64

Creator 2.x
#1

hi all，
我现在用的是cocos creator 1.9.0，
cocos creator把游戏做完后，现在分享的时候需要传入的是base64的string。但是截屏分享的时候，发现只能在canvas下可以通过toDataURL()获取，但是webgl下，没有找到接口和数据去做。

查看别的引擎，好像都有这样的接口。cocos creator能不能添加一个。或者给一个通用的方法。
其他的开发者同学，你们有这样的api需求吗，需要的请回复下，让官方给一个稳妥的方案。。以后可能很多平台需要的都是要传入base64的。

我参考了论坛上的不少方法了，其中
https://discuss.cocos2d-x.org/t/convert-cc-texture2d-in-base64-or-bytearray/33435
这个帖子中，官方只给了方法，然后很多接口尝试下都不行了。而且方法只是简单说了一下，实现还很复杂。不知道如何下手。

#2

日更。求关注

#3

我就来看看你头像，然后告诉你，我们当时也是遇到这个坑，然后直接在线base的，哈哈

#4

看你实际的需求了
1.截取当前屏幕，直接拿GameCanvas.toDataUrl
2.分享静态贴图？直接texture 取到对应的HtmlImageElement.toDataUrl()
这个如果是合图的美术资源，这里需要先根据SpriteFrame绘制到一个干净的canvas上，然后这个新建的canvas.toDataUrl()
3. 分享屏幕局部的图片？
canvas渲染：拿到GameCanvas，GameCanvas.getContext(“2d”).getImageData(x, y, width, height); x,y为屏幕坐标，宽高是要截取部分的宽高。然后创建一个新的canvas，将ImageData放到新的canvas绘制，这个新的canvas.toDataURL()导出base64
webgl渲染：

cc.eventManager.addListener({
event: cc.EventListener.CUSTOM,
eventName: cc.Director.EVENT_AFTER_DRAW ,
callback: function (event) {

			var context = cc.game._renderContext;
			var arrayBuffer = new Uint8Array(context.drawingBufferWidth * context.drawingBufferHeight * 4);
			context.readPixels(0, 0, context.drawingBufferWidth, context.drawingBufferHeight, context.RGBA, context.UNSIGNED_BYTE, arrayBuffer);
			var clampArray = new Uint8ClampedArray(arrayBuffer, 0, arrayBuffer.length);
			var imageData = new ImageData(clampArray, context.drawingBufferWidth, context.drawingBufferHeight);
			var tempCanvas = document.createElement('canvas');
			tempCanvas.getContext('2d').putImageData(imageData, 0, 0);
			tempCanvas.toDataURL()

		}
	}, this.getRootNode());

注意一定要在cc.Director.EVENT_AFTER_DRAW这个事件触发时读取像素数据。

1赞
#5

如果只想截取某棵节点树的情况
1.创建rendertexture
2.rendertexture.begin
3.node.visit
4.rendertexture.end
5.context.readPixels
和上面一样