Android游戏开发之地图编辑器的使用以及绘制地图 (四)

Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第1张图片

Mappy中文地图编辑器的使用说明

下载地址:  Mappy地图编辑器.rar (938.58 KB, 下载次数: 2757) 

        压缩包中包含 游戏地图编辑器使用指南 与地图资源图片 宫院1.png 一张 mapwin.exe 可执行文件 map.FMP 与map.TXT为使用编辑器生成出来的保存文件与地图数组。
Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第2张图片

解压后打开地图编辑器 mapwin.exe.exe 创建一张新的地图。
Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第3张图片

由于我用的Android模拟器宽高是320X480
地图宽的块数 就是 320 / 32 = 10
地图高的块数 就是 480 / 32 = 15
Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第4张图片

这里扩充一下 实际在工作开发中因为手机的分辨率各式各样 所以是需要尺寸考虑自适应的 有两种方法可以拿到当前手机屏幕的宽高
  1.   Display display = getWindowManager().getDefaultDisplay();
  2.   Log.i("view" , "height:" +display.getHeight());
  3.   Log.i("view" , "width:" +display.getWidth());
  4.   DisplayMetrics displayMetrics = getResources().getDisplayMetrics();
  5.   Log.i("view" , "height" +displayMetrics.heightPixels);
  6.   Log.i("view" , "width" +displayMetrics.widthPixels);
复制代码
弹出框后点击确定

导入地图图块 编辑器下载地址中包含了一张 地图图片 可以选择使用
因为编辑器是须要美术图片配合使用的 比如tile的尺寸 图片的宽高尺寸必需能被整除。
Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第5张图片

导入地图图块成功 右侧为导入的地图资源 接下来就是自己拖动右侧地图块拼出自己想要的地图了。
Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第6张图片

接下来我将填充3个图层 最底层 实体层 物理层 我会一一介绍他们的作用

图层0为最底层 绘制地图先绘制这一层
Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第7张图片

图层1为实物层 这一层主要绘制一些actor 绘制完第一层在绘制这一层
Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第8张图片

图层2为物理层检测物理碰撞这一层不用绘制但是玩家每移动一次就须要以玩家当前点在地图数组中的角标 和物理层做判断是否碰撞,它和Actor层的位置一样。
Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第9张图片

拼地图的使用技巧 编辑新图层的时候可以把上一个涂层打开进行对比编辑。 
这样子就可以根据0图层的信息来编辑图层1
Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第10张图片

       地图块拼完后编辑完成后点击保存文件 后在点击保存文本数据  地图数组文件就生成出来了 文件命为map.TXT 里面就存着我们编辑的3个地图层的地图信息。
Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第11张图片

使用Mappy中文地图编辑器生成的地图信息数组来绘制游戏地图


效果图如下
Android游戏开发之地图编辑器的使用以及绘制地图 (四)_第12张图片



代码实现

这里我先说一下游戏窗口的全屏实现方法  
第一种
  1.         // 全屏显示窗口
  2.         requestWindowFeature(Window.FEATURE_NO_TITLE);
  3.         getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
复制代码
第二种 AndroidManifest.xml 中加入
  1.        
  2.                           android:theme="@android:style/Theme.NoTitleBar.Fullscreen" />
复制代码
这里我详细说一下编辑器生成出来的数组怎么用?就拿生成出来的ID 137为例  假设 tile的宽高为32 137表示从图片的左上角从左到右从上到下 数到第137个tile 就是我们须要绘制的tile   
绘制方面利用 clipRect方法来剪裁图片 实现绘制 下一章我讲游戏中的摄像头机制 会详细介绍这一点。
  1. public class mapAcitvity extends Activity {

  2.     @Override
  3.     public void onCreate(Bundle savedInstanceState) {
  4.         super.onCreate(savedInstanceState);
  5.         // 全屏显示窗口
  6.         requestWindowFeature(Window.FEATURE_NO_TITLE);
  7.         getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
  8.         //显示自定义的游戏View
  9.         setContentView(new MapView(this));
  10.     }
  11.     
  12.     
  13.     public class MapView extends View{

  14.         //tile块的宽高
  15.         public final static int TILE_WIDTH = 32;
  16.         public final static int TILE_HEIGHT = 32;
  17.         
  18.         //tile块的宽高的数量
  19.         public final static int TILE_WIDTH_COUNT = 10;
  20.         public final static int TILE_HEIGHT_COUNT = 15;
  21.         
  22.         //数组元素为0则什么都不画
  23.         public final static int TILE_NULL = 0;
  24.         //第一层游戏View地图数组
  25.         public int [][]mMapView = {
  26.                 { 1, 1, 1, 1, 137, 137, 137, 1, 1, 1 },
  27.                 { 1, 1, 1, 1, 137, 137, 137, 1, 1, 1 },
  28.                 { 1, 1, 1, 1, 137, 137, 137, 1, 1, 1 },
  29.                 { 137, 137, 137, 137, 137, 137, 137, 137, 137, 137 },
  30.                 { 137, 137, 137, 137, 137, 137, 137, 137, 137, 137 },
  31.                 { 1, 1, 1, 1, 1, 1, 1, 1, 137, 137 },
  32.                 { 1, 1, 1, 1, 1, 1, 1, 1, 137, 137 },
  33.                 { 1, 1, 1, 1, 1, 1, 1, 1, 137, 137 },
  34.                 { 1, 1, 1, 1, 1, 1, 1, 1, 137, 137 },
  35.                 { 1, 1, 1, 1, 1, 1, 1, 1, 137, 137 },
  36.                 { 1, 1, 1, 1, 1, 1, 1, 1, 137, 137 },
  37.                 { 137, 137, 137, 137, 137, 137, 137, 137, 137, 137 },
  38.                 { 137, 137, 137, 137, 137, 137, 137, 137, 137, 137 },
  39.                 { 1, 1, 1, 1, 1, 137, 137, 137, 1, 1 },
  40.                 { 1, 1, 1, 1, 1, 137, 137, 137, 1, 1 }
  41.                 };

  42.         //第二层游戏实体actor数组
  43.         public int [][]mMapAcotor  = {
  44.                 { 102, 103, 103, 104, 0, 0, 0, 165, 166, 167 },
  45.                 { 110, 111, 111, 112, 0, 0, 0, 173, 174, 175 },
  46.                 { 126, 127, 127, 128, 0, 0, 0, 181, 182, 183 },
  47.                 { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
  48.                 { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
  49.                 { 41, 42, 43, 44, 0, 0, 0, 0, 0, 0 },
  50.                 { 49, 50, 51, 52, 0, 0, 0, 0, 0, 0 },
  51.                 { 57, 58, 59, 60, 229, 230, 231, 232, 0, 0 },
  52.                 { 65, 66, 67, 68, 237, 238, 239, 240, 0, 0 },
  53.                 { 0, 0, 0, 0, 245, 246, 247, 248, 0, 0 },
  54.                 { 0, 0, 0, 0, 0, 254, 255, 0, 0, 0 },
  55.                 { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
  56.                 { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
  57.                 { 102, 103, 103, 103, 104, 0, 0, 0, 143, 144 },
  58.                 { 110, 111, 111, 111, 112, 0, 0, 0, 143, 144 }
  59.                 };
  60.         
  61.         //第三层游戏碰撞物理层数组 
  62.         //下一章介绍
  63.         //....................
  64.         
  65.         //游戏地图资源
  66.         Bitmap mBitmap = null;
  67.         
  68.         //资源文件
  69.         Resources mResources = null;
  70.         
  71.         //游戏画笔
  72.         Paint mPaint = null;
  73.         
  74.         //横向纵向tile块的数量
  75.         int mWidthTileCount = 0;
  76.         int mHeightTileCount = 0;

  77.         //横向纵向tile块的数量
  78.         int mBitMapWidth = 0;
  79.         int mBitMapHeight = 0;
  80.         
  81.         /**
  82.          * 构造方法
  83.          * @param context
  84.          */
  85.         public MapView(Context context) {
  86.             super(context);
  87.         
  88.             mPaint = new Paint();
  89.             mBitmap = ReadBitMap(context, R.drawable.map);
  90.             mBitMapWidth = mBitmap.getWidth();
  91.             mBitMapHeight = mBitmap.getHeight();
  92.             mWidthTileCount = mBitMapWidth / TILE_WIDTH;
  93.             mHeightTileCount = mBitMapHeight / TILE_HEIGHT;
  94.         }
  95.         
  96.         @Override
  97.         protected void onDraw(Canvas canvas) {
  98.             DrawMap(canvas,mPaint,mBitmap);
  99.             super.onDraw(canvas);
  100.            
  101.         }
  102.         
  103.         private void DrawMap(Canvas canvas,Paint paint ,Bitmap bitmap) {
  104.             int i,j;
  105.             for(i = 0; i< TILE_HEIGHT_COUNT; i++) {
  106.                 for(j = 0; j
  107.                     int ViewID =  mMapView[i][j];
  108.                     int ActorID = mMapAcotor[i][j];
  109.                     //绘制地图第一层
  110.                     if(ViewID > TILE_NULL) {
  111.                          DrawMapTile(ViewID,canvas,paint,bitmap, j * TILE_WIDTH , i * TILE_HEIGHT);
  112.                     }
  113.                    
  114.                     //绘制地图第二层
  115.                     if(ActorID > TILE_NULL) {
  116.                         DrawMapTile(ActorID,canvas,paint,bitmap, j * TILE_WIDTH , i * TILE_HEIGHT);
  117.                     }
  118.                 }
  119.             }
  120.         }
  121.         
  122.         
  123.         
  124.         /**
  125.          * 根据ID绘制一个tile块
  126.          * @param id
  127.          * @param canvas
  128.          * @param paint
  129.          * @param bitmap
  130.          */
  131.         private void DrawMapTile(int id,Canvas canvas,Paint paint ,Bitmap bitmap,int x, int y) {
  132.             //根据数组中的ID算出在地图资源中的XY 坐标
  133.             //因为编辑器默认0 所以第一张tile的ID不是0而是1 所以这里 -1
  134.             id--;
  135.             int count = id /mWidthTileCount;
  136.             int bitmapX = (id - (count * mWidthTileCount)) * TILE_WIDTH;
  137.             int bitmapY = count * TILE_HEIGHT;
  138.             DrawClipImage(canvas,paint,bitmap,x,y,bitmapX,bitmapY,TILE_WIDTH,TILE_HEIGHT);
  139.         }
  140.         
  141.         /** 
  142.          * 读取本地资源的图片 
  143.          * @param context 
  144.          * @param resId 
  145.          * @return 
  146.          */  
  147.         public Bitmap ReadBitMap(Context context, int resId){  
  148.             BitmapFactory.Options opt = new BitmapFactory.Options();  
  149.             opt.inPreferredConfig = Bitmap.Config.RGB_565;   
  150.             opt.inPurgeable = true;  
  151.             opt.inInputShareable = true;  
  152.             //获取资源图片  
  153.             InputStream is = context.getResources().openRawResource(resId);  
  154.                 return BitmapFactory.decodeStream(is,null,opt);  
  155.         }  
  156.         
  157.         /**
  158.          * 绘制图片中的一部分图片
  159.          * @param canvas
  160.          * @param paint
  161.          * @param bitmap
  162.          * @param x
  163.          * @param y
  164.          * @param src_x
  165.          * @param src_y
  166.          * @param src_width
  167.          * @param src_Height
  168.          */
  169.         private void DrawClipImage(Canvas canvas,Paint paint ,Bitmap bitmap, int x, int y, int src_x, int src_y, int src_xp, int src_yp) {
  170.             canvas.save();
  171.             canvas.clipRect(x, y, x + src_xp, y + src_yp);
  172.             canvas.drawBitmap(bitmap, x - src_x, y - src_y,paint);
  173.             canvas.restore();
  174.         }
  175.     }
  176. }
复制代码
最后如果你还是觉得我写的不够详细 看的不够爽 不要紧我把源代码的下载地址贴出来 欢迎大家一起讨论学习
 android游戏开发地图编辑器的使用源码.rar (191.43 KB, 下载次数: 708)

你可能感兴趣的:(android游戏)