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

转载声明:http://www.cnblogs.com/htynkn/archive/2012/01/12/libgdx_12.html

虽说可以用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。

tiledmap1

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

map

添加一个新图块

tiledmap2

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

tiledmap3

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

tiledmap

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

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

tiledmap4

tilest1.png文件:

tileset1

终于可以开始绘制了…

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是缓冲的块数,可以酌情调整。我是随意写的。

tiledmap5
图片分享:

我个人比较喜欢舞台,其实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 }

tiledmap6

效果不是很明显,左下角有个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/

 

特别说明:

我操作的时候没有任何问题...要是各位遇到问题,请细心调试,可以参考一下:http://www.cnblogs.com/SkyD/archive/2012/04/19/2457237.html

 

这里还有博友破木吉他关于tilemap生成的文章:http://bluthmatter.blog.163.com/blog/static/18429405920124205458401/

 

posted @ 2013-02-04 20:58  王世桢  阅读(285)  评论(0)    收藏  举报