热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

基于Cocos2d-x学习OpenGLES2.0系列——OpenGLES渲染之LayerColor(8)

在前面文章中讲述了Cocos2d-x引擎OpenGL渲染准备Shader方面,本文主要讲解使用LayerColor来讲述OpenGL的渲染过程。1、LayerColor对象创建添加LayerColor

前面文章中讲述了Cocos2d-x引擎OpenGL渲染准备Shader方面,本文主要讲解使用LayerColor来讲述OpenGL的渲染过程。

1、LayerColor对象创建

添加LayerColor元素到游戏中:

auto layerColor = LayerColor::create(Color4B(255, 0, 0, 255), 100, 100);  
layerColor
->setPosition(100,100);

下面是LayerColor::create方法:

LayerColor* LayerColor::create(const Color4B& color, GLfloat width, GLfloat height)  
{
LayerColor
* layer = new LayerColor();
if( layer &&layer->initWithColor(color,width,height)) {
layer
->autorelease();
return layer;
}
CC_SAFE_DELETE(layer);
return nullptr;
}

1、使用new操作符创建新LayerColor对象

2、使用initWithColor方法初始化新建的LayerColor对象

3、LayerColor创建并初始化成功后, (使用create方法创建的对象,需要)将该对象加热自动内存管理

在LayerColor::initWithColor方法中:

boolLayerColor::initWithColor(const Color4B& color, GLfloat w, GLfloat h){  
if (Layer::init()){
_blendFunc
=BlendFunc::ALPHA_NON_PREMULTIPLIED; //设置混合模式
     _displayedColor.r
= _realColor.r =color.r; _displayedColor.g = _realColor.g =color.g;
_displayedColor.b
= _realColor.b =color.b;
_displayedOpacity
= _realOpacity =color.a;
for (size_t i = 0;i<sizeof(_squareVertices) / sizeof( _squareVertices[0]); i++ )
{
_squareVertices[i].x
= 0.0f;
_squareVertices[i].y
= 0.0f;
}

updateColor();
setContentSize(Size(w, h));

setGLProgramState(GLProgramState::getOrCreateWithGLProgramName(GLProgram::SHADER_NAME_POSITION_COLOR_NO_MVP));
return true;
}
return false;
}

1、调用Layer::init()方法,该方法的主要作用设置默认大小,其实在下面会重新设置LayerColor大小

2、设置混合模式为_blendFunc =BlendFunc::ALPHA_NON_PREMULTIPLIED

3、设置四个顶点的颜色

4、设置四个顶点的坐标,并设置Layer的大小

5、设置LayerColor渲染所使用Shader程序对应的GLProgramState

LayerColor其实是一个四边形,OpenGL会以四边形的方式渲染LayerColor,故需要设置四边形的顶点坐标&顶点颜色;

所有的GLProgramState都会保持在GLProgramStateCache::_glProgramStates中,首次获取该GLProgramState时会新建GLProgramState对象,然后将该对象插入到GLProgramStateCache::_glProgramStates中。

2、LayerColor渲染

首先先看一下游戏的Function调用流程:

Application::run()  
{
……
DisplayLinkDirector::mainLoop()
……
}
DisplayLinkDirector::mainLoop()
{
……
Director::drawScene()
……
……
}
Director::drawScene()
{
……
Node::visit(…)
……
Renderer::render()
……
}
Node::visit(…)
{
……
LayerColor::draw(…)
……
}

LayerColor::draw(…)方法如下:

voidLayerColor::draw(Renderer *renderer, const Mat4 &transform, uint32_t flags)  
{
_customCommand.init(_globalZOrder);
_customCommand.func
=CC_CALLBACK_0(LayerColor::onDraw, this, transform, flags);
renderer
->addCommand(&_customCommand);

for(int i = 0; i <4; ++i)
{
Vec4 pos;
pos.x
= _squareVertices[i].x;
pos.y =_squareVertices[i].y;
pos.z = _positionZ; pos.w = 1;
_modelViewTransform.transformVector(
&pos);
_noMVPVertices[i]
= Vec3(pos.x,pos.y,pos.z)/pos.w;
}
}

1、初始化_customCommand对象,_customCommand是一个渲染指令

2、设置_customCommand的回调函数为LayerColor::onDraw

3、将该LayerColor的渲染指令_customCommand加入到渲染队列中

4、分别将四个顶点坐标通过模型视图矩阵转换

Renderer::addCommand(…)方法如下:

voidRenderer::addCommand(RenderCommand* command)  
{
int renderQueue =_commandGroupStack.top();
addCommand(command, renderQueue);
}
voidRenderer::addCommand(RenderCommand
* command, int renderQueue)
{
_renderGroups[renderQueue].push_back(command);
}

1、 获取_commandGroupStack的堆栈,其实_commandGroupStack存储的是_renderGroups数组的位置编号

2、 将新的渲染命令加入_renderGroups[renderQueue]堆栈中

Renderer::render()方法如下:

voidRenderer::render()  
{
_isRendering
= true;

if (_glViewAssigned)
{
_drawnBatches
= _drawnVertices = 0;
for (auto &renderqueue : _renderGroups){
renderqueue.sort();
}
visitRenderQueue(_renderGroups[
0]);
flush();
}
clean();
_isRendering
= false;
}

1、将_isRendering该帧是否渲染标志设为true

2、遍历_renderGroups,并对RenderQueue进行排序

3、真正的渲染部分,其实在_renderGroups中只目前只存在一个渲染集合

4、刷新OpenGL中参数

5、将_renderGroups能够所有CommandClean

RenderQueue::sort()渲染命令排序方法:

voidRenderQueue::sort()  
{
std::sort(std::begin(_queueNegZ),std::end(_queueNegZ), compareRenderCommand);
std::sort(std::begin(_queuePosZ), std::end(_queuePosZ),compareRenderCommand);
}
staticbool compareRenderCommand(RenderCommand
* a, RenderCommand* b)
{
return a->getGlobalOrder() getGlobalOrder();
}

1、将Command中元素Z坐标小于0的Command集合,按照重小到大排序

2、将Command中元素Z坐标大于0的Command集合,按照重小到大排序

Renderer::visitRenderQueue方法如下:

voidRenderer::visitRenderQueue(const RenderQueue& queue)  
{
ssize_t size
= queue.size();

for (ssize_t index = 0; index index){
auto command = queue[index];
auto commandType
= command->getType();
if(RenderCommand::Type::QUAD_COMMAND ==commandType) {
……
}
else if(RenderCommand::Type::GROUP_COMMAND== commandType) {
……
}
else if(RenderCommand::Type::CUSTOM_COMMAND== commandType) {
……
}
else if(RenderCommand::Type::BATCH_COMMAND ==commandType) {
……
}
else if (RenderCommand::Type::MESH_COMMAND== commandType) {
……
}
}
}

1、获取RenderQueue长度

2、遍历RenderQueue列表,并对不同类型的渲染Command分别处理

3、当渲染Commad类型为QUAD_COMMAND时

4、当渲染Commad类型为GROUP_COMMAND时

5、当渲染Commad类型为CUSTOM_COMMAND时

6、当渲染Commad类型为BATCH_COMMAND时

7、当渲染Commad类型为MESH_COMMAND时

由于篇幅有限,每种渲染的具体流程后续会分别讨论,由于LayerColor使用的是CustomCommand,下面会分析CustomCommand的具体渲染方法

elseif(RenderCommand::Type::CUSTOM_COMMAND == commandType)  
{
flush();
auto cmd
= static_cast(command);
cmd
->execute();
}

1、更新OpenGL参数,每次渲染前都需执行的操作,作用是将OpenGL参数设置为默认状态

2、请强制转换类型,并执行渲染Command

voidCustomCommand::execute()  
{
if(func) {
func();
}
}

判断func是否为空,若func不为空,执行该方法;func是一个回调函数,在添加LayerColor渲染命时指定,如:_customCommand.func= CC_CALLBACK_0(LayerColor::onDraw, this, transform, flags)

LayerColor真正的渲染部分

voidLayerColor::onDraw(const Mat4& transform, uint32_t flags)  
{
getGLProgram()
->use();
getGLProgram()
->setUniformsForBuiltins(transform);

   GL::enableVertexAttribs( GL::VERTEX_ATTRIB_FLAG_POSITION
| GL::VERTEX_ATTRIB_FLAG_COLOR );
glVertexAttribPointer(GLProgram::VERTEX_ATTRIB_POSITION,
3, GL_FLOAT, GL_FALSE, 0, _noMVPVertices); glVertexAttribPointer(GLProgram::VERTEX_ATTRIB_COLOR,4, GL_FLOAT, GL_FALSE, 0, _squareColors);

GL::blendFunc( _blendFunc.src, _blendFunc.dst);
glDrawArrays(GL_TRIANGLE_STRIP,
0, 4);
CC_INCREMENT_GL_DRAWN_BATCHES_AND_VERTICES(
1,4);
}

1、使用对应的Shader程序

2、设置对应的Uniforms 矩阵

3、使能OpenGL中顶点数组和颜色数组功能

4、设置四边形的四个顶点和颜色

5、设置混合模式

6、glDrawArrays画四边形

LayerColor其实是一个有颜色的四边形,渲染LayerColor只需要在正确的位置画一个有颜色的四边形即可;Cocos2dx使用渲染方式是OpenGL ES(Windows平台不同),在OpenGL ES中并没有直接画四边形的方法,故需要借助画三角形的方法画四边形,如glDrawArrays(GL_TRIANGLE_STRIP, 0, 4)为画四边形;


推荐阅读
  • Todayatworksomeonetriedtoconvincemethat:今天在工作中有人试图说服我:{$obj->getTableInfo()}isfine ... [详细]
  • 使用nodejs爬取b站番剧数据,计算最佳追番推荐
    本文介绍了如何使用nodejs爬取b站番剧数据,并通过计算得出最佳追番推荐。通过调用相关接口获取番剧数据和评分数据,以及使用相应的算法进行计算。该方法可以帮助用户找到适合自己的番剧进行观看。 ... [详细]
  • PHP中的单例模式与静态变量的区别及使用方法
    本文介绍了PHP中的单例模式与静态变量的区别及使用方法。在PHP中,静态变量的存活周期仅仅是每次PHP的会话周期,与Java、C++不同。静态变量在PHP中的作用域仅限于当前文件内,在函数或类中可以传递变量。本文还通过示例代码解释了静态变量在函数和类中的使用方法,并说明了静态变量的生命周期与结构体的生命周期相关联。同时,本文还介绍了静态变量在类中的使用方法,并通过示例代码展示了如何在类中使用静态变量。 ... [详细]
  • 海马s5近光灯能否直接更换为H7?
    本文主要介绍了海马s5车型的近光灯是否可以直接更换为H7灯泡,并提供了完整的教程下载地址。此外,还详细讲解了DSP功能函数中的数据拷贝、数据填充和浮点数转换为定点数的相关内容。 ... [详细]
  • php缓存ri,浅析ThinkPHP缓存之快速缓存(F方法)和动态缓存(S方法)(日常整理)
    thinkPHP的F方法只能用于缓存简单数据类型,不支持有效期和缓存对象。S()缓存方法支持有效期,又称动态缓存方法。本文是小编日常整理有关thinkp ... [详细]
  • Iamtryingtomakeaclassthatwillreadatextfileofnamesintoanarray,thenreturnthatarra ... [详细]
  • 本文介绍了设计师伊振华受邀参与沈阳市智慧城市运行管理中心项目的整体设计,并以数字赋能和创新驱动高质量发展的理念,建设了集成、智慧、高效的一体化城市综合管理平台,促进了城市的数字化转型。该中心被称为当代城市的智能心脏,为沈阳市的智慧城市建设做出了重要贡献。 ... [详细]
  • 向QTextEdit拖放文件的方法及实现步骤
    本文介绍了在使用QTextEdit时如何实现拖放文件的功能,包括相关的方法和实现步骤。通过重写dragEnterEvent和dropEvent函数,并结合QMimeData和QUrl等类,可以轻松实现向QTextEdit拖放文件的功能。详细的代码实现和说明可以参考本文提供的示例代码。 ... [详细]
  • Java序列化对象传给PHP的方法及原理解析
    本文介绍了Java序列化对象传给PHP的方法及原理,包括Java对象传递的方式、序列化的方式、PHP中的序列化用法介绍、Java是否能反序列化PHP的数据、Java序列化的原理以及解决Java序列化中的问题。同时还解释了序列化的概念和作用,以及代码执行序列化所需要的权限。最后指出,序列化会将对象实例的所有字段都进行序列化,使得数据能够被表示为实例的序列化数据,但只有能够解释该格式的代码才能够确定数据的内容。 ... [详细]
  • 本文讨论了在Windows 8上安装gvim中插件时出现的错误加载问题。作者将EasyMotion插件放在了正确的位置,但加载时却出现了错误。作者提供了下载链接和之前放置插件的位置,并列出了出现的错误信息。 ... [详细]
  • android listview OnItemClickListener失效原因
    最近在做listview时发现OnItemClickListener失效的问题,经过查找发现是因为button的原因。不仅listitem中存在button会影响OnItemClickListener事件的失效,还会导致单击后listview每个item的背景改变,使得item中的所有有关焦点的事件都失效。本文给出了一个范例来说明这种情况,并提供了解决方法。 ... [详细]
  • Python正则表达式学习记录及常用方法
    本文记录了学习Python正则表达式的过程,介绍了re模块的常用方法re.search,并解释了rawstring的作用。正则表达式是一种方便检查字符串匹配模式的工具,通过本文的学习可以掌握Python中使用正则表达式的基本方法。 ... [详细]
  • jQuery实现简单的动画效果及用法详解
    本文详细介绍了使用jQuery实现简单动画效果的方法,包括显示/隐藏、向上收缩/向下展开、淡入/淡出、自定义动画等。同时提供了具体的用法示例,并解释了参数的含义和使用技巧。通过本文的学习,读者可以掌握如何使用jQuery实现各种动画效果,为网页增添生动和互动性。 ... [详细]
  • 本文介绍了Java后台Jsonp处理方法及其应用场景。首先解释了Jsonp是一个非官方的协议,它允许在服务器端通过Script tags返回至客户端,并通过javascript callback的形式实现跨域访问。然后介绍了JSON系统开发方法,它是一种面向数据结构的分析和设计方法,以活动为中心,将一连串的活动顺序组合成一个完整的工作进程。接着给出了一个客户端示例代码,使用了jQuery的ajax方法请求一个Jsonp数据。 ... [详细]
  • wpf+mvvm代码组织结构及实现方式
    本文介绍了wpf+mvvm代码组织结构的由来和实现方式。作者回顾了自己大学时期接触wpf开发和mvvm模式的经历,认为mvvm模式使得开发更加专注于业务且高效。与此同时,作者指出mvvm模式相较于mvc模式的优势。文章还提到了当没有mvvm时处理数据和UI交互的例子,以及前后端分离和组件化的概念。作者希望能够只关注原始数据结构,将数据交给UI自行改变,从而解放劳动力,避免加班。 ... [详细]
author-avatar
jyyxk55232
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有