大家在玩游戏的时候应该有时候会发现在切换游戏场景的时候 界面会播放一段非常好看的动画 比如一个百叶窗的形式关闭界面 然后在打开界面 效果非常好看 用户体验也非常好，今天我向大家解读游戏开发中常用的四种切换场景的特效动画。

　　下面游戏界面中 红框内标识了4个图片按钮 分别点击这4个按钮会分别播放4组切换场景的特效动画。

Android游戏开发教程之九：场景特效

　　1. 交叉相合动画

　　如图所示 左右两边分别以若干个矩形以交替相合的形式合并 控制屏幕关闭

Android游戏开发教程之九：场景特效

　　通过两个for循环 1 3 5 7 9 绘制屏幕左方矩形 2 4 6 8 10 绘制屏幕右放矩形 在游戏更新中计算矩形移动的坐标  然后左边的矩形 分别向右延伸 右边的矩形分别向左延伸  这样就可以实现矩形的交叉合并动画。

Java代码
  1. /**交错的实现矩形相交**/  
  2. int count = (mScreenHeight / RANDOM_TYPE_2_RANGE);  
  3. for (int i = 0; i < count; i += 2){  
  4.                   drawFillRect(mCanvas, Color.BLACK, 0, i * RANDOM_TYPE_2_RANGE, s_effRange, RANDOM_TYPE_2_RANGE);  
  5. }  
  6. for (int i = 1; i < count; i += 2){  
  7.                   drawFillRect(mCanvas, Color.BLACK, mScreenWidth - s_effRange, i * RANDOM_TYPE_2_RANGE, s_effRange, RANDOM_TYPE_2_RANGE);  
  8. }  

　　绘制矩形的方法

Java代码
  1. /** 
  2.  * 绘制一个矩形 
  3.  * @param canvas 
  4.  * @param color 
  5.  * @param x 
  6.  * @param y 
  7.  * @param w 
  8.  * @param h 
  9.  */  
  10. public void drawFillRect(Canvas canvas, int color, int x, int y, int w, int h) {  
  11.     int backColor = mPaint.getColor();  
  12.     mPaint.setColor(color);  
  13.     canvas.drawRect(x, y, x + w, y + h, mPaint);  
  14.     mPaint.setColor(backColor);  
  15. }  

　　2. 扇形合并动画

　　如图所示以扇形的转圈的形式来控制屏幕关闭

Android游戏开发教程之九：场景特效

　　在游戏更新中一直更新扇形绘制的区域 根据绘制区域的参数将扇形绘制出来 实现扇形合并的动画效果。

Java代码
  1. //rectf为扇形绘制区域 为了让扇形完全填充屏幕所以将它的区域扩大了100像素  
  2. RectF rectf = new RectF(- RANDOM_TYPE_3_RANGE, - RANDOM_TYPE_3_RANGE,mScreenWidth+RANDOM_TYPE_3_RANGE,mScreenHeight + RANDOM_TYPE_3_RANGE);  
  3. //将扇形绘制出来  
  4. drawFillCircle(mCanvas, Color.BLACK,rectf,0,s_effRange,true);  

　　绘制扇形的方法

Java代码
  1. /** 
  2.  * 绘制一个扇形 
  3.  * @param canvas 
  4.  * @param color 
  5.  * @param oval 
  6.  * @param startAngle 
  7.  * @param sweepAngle 
  8.  * @param useCenter 
  9.  */  
  10. public void drawFillCircle(Canvas canvas, int color, RectF oval, int startAngle, int sweepAngle, boolean useCenter) {  
  11.     int backColor = mPaint.getColor();  
  12.     mPaint.setColor(color);  
  13.     canvas.drawArc(oval, startAngle, sweepAngle, useCenter, mPaint);  
  14.     mPaint.setColor(backColor);  
  15. }  

　　3. 百叶窗合并动画

　　如图所示 屏幕中若干的矩形慢慢放大的形式关闭游戏屏幕

Android游戏开发教程之九：场景特效

　　在屏幕中用双for循环绘制出若干的矩形 在游戏更新中更新矩形绘制的宽与高 直到将屏幕完全填充。这样就可以实现游戏百叶窗合并动画的效果啦。

Java代码
  1. /**百叶窗效果利用双for循环 修改每个矩形绘制的宽度**/  
  2. for (int i = 0; i <= (mScreenWidth / RANDOM_TYPE_0_RANGE); i++) {  
  3.     for (int j = 0; j <= (mScreenHeight / RANDOM_TYPE_0_RANGE); j++) {  
  4.     drawFillRect(mCanvas, Color.BLACK, i* RANDOM_TYPE_0_RANGE, j * RANDOM_TYPE_0_RANGE,  
  5.         s_effRange, s_effRange);  
  6.     }  
  7. }  

　　4. 滚动水纹矩形合并动画

　　如图所示 利用矩形的滚动实现水纹向右关闭游戏屏幕效果。

Android游戏开发教程之九：场景特效

　　大家仔细观察上图这个动画效果 其实就是4个矩形 从右到左 前3个矩形的大小是固定的中间的间隙也是固定的 最左边的矩形才为真正关闭屏幕的矩形 更新游戏界面时 4个矩形同时向右方移动 前3个只移动坐标 最后一个才是真正填充的矩形。这样就可以实现滚动的水纹的效果了。

Java代码
  1. /**水纹效果其实绘制了4个矩形 中间留一些缝隙 **/  
  2. drawFillRect(mCanvas, Color.BLACK, 0, 0, s_effRange, mScreenHeight);  
  3. drawFillRect(mCanvas, Color.BLACK, s_effRange + RANDOM_TYPE_1_SPACE1, 0, RANDOM_TYPE_1_RANGE1, mScreenHeight);  
  4. drawFillRect(mCanvas, Color.BLACK, s_effRange + RANDOM_TYPE_1_SPACE2, 0, RANDOM_TYPE_1_RANGE2, mScreenHeight);  
  5. drawFillRect(mCanvas, Color.BLACK, s_effRange + RANDOM_TYPE_1_SPACE3, 0, RANDOM_TYPE_1_RANGE3, mScreenHeight);  

　　这样4个动画效果已经介绍完毕， 下面我将一些重要的代码贴上。

　　根据特效的状态 进行绘制特效

Java代码
  1.        /**绘制特效**/  
  2. public void RenderEffect() {  
  3.     switch (s_effectType) {  
  4.     case RANDOM_EFFECT_TYPE_SQUARE:  
  5.     /**百叶窗效果利用双for循环 修改每个矩形绘制的宽度**/  
  6.     for (int i = 0; i <= (mScreenWidth / RANDOM_TYPE_0_RANGE); i++) {  
  7.         for (int j = 0; j <= (mScreenHeight / RANDOM_TYPE_0_RANGE); j++) {  
  8.         drawFillRect(mCanvas, Color.BLACK, i* RANDOM_TYPE_0_RANGE, j * RANDOM_TYPE_0_RANGE,  
  9.             s_effRange, s_effRange);  
  10.         }  
  11.     }  
  12.     break;  
  13.     case RANDOM_EFFECT_TYPE_SHADOW:  
  14.     /**水纹效果其实绘制了4个矩形 中间留一些缝隙 **/  
  15.     drawFillRect(mCanvas, Color.BLACK, 0, 0, s_effRange, mScreenHeight);  
  16.     drawFillRect(mCanvas, Color.BLACK, s_effRange + RANDOM_TYPE_1_SPACE1, 0, RANDOM_TYPE_1_RANGE1, mScreenHeight);  
  17.     drawFillRect(mCanvas, Color.BLACK, s_effRange + RANDOM_TYPE_1_SPACE2, 0, RANDOM_TYPE_1_RANGE2, mScreenHeight);  
  18.     drawFillRect(mCanvas, Color.BLACK, s_effRange + RANDOM_TYPE_1_SPACE3, 0, RANDOM_TYPE_1_RANGE3, mScreenHeight);  
  19.     break;  
  20.   
  21.     case RANDOM_EFFECT_TYPE_CROSS:  
  22.                /**交错的实现矩形相交**/  
  23.     int count = (mScreenHeight / RANDOM_TYPE_2_RANGE);  
  24.     for (int i = 0; i < count; i += 2){  
  25.                    drawFillRect(mCanvas, Color.BLACK, 0, i * RANDOM_TYPE_2_RANGE, s_effRange, RANDOM_TYPE_2_RANGE);  
  26.                }  
  27.                for (int i = 1; i < count; i += 2){  
  28.                    drawFillRect(mCanvas, Color.BLACK, mScreenWidth - s_effRange, i * RANDOM_TYPE_2_RANGE, s_effRange, RANDOM_TYPE_2_RANGE);  
  29.                }  
  30.     break;  
  31.   
  32.     case RANDOM_EFFECT_TYPE_SECTOR:  
  33.     //rectf为扇形绘制区域 为了让扇形完全填充屏幕所以将它的区域扩大了100像素  
  34.     RectF rectf = new RectF(- RANDOM_TYPE_3_RANGE, - RANDOM_TYPE_3_RANGE,mScreenWidth+RANDOM_TYPE_3_RANGE,mScreenHeight + RANDOM_TYPE_3_RANGE);  
  35.     //将扇形绘制出来  
  36.     drawFillCircle(mCanvas, Color.BLACK,rectf,0,s_effRange,true);  
  37.     break;  
  38.   
  39.     }  
  40. }  

　　在播放动画的时候须要更新游戏特效 主要是用来更新特效绘制的参数 根据时时更新的参数在绘制中让特效动画动起来。

Java代码
  1. /**更新特效**/  
  2. ublic void UpdataEffectRange(int range) {  
  3.    if (s_effRange < s_effectRangeTarget) {  
  4. s_effRange += range;  
  5. if (s_effRange > s_effectRangeTarget) {  
  6.     s_effRange = s_effectRangeTarget;  
  7. }  
  8. } else if (s_effRange > s_effectRangeTarget) {  
  9. s_effRange -= range;  
  10. if (s_effRange < s_effectRangeTarget) {  
  11.     s_effRange = s_effectRangeTarget;  
  12. }  
  13. }  

　　通过点击图片按钮来设置播放特效的类型 在这里初始化当前需要播放的 特效绘制的相关参数。

Java代码
  1. /**设置播放特效类型**/  
  2. public void SetCurtainEffect(int type) {  
  3.     s_effectType = type;  
  4.     switch (s_effectType) {  
  5.     case RANDOM_EFFECT_TYPE_SQUARE:  
  6.     s_effRange = 0;  
  7.     s_effectRangeTarget = RANDOM_TYPE_0_RANGE;  
  8.     break;  
  9.     case RANDOM_EFFECT_TYPE_SHADOW:  
  10.     s_effRange = EFFECT_RANGE_PERFRAME_1;  
  11.     s_effectRangeTarget = mScreenWidth;  
  12.     break;  
  13.     case RANDOM_EFFECT_TYPE_CROSS:  
  14.     s_effRange = 0;  
  15.     s_effectRangeTarget = mScreenWidth;  
  16.     break;  
  17.     case RANDOM_EFFECT_TYPE_SECTOR:  
  18.     s_effRange = 0;  
  19.     s_effectRangeTarget = 360;  
  20.     break;  
  21.     }  
  22.     setGameState(GAME_EFFECT);  
  23. }  

　　最后如果你还是觉得我写的不够详细，看的不够爽，不要紧我把源代码的下载地址贴出来，欢迎大家一起讨论学习，希望可以和大家一起进步。

　　下载地址：http://vdisk.weibo.com/s/aadp0

本文发布：Android开发网
本文地址：http://www.jizhuomi.com/android/game/526.html
2016年1月13日
发布:鸡啄米 分类:Android游戏开发 浏览: 评论:0