读书人

寨子腾讯“爱消除”游戏7日教程-DAY3

发布时间: 2013-10-25 14:36:53 作者: rapoo

山寨腾讯“爱消除”游戏7日教程--DAY3

【课程内容】

今天课程的目的是设计一个棋盘,然后叠加上前天的动物素材。研究叠加后的效果。这是后续课程的基础。

【源代码下载地址】http://download.csdn.net/detail/elong_2009/6444923


1、棋盘设计

好了,有了前面两天课程的经验,我们很容易就能设计出如下效果的一个棋盘。后续我们会以此棋盘作为一个背景素材,逐渐在上面叠加各种各样的特效。

寨子腾讯“爱消除”游戏7日教程-DAY3

要实现交错的棋盘,有很多种方法,可以直接用OpenGL ES提供的绘图函数绘制,也可以采用我们一直使用的纹理贴图方式绘制。在这里,我们还是继续使用已经很熟悉的纹理贴图的方法。

2、DrawGrid 类

类似的,DrawGrid 类的核心方法还是公有的draw方法,在该方法中,我们循环调用drawBox私有方法实现棋盘的绘制。

public void draw(GL10 gl)

{

for(int i = 0; i < 7; i++)

{

for(int j = 0; j < 7; j++)

{

drawBox(gl, (i + j)%2, i, j);

}

}

}

drawBox 的实现在前面的课程中已经多次用到了,这里就不再罗嗦,大家直接看附件就行了。

3、叠加效果

前面提到,我们的设计思想是设计若干独立的渲染类DrawXxx,每个渲染类都完成独立的图像绘制或效果绘制。现在,我们将我们已经实现的DrawAnimal和DrawGrid叠加起来,看一看最后的效果。

在onDrawFrame 中加入以下代码,就可以看到如下的效果:

drawAnimal.draw(gl,1,0,3);

drawAnimal.draw(gl,2,1,3);

drawAnimal.draw(gl,3,2,3);

drawAnimal.draw(gl,4,3,3);

drawAnimal.draw(gl,5,4,3);

drawAnimal.draw(gl,6,5,3);

drawAnimal.draw(gl,7,6,3);

drawGrid.draw(gl);

寨子腾讯“爱消除”游戏7日教程-DAY3

您是否注意到了,在上图中,Animal对象完全覆盖了对应位置的Grid对象?虽然看起来效果也不差,但这并不是我们要求的最终效果。

我们希望Animal中的图案,不要遮挡棋盘的背景。

4、透明的素材

要实现透明的叠加效果,我们需要重新设计animal.png素材,将无关的地方设计为透明的。

用PhotoShop新建一个项目,注意背景内容要选择“透明”。

寨子腾讯“爱消除”游戏7日教程-DAY3

有套索工具把需要变成透明的部分抠出来。

寨子腾讯“爱消除”游戏7日教程-DAY3

寨子腾讯“爱消除”游戏7日教程-DAY3

最后加工后的图片效果图如下:

寨子腾讯“爱消除”游戏7日教程-DAY3

加工这个图片耗费了我近一个小时的时间,而最终的效果并不是最理想的。如果你想获得更佳的效果,那么在PhotoShop上您需要学习更多的技巧,并有足够的耐心。

5、透明的叠加效果

好了,素材准备好了,现在让我们来看看如何实现透明的叠加效果吧!

要实现透明的叠加效果,关键的地方是在onSurfaceCreated 中加入以下几行代码:

/*********以下为增加透明效果的代码***********/

/*透明效果对素材图片也有要求,要求图片的背景是透明的*/

gl.glEnable(GL10.GL_BLEND);

gl.glBlendFunc(GL10.GL_SRC_ALPHA, GL10.GL_ONE_MINUS_SRC_ALPHA);

gl.glEnable(GL10.GL_ALPHA_TEST);

gl.glAlphaFunc(GL10.GL_GREATER,0.1f);

/*********透明效果***********/

效果如下:

寨子腾讯“爱消除”游戏7日教程-DAY3

继续将DrawLoading叠加后的效果如下:

寨子腾讯“爱消除”游戏7日教程-DAY3

怎么样,看起来是不是很cool!这已经初步达到了我们要的效果。在后续的课程中,我们还会通过各个渲染类,叠加更多更丰富多彩的效果。

要设计出完美的游戏效果,归根结底就是精心设计每一个渲染类。就这么简单,你想明白了么?

6、介绍glAlphaFunc函数

public void glAlphaFunc(int func,float ref)

功能:

指定Alpha测试功能。

详细:

Alpha测试依据结果舍弃片段,该结果由引入片段的alpha值与参照值常量进行比较得到。glAlphaFunc指 定参照值与比较方法。只有当alpha测试有效时,比较才有用。使alpha测试有效或无效可以利用glEnable和glDisable方法,它们都是 以GL_ALPHA_TEST为参数的,alpha测试初始为无效。

func与ref指明像素被绘出的条件。引入的alpha值通过func指明的方法与ref指明的参照值进行比较。如果该值通过比较并且通过随后的模型测试与深度缓冲区测试,则将引入的片段绘出。如果该值未通过比较,则该像素区的帧缓冲区不会发生任何变化。比较方法如下:

GL_NEVER:不会通过。

GL_LESS:如果引入的alpha值比参照值小则通过。

GL_EQUAL:如果引入的alpha值与参照值相等则通过。

GL_LEQUAL:如果引入的alpha值小于或等于参照值则通过。

GL_GREATER:如果引入的alpha值比参照值大则通过。

GL_NOTEQUAL:如果引入的alpha值与参照值不相等则通过。

GL_GEQUAL:如果引入的alpha值大于或等于参照值则通过。

GL_ALWAYS:总是通过。(初始设定)

对所有的像素写入操作进行glAlphaFunc操作,包括那些从点、线、多边形的扫描转换得到的结果。glAlphaFunc对glClear无影响。

错误:

当func不是被允许的值会产生GL_INVALID_ENUM(错误枚举)。

参数:

func——指明alpha比较方法,被允许的符合常量有GL_NEVER, GL_LESS,GL_EQUAL, GL_LEQUAL, GL_GREATER, GL_NOTEQUAL, GL_GEQUAL, 和 GL_ALWAYS。初始值为GL_ALWAYS。

ref——指明与引入的alpha值比较的参照值,这个值的属于区间[0, 1],初始值为0。

读书人网 >移动开发

热点推荐