OpenGL ES 2.0教程：你的第一个三角形(1)(opengl opengl es)

发布时间：2024-02-27

推荐整理分享OpenGL ES 2.0教程：你的第一个三角形(1)(opengl opengl es)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:opengl es3.0,opengl opengl es,opengl es视频教程,opengl es4.0,opengl es视频教程,opengl es2.0应用,opengl es3.0metal,opengl es2.0应用,内容如对您有帮助，希望把文章链接给更多的朋友！

MAY ST, 3: PM

前言正文准备工作发送CustomCommand结束语写在最后推荐阅读转载自： ES 2.0的一些基本用法。本系列教程的宗旨是OpenGL扫盲，让大家在使用Cocos2D-X过程中，知其然，更知其所以然。因为我自己的图形学水平有限，所以这些教程不会涉及非常底层的数学原理，同时也不会过多地提及OpenGL本身的一些细节知识。但是我会在每篇文章的最后给出一些参考链接，大家可以顺藤摸瓜，一举Get OpenGL这个新技能。

我第一次学习OpenGL是在年，但是那时候学得很烂，被各种矩阵变换搞得云里雾里。我于今年年初彻底重新学习OpenGL，目前来讲，应该算是入门了，至少矩阵变换是理解了，同时也会自己写一些简单的shader，可以进行OpenGL调试了。但是，我的学习之路才刚刚开始，我希望在我自己学习的过程，把有用的一些知识记录下来，方便自己和他人查阅。经过这次重新学习，我个人觉得，OpenGL真的没有那么难，只要你用心，就一定可以学会。当然，好的学习方法和好的学习资料肯定是会使之事半功倍的，希望接下来我的这些博文能为大家带来些许帮助。

在第一篇文章正式开始前，我谈下我自己的入门心得体会吧，而《如何学习OpenGL》这是个更大的话题，等我OpenGL水平精进之后，我再单独写一篇文章来谈谈我的看法。

目前来说，我的体会是“三要”和“三不要”。

要理解OpenGL渲染管线

要理解OpenGL是个状态机

要多动手实践。

当然还有最重要的“三不要”：

不要每天去群里问怎样最快能学好OpenGL

不要每天去看各种资料而不动手写一点代码

不要出了问题到处问，尝试先自己解决，实在解决不了再问

正文准备工作

首先，是创建一个新的工程(注意我这里使用的版本是3.1)。打开命令行工具，然后输入下列命令：

如果对于上述命令不了解的用户，请猛戳这里.

编译并运行成功，然后把HelloWorldScene.cpp里面的init函数修改成下面的样子：

此时，再编译运行之。你将会得到以下界面。

发送CustomCommand

由于Cocos2D-X 从3.0开始引入了一种新的渲染机制，所有的OpenGL渲染代码不再放到每一个node的draw函数里面，而是通过各种RenderCommand封装起来，然后添加到一个渲染队列里面去，最后在每一帧结束时把所有的这些命令都渲染出来。具体细节，大家可以参考这个文档.

OpenGL ES 2.0教程：你的第一个三角形(1)(opengl opengl es)

首先，打开HelloWorldScene.h，添加一个onDraw函数，一个CustomCommand成员变量，并且重载Layer的visit函数，代码如下：

然后我们实现这个visit函数：

这里要稍微解释一下。由于此函数是个重载的虚函数，所以我们在函数的最开始调用了父类的visit函数。如果你不调用父类的visit函数，那么当你往HelloWorldScene里面添加节点的时候，它们是不会被渲染出来的。（这个留给读者自己去完成）

然后，我们使用_globalZOrder和一个std::function来初始化CustomCommand。_globalZOrder会影响渲染的顺序，这个在后面的博文中再详细探讨。而std::function会在CustomCommand被render队列处理的时候被调用。最后我们把该CustomCommand添加到renderer里面去。

最后，让我们看看onDraw函数，它是整个绘制三角形的核心。

如果你现在直接运行程序，会crash。这是因为我们还没有指定Shader，所以下面的调用会失败：

接下来，让我们在HelloWorldScene.cpp的init方法中加入下列代码：

这个调用的含义是从Cocos2D-X的shader缓存中取出一个带有position和color顶点属性的shader，然后传给HelloWorld这个Layer.如果你是第一次接触OpenGL ES,看到这句话肯定无法理解，不过没有关系，后面的文章我们逐步讲清楚。如果你等不及，也可以先看我在文章最后推荐的链接。

接下来，运行一下程序.恭喜你，你的第一个漂亮的三角形完成啦，还算简单吧：）

本教程源代码下载。 Git仓库地址: attribute, uniform，vertex shader， fragment shader等内容。如果您对本文有什么建议或者意义，欢迎在下方评论。

写在最后

关于参考链接：所有的推荐阅读都是我精心挑选的，部分内容我自己看过，另外一些我也正在计划看。如果大家有好的资料，欢迎推荐给我。关于评论：请不要找我要电子书，所有的电子书都可以通过google找到。

另外，我推荐的资料大部分都是英文版，如果对英文不是很感冒的同学，可以看翻译的版本。

推荐阅读

网站：

3D programming

OpenGL ES 2.0 for Android

OpenGL ES 2.0 Programming Guide

Real-Time Rendering, Third Edition

Posted by 0owen May st, 3: pm cocos2d-x, opengl es