8.6 代码集成（Integrating Our Changes） 这一章节最困难的部分已经完成，我们学习了如何使用基本的几何体组合成一些复杂的形体，同时相应的着色器也已经更新了。下一步是把前面的修改集成到AirHockeyRenderer中，同时我们还会学习如何通过添加view矩阵以反映OpenGL中一个比较重要的概念Camera。 但是为什么我们还需要添加另外一个矩阵呢？我们...

8.5 更新着色器（Updating Shaders） 我还需要更新相应的着色器，我们之前使用atrribute类型属性定义了球棍或者冰球的顶点坐标，这里我们将会使用uniform类型定义相应的颜色，现在在ShaderProgram中加入一个新的常量，如下代码：//AirHockeyWithImprovedMallets/src/com/airhockey/android/prog...

8.4 更新相应类（Updating Our Objects） 现在我们已经有了一个ObjectBuilder对象，时候更新Mallet类了因为我们不再把它画成一个点了。我们还需要增加新类Puck，在相同包下面新建类Puck，并添加如下代码：//AirHockeyWithImprovedMallets/src/com/airhockey/android/objects/Puck.j...

8.3构造形体（AddinganObjectBuilder） 现在开始创建我们的构建者类，在包com.airhockey.android.objects中创建类ObjectBuilder，并添加如下代码：//AirHockeyWithImprovedMallets/src/com/airhockey/android/objects/ObjectBuilder.java...

8.2 定义形体（Adding a Geometry Class） 我们现在已经明确的知道需要些什么去构建冰球及球棍；为了构建冰球，我们使用triangle fan命令构建冰球的顶部，再使用triangle strip构建冰球的边缘；为了构建球棍，我们需要使用两个triangle fan及两个triangle strip；为了使得构建这些形体变得更容易，我们将会增加一个定义基本形体的Ge...

8.1 三角形绘制（Combining Triangle Strips and Triangle Fans） 在开始构建球棍或者冰球之前，我们可以站在一个更高的角度上来想象下，一个冰球可以使用一个扁平的圆柱来构建，如下图所示： 而对于球棍则稍微复杂些，可以使用两个圆柱来构建，把其中一个放在另外一个上面，如下图所示： 我知道你在想什么，一个真实的球棍并不是两个...

我们的空气曲棍球项目已经捣鼓好久了，现在绘制出来的桌面也是呈现出了一个好视角并且配合纹理映射后看起来更好了；然而由于球棍只是一个点所以看起来并不像真正的球棍，你能想象下使用像一个点一样的球棍打球会是什么样的体验吗？很多应用程序都是通过组合简单的形体来绘制一些复杂的物体，在这一章里面我们将学习如何使用简单的形体绘制一个更好的球棍。 现在的应用里面还缺少一种简单的方法去放置、旋转及移动...

7.6 绘制纹理（Drawing Our Texture） 现在我们已经把顶点数据与操作顶点数据的类解耦，接下来修改下render类以绘制纹理；打开AirHockeyRenderer并把除了onSurfaceChanged()以外的其它都部分删除，并添加如下的成员与构造函数：//AirHockeyTextured/src/com/airhockey/android/AirHocke...

7.5增加着色器程序类（AddingClassesforOurShaderPrograms） 这一部分将会针对纹理着色器及颜色着色器创建两个不同的类，我们将会使用纹理着色器程序绘制桌面，使用着色器程序绘制小球；同时我们将会建立一个基类以便复用一些相同的功能函数，因为现在中心分隔线已经是纹理的一部分了所以并不需要考虑绘制；如下图是即将要创建的类结构： 现在在...

7.4 创建新类结构（Creating a New Class Structure for Our Vertex Data） 首先我们将会建立不同的类，每个类代表一个物理实体；其中一个类代表桌面，另一个代表小球，中心线则不需要，因为在纹理图片中已经包含了。 我们还会专门创建一个类包装实际的顶点数据并减少代码重复，最终的类结构将会如下： 我们将会创建类Mallet管理...

7.3 创建新着色器（Creating a New Set of Shaders）    在我们把纹理绘制到屏幕上之前，我们还需要创建一些着色器，这些着色器将会接收纹理图片数据然后把这些数据应用到将会绘制的片元上去；这些着色器与之前我们使用的着色器类似，为了支持纹理稍微变动了下而已。7.3.1 创建顶点着色器（Creating the New Vertex Shader）    在目录...

7.2 加载纹理（Loading Textures into OpenGL）首先我们需要把图片文件数据加载到OpenGL中，在com.airhockey.android.util包中创建类TextureHelper，并添加如下签名的函数：//AirHockeyTextured/src/com/airhockey/android/util/TextureHelper.javapubli...

7.1 理解纹理（Understanding Textures）    在OpenGL中纹理可以用来代表图形、图像或者程序生成的数据，每一个二维的纹理都是由我们之前讨论过的类似于片元或者像素的许多的像素元素组成，最普通的使用纹理的方法是直接从文件中加载一个图像。    我们将会使用如下所示的一张图片作为纹理并显示为桌面的表面。    这里推荐把纹理图片储存在项目的目录/res/dra...

在前面的章节中我们都是使用简单的形体配合颜色都行绘制，这好像缺失了什么，想象下如果我们可以在形体上添加一些更细致的信息呢？就像艺术家一样，我们可以一开始用简单的颜色绘制一些基础形状，然后使用纹理映射添加额外的信息的形体表面；纹理就是一个已经加载到OpenGL中的简单图形或者图像。 使用纹理映射可以添加一些难以想象的细节，想象下你最近玩过的3D游戏，就像其他的3D游戏一样最核心的也仅...

6.8 增加旋转(Adding Rotation)    前面我们使用投影矩阵配合模型矩阵把桌面移入了我们的视野，现在我们要做的是给桌面增加一个旋转角度使得桌面看上去有一个角度以便增加立体感。使用旋转矩阵我们只需要一行代码就可以实现这个目的，由于之前我们还没有使用过旋转，这里先来学习下与矩阵旋转相关的知识。6.8.1 旋转方向（The Direction of Rotation）   ...

6.7 使用投影矩阵(Switching to a Projection Matrix)    我们现在开始使用透视投影矩阵，打开AirHockeyRenderer并且移除onSurfaceChanged()方法中除了调用glViewport()的所有代码。添加如下代码：//AirHockey3D/src/com/airhockey/android/AirHockeyRenderer.j...

6.6 创建一个投影矩阵（Creating a Projection Matrix in Our Code）    现在准备在我们的项目中加入透视投影，Android的Matrix类中的方法frustumM()及perpectiveM()可以实现这一点；不幸的是frustumM()有一一个bug影响某些类型的投影，perspectiveM()仅仅在Android版本代号为Ice Cream S...

6.5 定义一个透视投影（Defining a Perspective Projection）    透视投影矩阵需要与透视分割配合才能构造出3D效果，投影矩阵并没有透视分割的能力，透视分割也需要其它因素一起配合工作。    在透视投影中物体应该是向屏幕中心移动并且当距离我们越来越远的时候物体也会变得越来越小；因此投影矩阵的主要目标就是产生一个合适的w值，这样的话当OpenGL做透视分割的时...

6.4 创建透视投影（Moving to a Perspective Projection）    在学习透视投影背后的矩阵运算之前，我们先来看看一个例子。在前一章节中，我们使用正交投影来适配视口在进行规范化之前的坐标。    下图是一个正交投影的例子，正方体中的场景正是正交投影的效果，OpenGL在进行渲染的时候里面的内容就会被渲染到视口上，这些就是我们所有能看到的东西。    ...

6.3 使用w分量创建透视效果（Adding the W Component to Create Perspective）    假如我们能在实践中看到w分量的效果，那么就能够更容易理解w分量的作用，因此我们把它加入到桌面顶点数据中并看看会产生什么效果。因为对于一个顶点我们将会指定x、y、z、w四个分量，因为我们将按照如下代码更新变量POSITION_COMPONENT_COUNT 的值：...

6.2 顶点转换（Transforming a Coordinate from the Shader to the Screen）    我们现在已经熟悉了规范化设备坐标，我们也知道显示在屏幕上的顶点的x、y、z坐标必须位于[-1, 1]之间，现在我们来复习下着色器设置的坐标gl_Position如何转换为最终显示到屏幕上的坐标。如下图所示：    这里有两个转换步骤及三个坐标空间。...

6.1 3D的艺术（The Art of 3D）    几个世纪以来，艺术家们通过他们特殊的技巧在2D的纸张上画出3D场景，其实他们只是使用了线性映射这样一种技术而已，想像下一些平行的直线，当你从一端看去的时候会发现他们汇集并消失在远端，这就是一种透视的效果，如下图所示：    在现实中，火车轨道就是这种效果的一个典型例子，想像你站在火车轨道前面并看向火车轨道远方，你会发现两个轨道之...

    想象你在一个电玩城中，站在空气曲棍球台桌面前面，向桌面的远方看去；此时从你的角度看去，桌面将会是什么样子呢？桌面靠近你的那端看上去会比较大，而且你是从一个角度去看而不是从桌面的正上方。毕竟没有人会站在桌面上方打球且垂直的向下看。    OpenGL在渲染2D方面非常棒，但是当我们开始进入3D的时候OpenGL才真正表现出它闪光的地方。在这一章节里我们将学习如何进入到3维的情况。    ...

5.5 增加正侧投影（Adding an Orthographic Projection）    现在我们可以在项目中添加正交投影并且修复桌面压缩的问题了。5.5.1 更新着色器（Updating the Shader）    首先是更新着色器以便使用我们提供的矩阵对顶点位置进行变换，如果你还没有打开项目AirHockeyOrtho，那现在打开并按照如下代码更新着色器simple_ve...

5.4 定义正侧投影（Defining an Orthographic Projection）    我们使用包android.opengl 下面的Matrix类定义一个正侧投影，在Matrix中有一个方法orthoM()将会为我们生存一个正侧投影矩阵，在这里我们将会使用这个投影来改变坐标空间，正如我们将会看到的，一个正侧投影矩阵与平移矩阵非常像。   下面来仔细看看orthoM()的方法参...

5.3 线性代数基础（Linear Algebra 101）    在OpenGL中向量和矩阵用的非常多，其中一个非常重要的应用就是设置正交投影和透视投影。使用矩阵进行投影你只需要做一些矩阵的加法与乘法，而且现代GPU是非常善于做这类工作。    现在让我们简单回忆下相关的一些基础，假如你不记得了、记性不好或者压根没有学过相关课程，那也不用担心；这里将会学习一些矩阵基础计算，一旦你理解了这些...

5.2 虚拟坐标系（Working with a Virtual Coordinate Space）    为了适配屏幕旋转的情况，我们需要调整之前使用的坐标空间，如何调整呢？那就是不能直接使用规范化设备坐标而是需要调整会使用虚拟坐标空间。为了使用OpenGL能够正确的进行渲染，我们需要找一种把虚拟坐标空间转换到规范化坐标空间的方法。而为了使用我们的球台桌面的竖屏与横屏情况下都得到正确的显示，...

5.1 屏幕比例问题（We Have an Aspect Ratio Problem）    现在我们知道在OpenGL里面所有渲染的东西在x轴及y轴上都限制在[-1，+1]范围内，z轴上也存在同样的限制。在这个范围内的坐标有一个特殊的称呼：规范化坐标空间，同时独立于屏幕的大小和形状。不幸的是因为独立于实际屏幕尺寸，假如我们直接使用这些坐标那将会产生一些问题，比如横屏模式下的挤压问题。   ...

    你也许你还没注意到，但是我们现在的应用有一个屏幕比例问题。你可以运行上一章中的应用然后旋转屏幕，在竖屏模式下如图1所示，横屏模式如图2所示：图 1 （横屏模式）图 2 （竖屏模式）   桌面在横屏模式下产生了挤压，原因是我们直接把坐标传递给了OpenGL，而没了考虑屏幕比例。每一个2D和3D应用都有一个共同问题，那就是如何决定在屏幕上显示什么及如何根据屏幕尺寸进行显示...

4.4 使用新的颜色进行渲染（Rendering with the New Color Attribute）    现在我们已经在顶点数据中增加了一个颜色属性数据并且已经更新了相应的顶点着色器及片元着色器，下一步是移除老的使用uniform类型数据进行绘制的代码并且告诉OpenGL使用顶点属性颜色进行绘制。4.4.1 更新常量（Updating Constants）    在Air...

4.3 增加新的颜色属性（Adding a New Color Attribute）我们已经通过加入中心点更新了我们桌面顶点结构，现在可以对每个顶点增加一个颜色属性了，现在更新到到整个顶点数组，如下代码所示：//AirHockey2/src/com/airhockey/android/AirHockeyRenderer.javafloat[] tableVerticesWithTria...

4.2 引入Triangle Fans（Introducing Triangle Fans）    在新的顶点结构中，中心处将会有一个顶点坐标，这样的话绘制矩形就必须采用四个三角形而不是两个了。我们把新的中心点放置在点（0，0）处。现在打开AirHockeyRenderer.java，并将三角形顶点坐标更新为如下：//AirHockey2/src/com/airhockey/androi...

4.1 平滑着色（Smooth Shading）在第二章中，我们学习了如何使用uniform类型变量定义要绘制的三角形的颜色，如下图所示：我们已经知道OpenGL只支持绘制点、线、三角形的命令，如果我们想要绘制其它形状那只能从这三种形状组合而成。由于我们只能绘制这三种图元，我们如何使用多种不同的颜色和着色器绘制出一个复杂的场景呢？有一种方法是使用大量的三角形进行绘制，而每一个三角...

由于后面的章节篇幅比较大点，所以我们会把每一章单独分成几篇文章来写（后面将采用这种模式，除非篇幅比较小）。在实际中，每个物体都会有不同的颜色；比如我们的家里面的墙壁，它都是使用同一种颜色进行粉刷的，但如果我们从不同的角度去看，就会发现有些地方比较明亮有些地方比较暗，问题的关键在于墙壁与环境光的角度问题。我们的大脑使用这些细微的差别进行合成视觉曲线进而表达我们所看到的东西，艺术家们很早就使用这种...

Chpater 3 编译着色器并绘制到屏幕上（Compiling Shaders and Drawing to the Screen） 这上章将在上章的基础上进行学习，在这里一章首先学习如何编译、链接我们已经定义好的着色器并得到一个OpenGL着色器程序，然后我们利用这个着色器程序把我们的球台桌面绘制到屏幕上。 现在打开AirHockey1，然后在上章的基础上继续完善我们的程序...

上一章节简单介绍了OpenGL ES 2.0开发的简单入门知识，实际上你学没有真正进入OpenGL ES 2.0的世界，从这一章开始将会一步步的带着你开始你的OpenGL ES 2.0实战之旅，这里会最终会实现一个“空气曲棍球”的实例，学习完这一阶段的教程，你将了解如何绘制常规的几何图形，如三角形、四边形、正方体、球体，什么是顶点着色器，什么是片元着色器，如何进行纹理贴图。下面正式进入主题。...

1.Install the tools开发工具：AndroidStudio。设备：支持OpenGL ES2.0的一台真机，系统至少API10（Android2.3.3，Gingerbread）2 Create our first program 现在我们的开发工具已经安装并且已经配置好，现在我们开始创建第一个OpenGL程序。这个程序很简单：它的功能功能仅仅是初始化Op...