山寨腾讯“爱消除”游戏之奖励特效

【广而告之】山寨腾讯“爱消除”游戏已经正式入驻GitHub，项目地址是：https://github.com/3125788/CrazyLink

欢迎广大寨友一起来完善这个游戏。

山寨腾讯“爱消除”游戏7日教程已经告一段落，通过7日教程，我们的”疯狂消除“已经具备一定的可玩性。从今天开始，我们将陆续增加一些渲染特效，同时不断优化代码的算法。

奖励效果就是当玩家完成一次消除时，得到的奖励分数像气泡一样从消除区域升起，然后消失。

效果图如下：



1、渲染特效类 drawSingleScore

这次渲染用的纹理是动态根据得分生成的，动态生成bitmap的代码如下：

Bitmap genBitmap(int score)
{
		//生成的位图要带ALPHA通道信息，否则无法进行透明化处理
		Bitmap bitmap = Bitmap.createBitmap(mBitmapW, mBitmapH, Config.ARGB_4444);
		Canvas canvas = new Canvas(bitmap);

		Paint paint = new Paint();
		paint.setColor(Color.TRANSPARENT);
		/*以下代码等效于paint.setColor(Color.TRANSPARENT);
		paint.setColor(Color.BLACK);
                ColorMatrix cm = new ColorMatrix(new float[]{1,0,0,0,0,0,1,0,0,0,0,0,1,0,0,1,1,1,0,0});
                ColorMatrixColorFilter f = new ColorMatrixColorFilter(cm);
                paint.setColorFilter(f);
                */			
		canvas.drawRect(0, 0, canvas.getWidth(), canvas.getHeight(), paint);
		paint.setTextSize(mFontSize);	
		paint.setColor(Color.BLUE);
		String str = Integer.toString(score);			
		canvas.drawText(str, 20, 28, paint);	//书写的位置，根据具体情况可以调整一下			

		return bitmap;
}

注意：为了使多个渲染特效在一起工作时不互相覆盖，生成的bitmap背景应该是透明的，如果不设置成透明的，就会有一块黑块非常难看。

paint.setColor(Color.TRANSPARENT);

为了有气泡冒出的效果，我们通过修改顶点坐标数据实现：

private void initVertexBuffer(int col, int row)
    {
    	if (col == 0) col = 1;
    	
        vCount=6;//顶点的数量，一个正方形用两个三角形表示，共需要6个顶点
        float y = control.getY()/30.0f;
        float deltaX = ((col-3)*64*CrazyLinkConstent.UNIT_SIZE);
        float deltaY = (((float)row-3 + y)*64*CrazyLinkConstent.UNIT_SIZE);
        int vertices[]=new int[]//顶点坐标数据数组
        {
           	-mBitmapW/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaX,mBitmapH/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaY,0,
        	-mBitmapW/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaX,-mBitmapH/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaY,0,
        	mBitmapW/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaX,-mBitmapH/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaY,0,
        	mBitmapW/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaX,-mBitmapH/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaY,0,
        	mBitmapW/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaX,mBitmapH/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaY,0,
        	-mBitmapW/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaX,mBitmapH/2*CrazyLinkConstent.UNIT_SIZE+(int)deltaY,0
        };
        //创建顶点坐标数据缓冲
        //int类型占用4个字节，因此转换为byte的数据时需要*4
        ByteBuffer vbb = ByteBuffer.allocateDirect(vertices.length*4);
        vbb.order(ByteOrder.nativeOrder());		//设置本地的字节顺序
        //特别提示：由于不同平台字节顺序不同数据单元不是字节的一定要经过ByteBuffer
        //转换，关键是要通过ByteOrder设置nativeOrder()，否则有可能会出问题    	        
        mVertexBuffer = vbb.asIntBuffer();		//转换为int型缓冲
        mVertexBuffer.put(vertices);			//向缓冲区中放入顶点坐标数据
        mVertexBuffer.position(0);				//设置缓冲区起始位置
        return;
    }

动画效果的偏移量float y = control.getY()/30.0f;通过动态控制类ctlSingleScore提供。

当然，你也可以通过其他方法来实现动画效果，例如通过glTranslatef。

好了，今天就介绍到这里，详细的代码请通过 https://github.com/3125788/CrazyLink 获取。