Android游戲開發教程之一：地圖編輯器

       Mappy中文地圖編輯器的使用說明

       下載地址：http://download.csdn.net/source/3452259

       壓縮包中包含 游戲地圖編輯器使用指南 與地圖資源圖片 宮院1.png 一張 mapwin.exe 可執行文件 map.FMP 與map.TXT為使用編輯器生成出來的保存文件與地圖數組。

       解壓後打開地圖編輯器 mapwin.exe.exe 創建一張新的地圖。

       由於我用的Android模擬器寬高是320X480

       地圖寬的塊數 就是 320 / 32 = 10

       地圖高的塊數 就是 480 / 32 = 15

       這裡擴充一下 實際在工作開發中因為手機的分辨率各式各樣 所以是需要尺寸考慮自適應的 有兩種方法可以拿到當前手機屏幕的寬高

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的尺寸 圖片的寬高尺寸必需能被整除。

      導入地圖圖塊成功，右側為導入的地圖資源 接下來就是自己拖動右側地圖塊拼出自己想要的地圖了。

       接下來我將填充3個圖層 最底層 實體層 物理層 我會一一介紹他們的作用

       圖層0為最底層 繪制地圖先繪制這一層

       圖層1為實物層 這一層主要繪制一些actor 繪制完第一層在繪制這一層

       圖層2為物理層檢測物理碰撞這一層不用繪制但是玩家每移動一次就須要以玩家當前點在地圖數組中的角標 和物理層做判斷是否碰撞，它和Actor層的位置一樣。

       拼地圖的使用技巧 編輯新圖層的時候可以把上一個塗層打開進行對比編輯。 

       這樣子就可以根據0圖層的信息來編輯圖層1

       地圖塊拼完後編輯完成後點擊保存文件 後在點擊保存文本數據  地圖數組文件就生成出來了 文件命為map.TXT 裡面就存著我們編輯的3個地圖層的地圖信息。

       使用Mappy中文地圖編輯器生成的地圖信息數組來繪制游戲地圖

       效果圖如下

       代碼實現

       這裡我先說一下游戲窗口的全屏實現方法  

       第一種

1. // 全屏顯示窗口  
2. requestWindowFeature(Window.FEATURE_NO_TITLE);  
3. getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);  

      第二種 AndroidManifest.xml 中加入

1. <activity android:name=".activity"  
2.           android:theme="@android:style/Theme.NoTitleBar.Fullscreen" />  

1. public class mapAcitvity extends Activity {  
2.    
3.     @Override  
4.     public void onCreate(Bundle savedInstanceState) {  
5.         super.onCreate(savedInstanceState);  
6.     // 全屏顯示窗口  
7.     requestWindowFeature(Window.FEATURE_NO_TITLE);  
8.     getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);  
9.     //顯示自定義的游戲View  
10.     setContentView(new MapView(this));  
11.     }  
12.    
13.     public class MapView extends View{  
14.    
15.         //tile塊的寬高  
16.     public final static int TILE_WIDTH = 32;  
17.     public final static int TILE_HEIGHT = 32;  
18.    
19.         //tile塊的寬高的數量  
20.     public final static int TILE_WIDTH_COUNT = 10;  
21.     public final static int TILE_HEIGHT_COUNT = 15;  
22.    
23.     //數組元素為0則什麼都不畫  
24.     public final static int TILE_NULL = 0;  
25.     //第一層游戲View地圖數組  
26.     public int [][]mMapView = {  
27.         { 1, 1, 1, 1, 137, 137, 137, 1, 1, 1 },  
28.         { 1, 1, 1, 1, 137, 137, 137, 1, 1, 1 },  
29.         { 1, 1, 1, 1, 137, 137, 137, 1, 1, 1 },  
30.         { 137, 137, 137, 137, 137, 137, 137, 137, 137, 137 },  
31.         { 137, 137, 137, 137, 137, 137, 137, 137, 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.         { 1, 1, 1, 1, 1, 1, 1, 1, 137, 137 },  
38.         { 137, 137, 137, 137, 137, 137, 137, 137, 137, 137 },  
39.         { 137, 137, 137, 137, 137, 137, 137, 137, 137, 137 },  
40.         { 1, 1, 1, 1, 1, 137, 137, 137, 1, 1 },  
41.         { 1, 1, 1, 1, 1, 137, 137, 137, 1, 1 }  
42.         };  
43.    
44.     //第二層游戲實體actor數組  
45.     public int [][]mMapAcotor  = {  
46.         { 102, 103, 103, 104, 0, 0, 0, 165, 166, 167 },  
47.         { 110, 111, 111, 112, 0, 0, 0, 173, 174, 175 },  
48.         { 126, 127, 127, 128, 0, 0, 0, 181, 182, 183 },  
49.         { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },  
50.         { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },  
51.         { 41, 42, 43, 44, 0, 0, 0, 0, 0, 0 },  
52.         { 49, 50, 51, 52, 0, 0, 0, 0, 0, 0 },  
53.         { 57, 58, 59, 60, 229, 230, 231, 232, 0, 0 },  
54.         { 65, 66, 67, 68, 237, 238, 239, 240, 0, 0 },  
55.         { 0, 0, 0, 0, 245, 246, 247, 248, 0, 0 },  
56.         { 0, 0, 0, 0, 0, 254, 255, 0, 0, 0 },  
57.         { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },  
58.         { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },  
59.         { 102, 103, 103, 103, 104, 0, 0, 0, 143, 144 },  
60.         { 110, 111, 111, 111, 112, 0, 0, 0, 143, 144 }  
61.         };  
62.    
63.     //第三層游戲碰撞物理層數組  
64.     //下一章介紹  
65.     //....................  
66.    
67.     //游戲地圖資源  
68.     Bitmap mBitmap = null;  
69.    
70.     //資源文件  
71.     Resources mResources = null;  
72.    
73.     //游戲畫筆  
74.     Paint mPaint = null;  
75.    
76.     //橫向縱向tile塊的數量  
77.     int mWidthTileCount = 0;  
78.     int mHeightTileCount = 0;  
79.    
80.     //橫向縱向tile塊的數量  
81.     int mBitMapWidth = 0;  
82.     int mBitMapHeight = 0;  
83.    
84.     /** 
85.      * 構造方法 
86.      * @param context 
87.      */  
88.     public MapView(Context context) {  
89.         super(context);  
90.    
91.         mPaint = new Paint();  
92.         mBitmap = ReadBitMap(context, R.drawable.map);  
93.         mBitMapWidth = mBitmap.getWidth();  
94.         mBitMapHeight = mBitmap.getHeight();  
95.         mWidthTileCount = mBitMapWidth / TILE_WIDTH;  
96.         mHeightTileCount = mBitMapHeight / TILE_HEIGHT;  
97.     }  
98.    
99.         @Override  
100.         protected void onDraw(Canvas canvas) {  
101.             DrawMap(canvas,mPaint,mBitmap);  
102.             super.onDraw(canvas);  
103.    
104.         }  
105.    
106.         private void DrawMap(Canvas canvas,Paint paint ,Bitmap bitmap) {  
107.             int i,j;  
108.             for(i = 0; i< TILE_HEIGHT_COUNT; i++) {  
109.             for(j = 0; j<TILE_WIDTH_COUNT;j++) {  
110.                 int ViewID =  mMapView[i][j];  
111.                 int ActorID = mMapAcotor[i][j];  
112.                 //繪制地圖第一層  
113.                 if(ViewID > TILE_NULL) {  
114.                  DrawMapTile(ViewID,canvas,paint,bitmap, j * TILE_WIDTH , i * TILE_HEIGHT);  
115.                 }  
116.    
117.                 //繪制地圖第二層  
118.                 if(ActorID > TILE_NULL) {  
119.                 DrawMapTile(ActorID,canvas,paint,bitmap, j * TILE_WIDTH , i * TILE_HEIGHT);  
120.                 }  
121.             }  
122.             }  
123.         }  
124.    
125.         /** 
126.          * 根據ID繪制一個tile塊 
127.          * @param id 
128.          * @param canvas 
129.          * @param paint 
130.          * @param bitmap 
131.          */  
132.         private void DrawMapTile(int id,Canvas canvas,Paint paint ,Bitmap bitmap,int x, int y) {  
133.             //根據數組中的ID算出在地圖資源中的XY 坐標  
134.             //因為編輯器默認0 所以第一張tile的ID不是0而是1 所以這裡 -1  
135.             id--;  
136.             int count = id /mWidthTileCount;  
137.             int bitmapX = (id - (count * mWidthTileCount)) * TILE_WIDTH;  
138.             int bitmapY = count * TILE_HEIGHT;  
139.             DrawClipImage(canvas,paint,bitmap,x,y,bitmapX,bitmapY,TILE_WIDTH,TILE_HEIGHT);  
140.         }  
141.    
142.         /** 
143.          * 讀取本地資源的圖片 
144.          * @param context 
145.          * @param resId 
146.          * @return 
147.          */  
148.         public Bitmap ReadBitMap(Context context, int resId){  
149.             BitmapFactory.Options opt = new BitmapFactory.Options();  
150.             opt.inPreferredConfig = Bitmap.Config.RGB_565;  
151.             opt.inPurgeable = true;  
152.             opt.inInputShareable = true;  
153.             //獲取資源圖片  
154.             InputStream is = context.getResources().openRawResource(resId);  
155.                 return BitmapFactory.decodeStream(is,null,opt);  
156.         }    
157.    
158.         /** 
159.      * 繪制圖片中的一部分圖片 
160.      * @param canvas 
161.      * @param paint 
162.      * @param bitmap 
163.      * @param x 
164.      * @param y 
165.      * @param src_x 
166.      * @param src_y 
167.      * @param src_width 
168.      * @param src_Height 
169.      */  
170.     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) {  
171.         canvas.save();  
172.         canvas.clipRect(x, y, x + src_xp, y + src_yp);  
173.         canvas.drawBitmap(bitmap, x - src_x, y - src_y,paint);  
174.         canvas.restore();  
175.     }  
176.     }  
177. }  

       最後如果你還是覺得我寫的不夠詳細 看的不夠爽 不要緊我把源代碼的下載地址貼出來 歡迎大家一起討論學習

       下載地址：http://vdisk.weibo.com/s/aa81p

       這裡我詳細說一下編輯器生成出來的數組怎麼用?就拿生成出來的ID 137為例  假設 tile的寬高為32 137表示從圖片的左上角從左到右從上到下 數到第137個tile 就是我們須要繪制的tile   

繪制方面利用 clipRect方法來剪裁圖片 實現繪制 下一章我講游戲中的攝像頭機制 會詳細介紹這一點。