android游戏开发框架libgdx的使用（十二）—TiledMap地图的使用

转自：http://www.apkbus.com/forum.php?mod=viewthread&tid=19770&extra=page%3D1%26filter%3Dauthor%26orderby%3Ddateline%26orderby%3Ddateline

 

虽说可以用Image什么的当个背景，但是要是做个RPG类的游戏就有点复杂了。为了追求效率一般可以使用libgdx的SpriteCache，但是如果习惯于TiledMap的话libgdx也是支持的。

相关的类是TiledMap，TileAtlas，TileMapRenderer，都在com.badlogic.gdx.graphics.g2d.tiled之中。

现在我们从头来看看TiledMap的使用。

1.制作TiledMap。

我使用的是Tile Map editor，下载地址：http://www.mapeditor.org/

先新建一个地图,大小50*30，每个块的大小是32*32。

然后我使用的图块资源是从网上下的，具体出处不知了，对于资源奉献者表示感谢~

添加一个新图块

块的高宽都是32.边距和间距都是1px，这些数值是取决你的图块资源本身的。效果如下：

然后发挥想象吧，画一幅地图。

2012-1-17 22:08 上传

下载附件(236.38 KB)

保存tmx文件。然后用gdx-tiled-preprocessor处理一下。

处理完成后会多三个文件，覆盖原来的同名文件：

2012-1-17 22:08 上传

下载附件(21.25 KB)

tilest1.png文件：

2012-1-17 22:08 上传

下载附件(111.46 KB)

终于可以开始绘制了…

1. map = TiledLoader.createMap(mapHandle);
   
2. atlas = new TileAtlas(map, new FileHandle("map/"));
   
3. tileMapRenderer = new TileMapRenderer(map, atlas, 10, 10)

复制代码

最后在render用tileMapRenderer.render(cam);绘制而在TileMapRenderer(map, atlas, 10, 10)这句中后面两个10是缓冲的块数，可以酌情调整。我是随意写的。

2012-1-17 22:09 上传

下载附件(53.02 KB)

我个人比较喜欢舞台，其实tiledmap一样可以在舞台中使用。我在舞台绘制一个标签作为例子。其实原理很简单，从Stage获取Camera，然后给Render用，最后在Stage绘制。关键代码：

1. Gdx.gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
   
2. OrthographicCamera c = (OrthographicCamera) stage.getCamera();
   
3. ((Label) stage.findActor("fpsLabel")).setText("FPS: "
   
4. + Gdx.graphics.getFramesPerSecond());
   
5. stage.act(Gdx.graphics.getDeltaTime());
   
6. tileMapRenderer.render(c);
   
7. stage.draw();

复制代码

完整代码：

1. package com.cnblogs.htynkn.game;
   
2. 
   
3. import com.badlogic.gdx.ApplicationListener;
   
4. import com.badlogic.gdx.Gdx;
   
5. import com.badlogic.gdx.files.FileHandle;
   
6. import com.badlogic.gdx.graphics.Color;
   
7. import com.badlogic.gdx.graphics.GL10;
   
8. import com.badlogic.gdx.graphics.OrthographicCamera;
   
9. import com.badlogic.gdx.graphics.g2d.BitmapFont;
   
10. import com.badlogic.gdx.graphics.g2d.tiled.TileAtlas;
    
11. import com.badlogic.gdx.graphics.g2d.tiled.TileMapRenderer;
    
12. import com.badlogic.gdx.graphics.g2d.tiled.TiledLoader;
    
13. import com.badlogic.gdx.graphics.g2d.tiled.TiledMap;
    
14. import com.badlogic.gdx.math.Vector2;
    
15. import com.badlogic.gdx.math.Vector3;
    
16. import com.badlogic.gdx.scenes.scene2d.Stage;
    
17. import com.badlogic.gdx.scenes.scene2d.ui.Image;
    
18. import com.badlogic.gdx.scenes.scene2d.ui.Label;
    
19. import com.badlogic.gdx.scenes.scene2d.ui.Label.LabelStyle;
    
20. 
    
21. public class JavaGame implements ApplicationListener {
    
22. 
    
23. Stage stage;
    
24. float width;
    
25. float height;
    
26. private TiledMap map;
    
27. private TileAtlas atlas;
    
28. private TileMapRenderer tileMapRenderer;
    
29. 
    
30. Vector3 camDirection = new Vector3(1, 1, 0);
    
31. Vector2 maxCamPosition = new Vector2(0, 0);
    
32. 
    
33. Image image;
    
34. 
    
35. @Override
    
36. public void create() {
    
37. final String path = "map/";
    
38. final String mapname = "tilemap";
    
39. FileHandle mapHandle = Gdx.files.internal(path + mapname + ".tmx");
    
40. map = TiledLoader.createMap(mapHandle);
    
41. atlas = new TileAtlas(map, new FileHandle("map/"));
    
42. tileMapRenderer = new TileMapRenderer(map, atlas, 10, 10);
    
43. maxCamPosition.set(tileMapRenderer.getMapWidthUnits(), tileMapRenderer
    
44. .getMapHeightUnits());
    
45. 
    
46. width = Gdx.graphics.getWidth();
    
47. height = Gdx.graphics.getHeight();
    
48. stage = new Stage(width, height, true);
    
49. Label label = new Label("FPS:", new LabelStyle(new BitmapFont(Gdx.files
    
50. .internal("font/blue.fnt"),
    
51. Gdx.files.internal("font/blue.png"), false), Color.BLACK),
    
52. "fpsLabel");
    
53. stage.addActor(label);
    
54. Gdx.input.setInputProcessor(stage);
    
55. }
    
56. 
    
57. @Override
    
58. public void dispose() {
    
59. // TODO Auto-generated method stub
    
60. 
    
61. }
    
62. 
    
63. @Override
    
64. public void pause() {
    
65. // TODO Auto-generated method stub
    
66. 
    
67. }
    
68. 
    
69. @Override
    
70. public void render() {
    
71. Gdx.gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
    
72. OrthographicCamera c = (OrthographicCamera) stage.getCamera();
    
73. ((Label) stage.findActor("fpsLabel")).setText("FPS: "
    
74. + Gdx.graphics.getFramesPerSecond());
    
75. stage.act(Gdx.graphics.getDeltaTime());
    
76. tileMapRenderer.render(c);
    
77. stage.draw();
    
78. }
    
79. 
    
80. @Override
    
81. public void resize(int width, int height) {
    
82. // TODO Auto-generated method stub
    
83. 
    
84. }
    
85. 
    
86. @Override
    
87. public void resume() {
    
88. // TODO Auto-generated method stub
    
89. 
    
90. }
    
91. }

复制代码

2012-1-17 22:09 上传

下载附件(60.96 KB)

效果不是很明显，左下角有个Label。虽说我们绘制出来了Map，但是还没有角色，而且还没有设置墙壁等障碍，接下来的几篇文章会说说这些。


写在最后：


1.做好的TMX文件一定要处理以后再用，用TiledMapPacker处理，不是TexturePacker。我起初弄混淆了，结果把这一块的代码读懂了才反应过来…
2.Stage和TiledMap混用时，一定是stage的绘制在后。


3.Stage的相机可以移动，移动时会产生地图移动效果（比如主角向前走），但是一定要更新Stage的Actors的位置。


这篇博文写了一天半，主要是我粗心把TiledMapPacker和TexturePacker搞错，仔细看了看TexturePacker，觉得TexturePacker也是很有用的东西。算法很有趣，而且还有热心网友做的一个GUI界面，用这个就不用自己辛苦拉图了 。


算法介绍： http://www.blackpawn.com/texts/lightmaps/default.html


GUI界面的TexturePacker： http://code.google.com/p/libgdx-texturepacker-gui/