Cocos2d-x 3.2 大富翁游戏项目开发-第六部分 地图设计

在选择地图后,我们将进入游戏地图,所以我们必须先把地图编辑一下,使用Tiled地图编辑工具。

1、打开Tiled工具,新建文件,设置

地图大小:宽20块高 15块

块大小:     宽和高都是32像素

这样地图宽为 20 X 32 = 640  高 15 X 32 =480

我们调试的视图尺寸为 800 X 480   宽度剩余160像素 ,我们用来放置游戏控制控件和 显示人物的一些信息

Cocos2d-x 3.2 大富翁游戏项目开发-第六部分 地图设计_第1张图片

2、点击地图—新图块

选择sea.png图片,图片上部中我放置了15个道具,分别是空白地块、道路、增加体力的分值、偶然事件等,后续使用的时候我再具体说明


Cocos2d-x 3.2 大富翁游戏项目开发-第六部分 地图设计_第2张图片

3、选择除道具之外的图片填充满空白图块。并修改本图层名称为“ground”

4、新建图层,命名为”way” ,这一层我们主要放置道路以及各种道具

5、新建图层,命名为“land” ,这一层放置空白地块

6、保存文件为”sea.tmx” 



下面开始加载地图

由于每个关卡场景都需要加载地图,所以我们写一个基类GameBaseScene,用来加载地图,每个游戏关卡场景只有继承该类即可


GameBaseScene.h文件

//定义画表格的初始位置 和 每行每列的宽高值
const int tableStartPosition_x = 650; 
const int tableStartPosition_y = 450;
const int tableWidth = 50;
const int tableHeight = 40;

class GameBaseScene: public Layer
{
public:
    static Scene* createScene();
   TMXTiledMap* _map; //定义地图
    virtual bool init();  
virtual void addMap();//添加地图方法 

    CREATE_FUNC(GameBaseScene);

private:

	void drawTable(int playerNumber); //画表格,用来放置角色,根据上边定义的变量画
	void addPlayer();//添加游戏角色部分信息方法,在控制栏先显示头像,资金 体力值等
	void addRightBanner();//添加右边地图空白部分背景,上方放置人物等信息
};

#endif


GameBaseScene.cpp文件


//调用了添加地图方法,添加banner背景 ,画表格 ,添加游戏人物部分信息方法
bool GameBaseScene::init()
{
	if ( !Layer::init() )
	{
		return false;
	}
	addMap();
	addRightBanner();
	drawTable(2);
	addPlayer();
	return true;
}

void  GameBaseScene::addRightBanner()
{
	Sprite* rightBanner = Sprite::create(RIGHT_BANNER);
	rightBanner->setAnchorPoint(ccp(0,0));
	rightBanner->setPosition( ccp(tableStartPosition_x, 0));//根据头文件定义的初始x值设置位置
	addChild(rightBanner);
}


//绘制表格,这部分代码可以不用看,只要知道是根据游戏人物数量,绘制表格 ,可以采用图片替换这个绘制。自己感觉用图片不如表格计算位置精确。
void GameBaseScene:: drawTable(int playerNumber)
{
	auto s = Director::getInstance()->getWinSize();
	
	auto draw = DrawNode::create();
	this->addChild(draw);

	for(int i=0;i<playerNumber;i++)
	{
		draw->drawSegment(Vec2(tableStartPosition_x,tableStartPosition_y-2*i*tableHeight), 
						  Vec2(tableStartPosition_x+ 3*tableWidth,tableStartPosition_y-2*i*tableHeight), 1, 
						  Color4F(0, 1, 0, 1));

		draw->drawSegment(Vec2(tableStartPosition_x,tableStartPosition_y - 2*(i+1)*tableHeight), 
						  Vec2(tableStartPosition_x+ 3*tableWidth,tableStartPosition_y - 2*(i+1)*tableHeight), 1, 
						  Color4F(0, 1, 0, 1));

		draw->drawSegment(Vec2(tableStartPosition_x+ tableWidth,tableStartPosition_y - tableHeight-2*i*tableHeight), 
						  Vec2(tableStartPosition_x+ 3*tableWidth,tableStartPosition_y - tableHeight-2*i*tableHeight), 1, 
						  Color4F(0, 1, 0, 1));

		draw->drawSegment(Vec2(tableStartPosition_x+ tableWidth,tableStartPosition_y -2*i*tableHeight), 
						  Vec2(tableStartPosition_x+ tableWidth,tableStartPosition_y -2* tableHeight-2*i*tableHeight), 1, 
						  Color4F(0, 1, 0, 1));
	}
}


//添加人物信息的方法,就是根据绘制的表格位置,把人物头像 、资金 、体力等信息同表格对齐显示,主要是坐标计算。
void GameBaseScene:: addPlayer()
{
	Sprite* player_me = Sprite::create(PLAYER_ME);
	player_me->setPosition(tableStartPosition_x+tableWidth/2,tableStartPosition_y-tableHeight);
	addChild(player_me);


    LabelTTF *player_me_money = LabelTTF::create();
    player_me_money->setString("$");
	player_me_money->setAnchorPoint(ccp(0,0.5));
    player_me_money->setFontSize(25);
    player_me_money->setPosition(tableStartPosition_x+tableWidth,tableStartPosition_y-tableHeight/2);
    addChild(player_me_money);

    LabelTTF *player_me_strength = LabelTTF::create();
    player_me_strength->setString("+");
	player_me_strength->setAnchorPoint(ccp(0,0.5));
    player_me_strength->setFontSize(28);
    player_me_strength->setPosition(tableStartPosition_x+tableWidth,tableStartPosition_y-tableHeight/2*3);
    addChild(player_me_strength);

	Sprite* player_enemy1 = Sprite::create(PLAYER_ENEMY1);
	player_enemy1->setPosition(tableStartPosition_x+tableWidth/2,tableStartPosition_y-3*tableHeight);
	addChild(player_enemy1);

    LabelTTF *player_enemy1_money = LabelTTF::create();
    player_enemy1_money->setString("$");
	player_enemy1_money->setAnchorPoint(ccp(0,0.5));
    player_enemy1_money->setFontSize(25);
    player_enemy1_money->setPosition(tableStartPosition_x+tableWidth,tableStartPosition_y-tableHeight/2*5);
    addChild(player_enemy1_money);

    LabelTTF *player_enemy1_strength = LabelTTF::create();
    player_enemy1_strength->setString("+");
	player_enemy1_strength->setAnchorPoint(ccp(0,0.5));
    player_enemy1_strength->setFontSize(28);
    player_enemy1_strength->setPosition(tableStartPosition_x+tableWidth,tableStartPosition_y-tableHeight/2*7);
    addChild(player_enemy1_strength);
}


基类做好了,我们就可以编写具体关卡场景类了,编写SeaScene


//继承自基类GameBaseScene
class SeaScene: public GameBaseScene
{
public:
    static Scene* createScene();
  
    virtual bool init();  
 
    CREATE_FUNC(SeaScene);
};

#endif


//初始化方法需要调用基类的init方法
bool SeaScene::init()
{
	if ( !GameBaseScene::init() )
	{
		return false;
	}

	return true;
}

//编写继承自父类的addMap方法
void GameBaseScene::addMap()
{
	_map = TMXTiledMap::create( "map/sea.tmx");
	addChild(_map);
}	

修改MapChooseSceneonTouchEnded()方法,添加进入关卡场景代码,为了不至于进入场景太突然,我们添加了TransitionFadeBL场景切换动画


void MapChooseScene::onTouchEnded(Touch*touch,Event *unused_event)
{

	Point endPoint = Director::getInstance()->convertToGL(touch->getLocationInView());
    float distance = endPoint.x - beginTouchPoint.x;
    if(fabs(distance) > TOUCH_DISTANCE)
    {
        adjustScrollView(distance);
    }else
	{
		if(currentPage == 2)
		{
			auto  scene = 	TransitionFadeBL::create(2, SeaScene::createScene());
	
			Director::getInstance()->pushScene(scene);
		}

		
	}
}


Ok,测试显示效果如图


Cocos2d-x 3.2 大富翁游戏项目开发-第六部分 地图设计_第3张图片


点击下载代码

http://download.csdn.net/detail/lideguo1979/8272005


未完待续....................

你可能感兴趣的:(Cocos2d-x 3.2 大富翁游戏项目开发-第六部分 地图设计)