Android游戏开发之绘制游戏主菜单与进度条加载进度(十三)

150
回复
1271996
查看
  [复制链接]

249

主题

278

帖子

17

安币

初级码农

Rank: 1

发表于 2011-9-2 23:48:06 | 显示全部楼层 |阅读模式
带你走进游戏开发的世界之主菜单与进度条
本例中出现的资源图片全部源于互联网,本文仅供个人学习。

        由于Android开发 横竖屏的切换会给游戏开发造成非常麻烦的事情 所以在游戏的制作当中会强制手机屏幕横屏或者竖屏避免横竖屏切换造成的数据重置 即使让程序不在切换屏幕后调用onCreat()方法 也会带来屏幕自适应的麻烦 所以Android的游戏一般都会强制横屏或者强制竖屏。

强制横屏的方法
  1.         //强制为横屏
  2.         setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
复制代码
强制竖屏的方法
  1. //强制竖屏
  2.         setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
复制代码
后期的博文我会详细介绍 可以切换屏幕的情况下开发游戏和软件,废话不多说了。


1.游戏主菜单
        游戏中的菜单在游戏开发中虽然在程序员的眼力不是最难的开发难点但是它在玩家眼力确实很重要的一部分,因为任何一款游戏第一个进入玩家眼帘的就是游戏的主菜单,制作一个漂亮的界面对于游戏品质来说会提高很多。现在主流的游戏主菜单都是使用漂亮的背景加上一些动画效果而构成,今天雨松MOMO用自己写的一个Demo向大家介绍如何制作一个漂亮的游戏菜单。


Demo中这个游戏界面一共是又3个部件组成的
1.游戏背景图
2. 图片按钮 教学 与 设置,  在程序中须要对点击图片按钮进行事件的处理
3.动画效果 红框中的小鱼是一组游戏动画 ,从一进游戏菜单界面开始小鱼就从屏幕的右边向左边游让界面动了起来, 游戏菜单中可以多加一些这样的动画效果会使游戏界面活灵活现起来,给玩家一种视觉的冲击,游戏动画绘制的方法我已经在前几篇博客详细的说明 如果看到这里你还是不太清楚动画如何来绘制请阅读我前几篇帖子。

        为了方便使用图片按钮 所以我写了一个ImageButton类 专门来处理图片按钮的绘制以及监听,这个类是非常有存在必要的 用对象去处理 会比在代码中写死坐标点来处理方便很多可以更好地管理这些图片按钮。用户点击屏幕后程序只需要调用ImageButton成员方法IsClick() 根据返回值 就可以确定用户点击的范围是否在这个图片按钮中。
  1. public class ImageButton {
  2.   
  3.     /**按钮图片**/
  4.     private Bitmap mBitButton = null;
  5.    
  6.     /**图片绘制的XY坐标**/
  7.     private int mPosX =0;
  8.     private int mPosY =0;
  9.     /**图片绘制的宽高**/
  10.     private int mWidth =0;
  11.     private int mHeight =0;
  12.   
  13.     public ImageButton(Context context, int frameBitmapID, int x, int y) {
  14.         mBitButton = ReadBitMap(context,frameBitmapID);
  15.         mPosX = x;
  16.         mPosY = y;
  17.         mWidth = mBitButton.getWidth();
  18.         mHeight = mBitButton.getHeight();
  19.     }

  20.     /**
  21.      * 绘制图片按钮
  22.      * @param canvas
  23.      * @param paint
  24.      */
  25.     public void DrawImageButton(Canvas canvas, Paint paint) {
  26.         canvas.drawBitmap(mBitButton, mPosX, mPosY, paint);
  27.     }
  28.    
  29.     /**
  30.      * 判断是否点中图片按钮
  31.      * @param x
  32.      * @param y
  33.      */
  34.     public boolean IsClick(int x, int y) {
  35.         boolean isClick = false;
  36.         if (x >= mPosX && x <= mPosX + mWidth && y >= mPosY
  37.                 && y <= mPosY + mHeight) {
  38.             isClick = true;
  39.         }
  40.         return isClick;
  41.     }
  42.    
  43.     /**
  44.      * 读取图片资源
  45.      * @param context
  46.      * @param resId
  47.      * @return
  48.      */
  49.     public Bitmap ReadBitMap(Context context, int resId) {
  50.         BitmapFactory.Options opt = new BitmapFactory.Options();
  51.         opt.inPreferredConfig = Bitmap.Config.RGB_565;
  52.         opt.inPurgeable = true;
  53.         opt.inInputShareable = true;
  54.         // 获取资源图片
  55.         InputStream is = context.getResources().openRawResource(resId);
  56.         return BitmapFactory.decodeStream(is, null, opt);
  57.     }
  58. }
复制代码
2.游戏进度条的实现

        我相信读我博文的朋友 应该都玩过游戏吧, 进度条机制基本上是个游戏都有,要想做一个完全百分百以按读取进度比例的进度条就需要使用线程检测文件的读取进度来确定当前的进度信息,我觉得这么做完全没必要,纯属多余,而且基本上没有游戏公司这么做,为什么呢?我相信大家玩游戏的时候都会发现有时候进度条读取的很不均匀 比如说进度条从左边给右边走 在中间某一个点卡住了一小会儿,这就表明游戏的进度是通过读取文件结束以后才计算出来的,卡住的时候刚好是在读较多文件的时候。下面我向大家分享一下我在游戏开发中如何来计算进度信息。

       在读取进度的界面我会调用Loading()这个方法,每次调用mProgress 就会++  ,在switch 中就可以分布式读取资源,每个case中会加载 不同的资源 所以读取的时间是不一样的,读取的总数 和 当前读取mProgress的值 就  可以计算出进度的百分比值,最后根据计算出来的百分比在屏幕中显示进度信息。


我在强调一下下面代码中的sleep(200)须要替换成真正需要加载的资源,由于本例中没有大量的资源 所以我临时写成Sleep去等待 将进度显示在UI中。
  1.         public void Loading() {
  2.             // 这里应该是去读取资源, 由于没有大量的资源 这里我暂时只用线程去等待
  3.             try {
  4.                 switch (mProgress) {
  5.                 case 0:
  6.                     Thread.sleep(200);
  7.                     break;
  8.                 case 1:
  9.                     Thread.sleep(200);
  10.                     break;
  11.                 case 2:
  12.                     Thread.sleep(200);
  13.                     break;
  14.                 case 3:
  15.                     Thread.sleep(200);
  16.                     break;
  17.                 case 4:
  18.                     Thread.sleep(200);
  19.                     break;
  20.                 case 5:
  21.                     Thread.sleep(200);
  22.                     break;
  23.                 case 6:
  24.                     Thread.sleep(200);
  25.                     break;
  26.                 case 7:
  27.                     Thread.sleep(200);
  28.                     break;
  29.                 case 8:
  30.                     Thread.sleep(200);
  31.                     break;
  32.                 case 9:
  33.                     Thread.sleep(200);
  34.                     break;
  35.                 case 10:
  36.                     Thread.sleep(200);
  37.                     break;
  38.                 case 11:
  39.                     Thread.sleep(200);
  40.                     break;
  41.                 }
  42.                 mProgressBar = (100 / 12) * mProgress;
  43.                 mProgress++;
  44.             } catch (InterruptedException e) {
  45.                 // TODO Auto-generated catch block
  46.                 e.printStackTrace();
  47.             }
  48. }
复制代码
在Loading状态中实时监测mProgress的值, 未读取到100在UI中绘制进度信息,读取到100则修改游戏状态机状态 转跳读取成功界面。
  1.             /** 这里表示进度加载完成 **/
  2.             if (mProgressBar >= 100) {
  3.                 setGameState(GAME_TEACH);
  4.             }
复制代码

3.游戏状态机

       游戏状态机的实现方式的是通过变量来控制当前游戏状态,在游戏主线程中只更新绘制当前游戏状态下的内容,这就是游戏状态机的原理。
      下面的代码中一共有4个游戏状态 分别是 游戏菜单状态,读取进度状态,读取成功教学状态 ,游戏设置状态。在程序执行的过程中根据须要的时候去更改游戏状态。
  1.         protected void Draw() {
  2.             switch (mState) {
  3.             case GAME_MENU:
  4.                 /**计算鱼动画的X坐标向左超出屏幕后在还原保持一直在屏幕上游动**/
  5.                 mMenuAnimPosX-= 5;
  6.                 if(mMenuAnimPosX + MENU_ANIM_WIDTH <= 0) {
  7.                     mMenuAnimPosX = mScreenWidth;
  8.                 }
  9.                 /**绘制背景**/
  10.                 mCanvas.drawBitmap(mBitMenuBG, 0, 0, mPaint);
  11.                 mCanvas.drawBitmap(mBitMenuTitle, (mScreenWidth - mBitMenuTitle.getWidth()) >> 1,0, mPaint);
  12.                 mMenuAnim.DrawAnimation(mCanvas, mPaint, mMenuAnimPosX , 100);
  13.                
  14.                 /**绘制按钮**/
  15.                 mButtonTeach.DrawImageButton(mCanvas, mPaint);
  16.                 mButtonOption.DrawImageButton(mCanvas, mPaint);
  17.                
  18.                
  19.                 break;
  20.             case GAME_LOAD:
  21.                
  22.                 mCanvas.drawBitmap(mBitMenuBG, 0, 0, mPaint);
  23.                 mCanvas.drawBitmap(mBitMenuTitle, (mScreenWidth - mBitMenuTitle.getWidth()) >> 1,0, mPaint);
  24.                 mButtonTeach.DrawImageButton(mCanvas, mPaint);
  25.                 mButtonOption.DrawImageButton(mCanvas, mPaint);

  26.                 mCanvas.drawBitmap(mLoadBack, (mScreenWidth - mLoadBack.getWidth()) >> 1, mScreenHeight >> 1, mPaint);
  27.                 //这里计算进度条进度
  28.                 Loading();
  29.                 break;
  30.             case GAME_TEACH:
  31.                 mCanvas.drawBitmap(mBitTeach, 0, 0, mPaint);
  32.                 mCanvas.drawBitmap(mMomo, (mScreenWidth >> 1) - (mMomo.getWidth()>> 1), 20, mPaint);
  33.                
  34.                 String str1 = "欢迎光临雨松MOMO的博客 资源已经全部加载完成";
  35.                 drawRimString(mCanvas,str1,Color.BLACK,(mScreenWidth >> 1) - (((int)mPaint.measureText(str1)) >> 1), mScreenHeight >> 1);
  36.                 break;
  37.             case GAME_OPTION:
  38.                 mCanvas.drawBitmap(mBitTeach, 0, 0, mPaint);
  39.                 mCanvas.drawBitmap(mMomo, (mScreenWidth >> 1) - (mMomo.getWidth()>> 1), 20, mPaint);
  40.                 String str2 = "设置界面暂未 开放 雨松MOMO:xuanyusong@gmail.com";
  41.                 drawRimString(mCanvas,str2,Color.BLACK,(mScreenWidth >> 1) - (((int)mPaint.measureText(str2)) >> 1), mScreenHeight >> 1);
  42.                 break;
  43.             }
  44.         }
复制代码
如图:我们实现点击设置按钮 游戏状态机跳转到 游戏状态页面

      在拿到玩家触摸屏幕后的的X Y坐标 判断是否在游戏主菜单界面 点击设置按钮 状态机切换到GAME_OPTION 游戏设置界面。
  1.         public void UpdateTouchEvent(int x, int y) {
  2.             switch(mState) {
  3.             case GAME_MENU:
  4.                 if(mButtonTeach.IsClick(x, y)) {
  5.                    //教学图片按钮被按下
  6.                     setGameState(GAME_LOAD);
  7.                 }else if(mButtonOption.IsClick(x, y)) {
  8.                    //设置图片按钮被按下   
  9.                     setGameState(GAME_OPTION);
  10.                 }
  11.                 break;
  12.             }
  13.         }
复制代码
后期我还会详细介绍游戏状态机,今天只是先简单给大家介绍一下,希望孩童们快速跟进
老规矩每一篇博文都会附带我写的源代码,下面给出Demo源码的下载地

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

0

主题

380

帖子

715

安币

代码手工艺人

Rank: 4

发表于 2011-9-3 20:01:45 | 显示全部楼层
学习了~!

14

主题

361

帖子

204

安币

攻城狮

Rank: 3Rank: 3

发表于 2011-9-7 14:53:11 | 显示全部楼层
Android游戏开发之绘制游戏主菜单与进度条加载进度(十三)

0

主题

72

帖子

69

安币

程序猿

Rank: 2

发表于 2011-9-9 10:21:07 | 显示全部楼层
写的很好。不错。受教了了。呵呵

1

主题

25

帖子

12

安币

初级码农

Rank: 1

发表于 2011-9-13 13:27:24 | 显示全部楼层
写的很好,受益匪浅。

0

主题

21

帖子

0

安币

初级码农

Rank: 1

发表于 2011-9-14 10:12:26 | 显示全部楼层
谢谢楼主分享

0

主题

160

帖子

114

安币

程序猿

Rank: 2

发表于 2011-9-16 16:56:55 | 显示全部楼层
写的不错,谢谢楼主

0

主题

21

帖子

6

安币

初级码农

Rank: 1

发表于 2011-9-22 09:06:27 | 显示全部楼层
very good thank you
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

领先的中文移动开发者社区
18620764416
7*24全天服务
意见反馈:1294855032@qq.com

扫一扫关注我们

Powered by Discuz! X3.2© 2001-2019 Comsenz Inc.( 粤ICP备15117877号 )