如何使用Cocos2d-x 30制作基于tilemap的游戏
1个回答
展开全部
你好,百度知道电脑团为你解答!
教大家如何使用Cocos2d-x来做一个基于tile地图的游戏,当然还有Tiled地图编辑器。(我们小时候玩的小霸王小学机里面的游戏,大部分都是基于tile地图的游戏,如坦克大战、冒险岛、吞食天地等)我们将会创建一个忍者在沙漠中找西瓜吃的小游戏。
在第一部分教程中,我将教大家如何使用Tile来创建地图,怎样把地图加到游戏中,怎么让地图跟随玩家滚动,以及怎样使用对象层。
在第二部分教程中,我将介绍如何在地图中创建可碰撞的区域,如何使用tile属性,如何制作可拾取的物体和动态修改地图,还有确保忍者不要吃撑了!
如果你还没有准备好的话,你可能需要先从《如何用Cocos2d-x3.0制作一款简单的游戏》系列教程开始学起,因为我们这个教程使用了大量的基本概念,而这些概念都可以从上面的教程中获取。
好了,让我们玩一玩tile地图吧!
创建工程骨架
让我们首先创建整个工程的骨架,这样可以确保今后我们需要的文件都包含进来了,并且能够跑起来。
首先工程命名为TileGame。
接下来,下载游戏资源文件。这个资源文件包里包含了以下内容:
玩家sprite。这个图片和《如何用Cocos2d-x3.0制作一款简单的游戏》差不多。
我使用cxfr这个工具制作的一些音效。
我使用Garage Band制作的一些背景音乐。(查看这篇博文获得更多的信息)
我们将会使用的tile集合--它实际上会和tile地图编辑器一块儿使用,但是,我想把它放在这里,余下的事情会变得更容易。
一些额外的“特殊”的tile,我将会在后面加以说明。
一旦你获得了这些资源,解压并把它拖到你的工程的“Resources”分组下面。(编者的话:上面的音频资源都被编者转成了mp3格式)
如果一切顺利,所有的文件应该都在你的工程里了。是时候制作我们的地图了!
使用Tile来制作地图
Cocos2d-x支持使用Tile地图编辑器创建的TMX格式的地图。(建议大家在安装的时候选择英文,本教程的Tile采用英文的)
下载完之后,直接双击运行。点击File\New,然后会出现以下对话框:
在 orientation部分,你可以选择Orthogonal。Layer format我们也选默认的 Base64(zlib compressed)。
接下来,设置地图的大小。记住,这个大小是以tile为单位的,而不是以像素为单位。我们将创建一个尽量小的地图,因此选择50*50。
最后,你指定每个tile的宽度和高度。你这里选择的宽度和高度要根据你迹讥管客攮九归循害末的实际的tile图片的尺寸来做。这个教程使用的样例tile的尺寸是32*32,所以在上面的选项中选择32*32.
接下来,我们把制作地图所需要的tile集合导入进来。点击菜单栏上面的“map”菜单,“New Tileset...”,然后会出现下面的窗口:
为了获得图片,点击“Browse...”按钮,然后定位到工程的的Resources文件夹,选择 tmw_desert_spacing.png文件(我们刚才解压进去的),然后加到工程中去。它会基于文件名自动填充名称。然后把新图快 名称命名为“tmw_desert_spacing.png”.同时,设置下面的Tile spacing和Margin都为1。
你可以保留宽度和高度为32*32,因为tile的实际大小也是这么多。至于margin和spacing,我还没找到任何好的文档解释如何设置这两个值,下面是我的个人看法:
Margin就是当前的tile计算自身的像素的时候,它 需要减去多少个像素(宽度和高度都包含在内)。(类比word、css的margin)
Spacing 就是相邻两个tile之间的间隔(同时考虑宽度和高度)(类比word、css的spacing)
如果你看看 tmw_desert_spacing.png,你将会看见每一个tile都有一个像素的空白边界围绕着,这意味着我们需要把margin和spacing设置为1。
一旦你选择ok,你将会看到Tilesets窗口中显示了一些tiles。现在,你可以制作地图了!在Tilesets小窗口,选择一个tile,然后再在地图上的任意位置单击,你就会看到你选中的tile出现在点中的地方了。
因此,继续制作地图吧---充分发挥你的聪明才智!确保增加至少一对建筑物在地图上,因为后面我们需要一些东西来做碰撞。
记住一些方便的快捷方式:
你可以在Tileset拾取器中拖出一个方框,一次选取多个tile。
你可以使用工具栏上的“Bucket Fill Tools”按钮(就是一个桶那个)来基于一个基准tile绘制整个地图。
你可以使用“View\Zoom In...”和“View\Zoom out...”来放大和缩小地图。
一旦你完成了地图的绘制工作,在Layers选项卡的层上面双击(现在可以说是“Layer1”),然后重命名为“Background”。然后点击“File\Save”并且保存文件到你的工程的资源文件夹中,并且命名为“TileMap.tmx”。
后面我们将会使用这个tmx来做一些有趣的事情,好了,让我们把地图加载到游戏中去吧!
把tile地图添加到Cocos2d-x的场景中
打开HelloWorldScene.h,然后添加一些成员变量:
cpp
// Replace the init method with the following
bool HelloWorld::init()
{
if ( !Layer::init() )
{
return false;
}
std::string file = "TileMap.tmx";
auto str = String::createWithContentsOfFile(FileUtils::getInstance()->fullPathForFilename(file.c_str()).c_str());
_tileMap = TMXTiledMap::createWithXML(str->getCString(),"");
_background = _tileMap->layerNamed("Background");
addChild(_tileMap, -1);
return true;
}
这里,我们调用TMXTiledMap类的一些方法,把我们刚刚创建的地图文件加载进去。
教大家如何使用Cocos2d-x来做一个基于tile地图的游戏,当然还有Tiled地图编辑器。(我们小时候玩的小霸王小学机里面的游戏,大部分都是基于tile地图的游戏,如坦克大战、冒险岛、吞食天地等)我们将会创建一个忍者在沙漠中找西瓜吃的小游戏。
在第一部分教程中,我将教大家如何使用Tile来创建地图,怎样把地图加到游戏中,怎么让地图跟随玩家滚动,以及怎样使用对象层。
在第二部分教程中,我将介绍如何在地图中创建可碰撞的区域,如何使用tile属性,如何制作可拾取的物体和动态修改地图,还有确保忍者不要吃撑了!
如果你还没有准备好的话,你可能需要先从《如何用Cocos2d-x3.0制作一款简单的游戏》系列教程开始学起,因为我们这个教程使用了大量的基本概念,而这些概念都可以从上面的教程中获取。
好了,让我们玩一玩tile地图吧!
创建工程骨架
让我们首先创建整个工程的骨架,这样可以确保今后我们需要的文件都包含进来了,并且能够跑起来。
首先工程命名为TileGame。
接下来,下载游戏资源文件。这个资源文件包里包含了以下内容:
玩家sprite。这个图片和《如何用Cocos2d-x3.0制作一款简单的游戏》差不多。
我使用cxfr这个工具制作的一些音效。
我使用Garage Band制作的一些背景音乐。(查看这篇博文获得更多的信息)
我们将会使用的tile集合--它实际上会和tile地图编辑器一块儿使用,但是,我想把它放在这里,余下的事情会变得更容易。
一些额外的“特殊”的tile,我将会在后面加以说明。
一旦你获得了这些资源,解压并把它拖到你的工程的“Resources”分组下面。(编者的话:上面的音频资源都被编者转成了mp3格式)
如果一切顺利,所有的文件应该都在你的工程里了。是时候制作我们的地图了!
使用Tile来制作地图
Cocos2d-x支持使用Tile地图编辑器创建的TMX格式的地图。(建议大家在安装的时候选择英文,本教程的Tile采用英文的)
下载完之后,直接双击运行。点击File\New,然后会出现以下对话框:
在 orientation部分,你可以选择Orthogonal。Layer format我们也选默认的 Base64(zlib compressed)。
接下来,设置地图的大小。记住,这个大小是以tile为单位的,而不是以像素为单位。我们将创建一个尽量小的地图,因此选择50*50。
最后,你指定每个tile的宽度和高度。你这里选择的宽度和高度要根据你迹讥管客攮九归循害末的实际的tile图片的尺寸来做。这个教程使用的样例tile的尺寸是32*32,所以在上面的选项中选择32*32.
接下来,我们把制作地图所需要的tile集合导入进来。点击菜单栏上面的“map”菜单,“New Tileset...”,然后会出现下面的窗口:
为了获得图片,点击“Browse...”按钮,然后定位到工程的的Resources文件夹,选择 tmw_desert_spacing.png文件(我们刚才解压进去的),然后加到工程中去。它会基于文件名自动填充名称。然后把新图快 名称命名为“tmw_desert_spacing.png”.同时,设置下面的Tile spacing和Margin都为1。
你可以保留宽度和高度为32*32,因为tile的实际大小也是这么多。至于margin和spacing,我还没找到任何好的文档解释如何设置这两个值,下面是我的个人看法:
Margin就是当前的tile计算自身的像素的时候,它 需要减去多少个像素(宽度和高度都包含在内)。(类比word、css的margin)
Spacing 就是相邻两个tile之间的间隔(同时考虑宽度和高度)(类比word、css的spacing)
如果你看看 tmw_desert_spacing.png,你将会看见每一个tile都有一个像素的空白边界围绕着,这意味着我们需要把margin和spacing设置为1。
一旦你选择ok,你将会看到Tilesets窗口中显示了一些tiles。现在,你可以制作地图了!在Tilesets小窗口,选择一个tile,然后再在地图上的任意位置单击,你就会看到你选中的tile出现在点中的地方了。
因此,继续制作地图吧---充分发挥你的聪明才智!确保增加至少一对建筑物在地图上,因为后面我们需要一些东西来做碰撞。
记住一些方便的快捷方式:
你可以在Tileset拾取器中拖出一个方框,一次选取多个tile。
你可以使用工具栏上的“Bucket Fill Tools”按钮(就是一个桶那个)来基于一个基准tile绘制整个地图。
你可以使用“View\Zoom In...”和“View\Zoom out...”来放大和缩小地图。
一旦你完成了地图的绘制工作,在Layers选项卡的层上面双击(现在可以说是“Layer1”),然后重命名为“Background”。然后点击“File\Save”并且保存文件到你的工程的资源文件夹中,并且命名为“TileMap.tmx”。
后面我们将会使用这个tmx来做一些有趣的事情,好了,让我们把地图加载到游戏中去吧!
把tile地图添加到Cocos2d-x的场景中
打开HelloWorldScene.h,然后添加一些成员变量:
cpp
// Replace the init method with the following
bool HelloWorld::init()
{
if ( !Layer::init() )
{
return false;
}
std::string file = "TileMap.tmx";
auto str = String::createWithContentsOfFile(FileUtils::getInstance()->fullPathForFilename(file.c_str()).c_str());
_tileMap = TMXTiledMap::createWithXML(str->getCString(),"");
_background = _tileMap->layerNamed("Background");
addChild(_tileMap, -1);
return true;
}
这里,我们调用TMXTiledMap类的一些方法,把我们刚刚创建的地图文件加载进去。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
翌颖科技
2024-07-30 广告
2024-07-30 广告
Profilm 3D是翌颖科技(上海)有限公司推出的一款先进的3D打印材料。它以其卓越的打印性能、高清晰度及出色的耐久性而广受赞誉。Profilm 3D不仅适用于多种3D打印设备,还能满足各种复杂设计和项目的需求。在追求创新和质量的道路上,...
点击进入详情页
本回答由翌颖科技提供
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询