【Cocos2d-x】截屏实现的两种方法RenderTexture和glReadPixel,实现和原理详细分析

前端之家收集整理的这篇文章主要介绍了【Cocos2d-x】截屏实现的两种方法RenderTexture和glReadPixel,实现和原理详细分析前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

很多游戏都有截屏的需求,比如截屏后与好友分享截图,或者为了减少渲染内容,在打开某个UI界面时隐藏后面的所有渲染,用截屏代替。

截屏是一个比较老的话题了,一般用RenderTexture可以解决,其实我再拿出来说是因为想讨论另一种方法glReadPixels


以下分析两种截屏方法

1. RenderTexture

2. glReadPixels


1. RenderTexture

实现代码如下:(测试用的是Cocos2d-x 3.3)

Sprite* utilScreenshot::createScreenshotSprite()
{
	Size visibleSize = Director::getInstance()->getVisibleSize();

	RenderTexture* renderTexture = RenderTexture::create(visibleSize.width,visibleSize.height);

	renderTexture->begin();
	Director::getInstance()->getRunningScene()->visit();
	renderTexture->end();

	Texture2D* texture = renderTexture->getSprite()->getTexture();
	Sprite* sprScreenshot = Sprite::createWithTexture(texture);
	sprScreenshot->setFlippedY(true);
	return sprScreenshot;
}

调用代码如下:

	Sprite* sprScreenshot = utilScreenshot::createScreenshotSprite();
	sprScreenshot->setPosition(visibleSize / 2);
	this->addChild(sprScreenshot,1);

原理:把当前场景进行一次渲染,但这次渲染不是渲染到屏幕上,而是渲染到RenderTexture维护的一张纹理上,然后再用这张纹理生成Sprite。

注意那句setFlippedY(2.x版本叫做setFlipY),因为OpenGL的纹理数据是从下到上保存的,但渲染却是从上到下渲染的,所以生成的纹理是上下颠倒的,需要翻转一下。


2. glReadPixels

之前我一直都是用上面那种方法进行截图的实现,后来看了一些OpenGL的书,认识一个函数glReadPixels,这个函数可以直接读取帧缓冲区的像素数据。

实现代码如下:

Sprite* utilScreenshot::createScreenshotSprite()
{
	GLView* glview = Director::getInstance()->getOpenGLView();
	Size frameSize = glview->getFrameSize();
	
	const int dataLength = frameSize.width * frameSize.height * 4;
	char* pixelData = new char[dataLength];
	glReadPixels(0,frameSize.width,frameSize.height,GL_RGBA,GL_UNSIGNED_BYTE,pixelData);

	Texture2D* texture = new Texture2D();
	texture->initWithData(pixelData,dataLength,Texture2D::PixelFormat::RGBA8888,frameSize);

	Sprite* sprScreenshot = Sprite::createWithTexture(texture);
	sprScreenshot->setScaleX(1 / glview->getScaleX());
	sprScreenshot->setScaleY(1 / glview->getScaleY());
	sprScreenshot->setFlippedY(true);

	CC_SAFE_RELEASE(texture);
	delete[] pixelData;

	return sprScreenshot;
}
原理:直接读取帧缓冲区的像素数据,把读取出来的数据生成一张纹理,再用纹理生成Sprite。

注意:同样需要setFlippedY,原因同上。另外一点,由于用这种方式生成出来的texture的宽高为屏幕的实际宽高(而不是setDesginResolutionSize的宽高),所以需要setScaleX,setScaleY转换为design的宽高。


效率比较:RenderTexture需要把整个场景渲染一次(就是说要把以CCScene为根节点的节点树进行一次遍历,访问每个节点的visit和draw函数),而glReadPixels是直接获取显卡的数据,效率应该要比前者快。


对了还有一个问题,无论是RenderTexture还是glReadPixels的方法,如果把截图叠在场景上,会发现有那么一点点的偏差,这是为什么呢?其实这是由于透视投影中近大远小的原因,图片的四周离摄像机较远,投影之后会比中间小,所以生成出来的图片并不是原图片。在Cocos2d-x中,Director::setProjection默认设成了透视投影,如果是2D游戏,只需调用一下

Director::getInstance()->setProjection(Director::Projection::_2D);
这句会把投影方式设成正交投影,即可解决问题。

由于本人水平有限,文章叙述如有不当,欢迎吐槽。

猜你在找的Cocos2d-x相关文章