cocos2d-x 3.0游戏实例学习笔记《卡牌塔防》第一步---开始界面&关卡选择

首页 > 代码库 > cocos2d-x 3.0游戏实例学习笔记《卡牌塔防》第一步---开始界面&关卡选择

cocos2d-x 3.0游戏实例学习笔记《卡牌塔防》第一步---开始界面&关卡选择

2024-07-19 00:23:22 220人阅读

/* 说明：

**1.本次游戏实例是《cocos2d-x游戏开发之旅》上的最后一个游戏，这里用3.0重写并做下笔记

**2.我也问过木头本人啦，他说：随便写，第一别完全照搬代码；第二可以说明是学习笔记---好人

**3.这里用cocos2d-x 3.0版本重写，很多地方不同，但是从重写过程中也很好的学习了cocos2d-x

***每一步对应的所有代码以及用到的资源都会打包在最后给出

***为避免代码过多，每一步的代码都做了标记--一看就晓得是第几步实现的避免出错改不回去(难不成还用Git？)

***可以根据设计思路(好吧，那名字太高大上。实际就是这一步要干啥)先自己实现---cocos2d-x本来就是如此，相同的功能有许多不同实现方法；先自己折腾是蛮不错的。

***为了方便移植到手机上，对于每一步都进行编译android测试；因为很多时候代码在win32下可以，编译就会出错，给出的代码会是测试过后的。

start：先新建一个工程

本次笔记内容：

1、效果预览

2、设计思路&问题注意

3、实现代码&详解

4、总结&下节预览

一：效果图

按照前面的第0步的知识点&设计思路里面的主设计思路，先完成MainScene到关卡选择&编辑界面的处理

二：设计思路&问题注意

MainScene 加载一个背景，两个选择菜单。

编辑按钮先不管；

开始按钮时候，进行关卡选择GameLvlChooseScene

关卡选择按钮也先不实现

-（好吧，这是什么烂设计思路。。无聊。。。）但是，这里我们会遇到一个坐标的小问题--代码中解释吧

三：实现代码+解析

好吧，其实这么简单的代码。。还是贴上吧

MainScene：

#ifndef __MainScene__H__
#define __MainScene__H__

#include "cocos2d.h"
USING_NS_CC;

class MainScene : public Layer{
public:
	MainScene();
	~MainScene();
	CREATE_FUNC(MainScene);
	virtual bool init();

	static Scene* createScene();

private:
	//**1**选择菜单
	void chooseMenu();

	//**1**两个选择菜单的回调函数
	void editorScene(Ref* pSender);
	void startGame(Ref* pSender);
};/**/

#endif

#include "MainScene.h"

MainScene::MainScene(){
}
MainScene::~MainScene(){
}

Scene* MainScene::createScene(){
	auto scene = Scene::create();

	auto layer = MainScene::create();

	scene->addChild(layer);

	return scene;
}

bool MainScene::init(){
	auto visibleSize = Director::getInstance()->getVisibleSize();
	
	auto BG = Sprite::create("game/MainSceneBG.jpg");
	BG->setPosition(visibleSize.width/2,visibleSize.height/2);
	BG->setOpacity(200); //设置透明度，看起来更像背景->_->
	this->addChild(BG);
	
	chooseMenu();

	return true;
}

void MainScene::chooseMenu(){
	auto visibleSize = Director::getInstance()->getVisibleSize();
	
	const char* norImg = "Button/choose_btn_nor.png";
	const char* lightImg = "Button/choose_btn_light.png";
	
	//**1**---------开始--------------------------------
	auto title = Label::create("Start","Arial",35);
	title->setPosition(ccp(60, 60));
	auto startItem = MenuItemImage::create(norImg, lightImg, CC_CALLBACK_1(MainScene::startGame,this));
	startItem->addChild(title);

	//**1**---------编辑场景----------------------------
    title = Label::create("Editor","Arial",35);
	title->setPosition(ccp(60, 60));
	auto editorItem = MenuItemImage::create(norImg, lightImg, CC_CALLBACK_1(MainScene::editorScene,this));
	editorItem->addChild(title);
	
	//**1**菜单
	auto menu = CCMenu::create(startItem, editorItem, nullptr);
	//**1**按照一列放置
	menu->alignItemsVerticallyWithPadding(20);
	menu->setPosition(ccp(visibleSize.width / 2, visibleSize.height / 2));

	this->addChild(menu);
	
}

void MainScene::startGame(Ref* pSender){
	CCLOG("startGame");
	//auto scene = GameLvlChoose::createScene();
	//Director::getInstance()->replaceScene(scene);
}

void MainScene::editorScene(Ref* pSender){
	CCLOG("EditorScene");
}

没啥好解释的，但是注意两个问题

1、一个小小的坐标问题：chooseMenu 里面，我们对于一个菜单单项，要加一个Label，也就是在按钮图片中添加的Start之类的文字Label，这样你就知道这个按钮是干嘛的啦。我们需要把Label的位置放在ccp(60,60)；

why？那是因为我们需要把Label addChild到菜单单项里面去，son 的放置位置是相对于parent来的，你若不setPosition，那么默认的就是(0,0)，相对于parent 放在 0,0 位置是个什么意思呢？看图：

那么，打开资源图片，发现按钮图片是 130*130的，所以应该把Label放在（60,60）。关于这个问题后面还会用到，需要注意

2、关于Scene和Layer的关系，按照新建的工程来看，HelloWorld里面，是一个Scene里面放了一个层，它的处理方式是HelloWorld是继承自Layer，它是一个Layer，只不过，我们在这个层里，有一个createScene 方法来创建并且返回Scene； createScene里面HelloWorld::create()；然后调用virtual bool init 函数，创建这个层，加入scene里面，返回scene；这里的MainScene比较简单；也是这么做的；对于后面有的地方，一个Scene里面有多个Layer，那么可以分离出来

-------------------------------------------------------------------------------------------------

然后我们在AppDelegate.cpp中修改scene；同时这里先

bool AppDelegate::applicationDidFinishLaunching() {
    // initialize director
    auto director = Director::getInstance();
    auto glview = director->getOpenGLView();
    if(!glview) {
        glview = GLView::create("My Game");
	glview->setFrameSize(800,450);<span style="color:#ff0000;">//------------------Win32下先set----------------------</span>
        director->setOpenGLView(glview);
    }
	
	glview->setDesignResolutionSize(800,450,ResolutionPolicy::SHOW_ALL);//屏幕自适应
    /*..........省略.....................*/
    return true;
}

好吧，到上面一步可以F5测试，按钮之后，可以看到回调相应函数输出

然后加入关卡选择Scene

#ifndef __GameLvlChoose__H__
#define __GameLvlChoose__H__

#include "cocos2d.h"
USING_NS_CC;

class GameLvlChoose : public Layer{
public:
	GameLvlChoose();
	~GameLvlChoose();
	virtual bool init();
	CREATE_FUNC(GameLvlChoose);

	static Scene* createScene();

private:
	//--1--在init里面添加菜单，这里是回调函数
    void level_1(Ref* pSender);
    void level_2(Ref* pSender);
    void level_3(Ref* pSender);

	//--1--根据不同级别createLabel，菜单标签
	Label* createLevelLab(const char* sLvl);

	int _level;
};/**/

#endif

.cpp

#include "GameLvlChoose.h"

GameLvlChoose::GameLvlChoose(){
	_level = 1;
}
GameLvlChoose::~GameLvlChoose(){
}

Scene* GameLvlChoose::createScene(){
	Scene* scene = Scene::create();

	auto layer = GameLvlChoose::create();

	scene->addChild(layer);

	return scene;
}

bool GameLvlChoose::init(){
	auto visibleSize = Director::getInstance()->getVisibleSize();
	
	//**1**-------- 创建关卡选则菜单 ------------------------------
	const char* norImg = "Button/choose_btn_nor.png";
	const char* lightImg = "Button/choose_btn_light.png";
	
	//Lv_1
	auto level_1_Item = MenuItemImage::create(norImg, lightImg, CC_CALLBACK_1(GameLvlChoose::level_1,this));
	level_1_Item->addChild(createLevelLab("1"));
	
	//Lv_2
	auto level_2_Item = MenuItemImage::create(norImg, lightImg, CC_CALLBACK_1(GameLvlChoose::level_2,this));
	level_2_Item->addChild(createLevelLab("2"));
	
	//Lv_3
	auto level_3_Item = MenuItemImage::create(norImg, lightImg, CC_CALLBACK_1(GameLvlChoose::level_3,this));
	level_3_Item->addChild(createLevelLab("3"));
	
	//**1**菜单
	auto menu = CCMenu::create(level_1_Item, level_2_Item, level_3_Item, nullptr);
	//**1**按照一行放置
	menu->alignItemsHorizontallyWithPadding(20);
	menu->setPosition(ccp(visibleSize.width / 2, visibleSize.height / 2));

	this->addChild(menu);

	return true;
}

Label* GameLvlChoose::createLevelLab(const char* sLvl) {
	auto level_lab = Label::create(sLvl, "Arial", 60);
	level_lab->setColor(Color3B::RED);
	level_lab->setPosition(ccp(60, 60));

	return level_lab;
}

void GameLvlChoose::level_1(CCObject* pSender) {
	CCLOG("111111");
	_level = 1;
}

void GameLvlChoose::level_2(CCObject* pSender) {
	CCLOG("222222");
	_level = 2;
}

void GameLvlChoose::level_3(CCObject* pSender) {
	CCLOG("333333");
	_level = 3;
}

之后可以，在MainScene里面的StartGame函数里面，切换场景

四：小结&下次预览

小结：没啥好说的。。。

下次我们要开始实现编辑Scene啦，我们可以自由编辑每一级别关卡的怪物行走路线以及可以放英雄的炮台位置

------------------------------------------------------

代码&资源

------------------------------------------------------
个人愚昧观点，欢迎指正与讨论-------

cocos2d-x 3.0游戏实例学习笔记《卡牌塔防》第一步---开始界面&关卡选择

声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉：投诉/举报工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。

联系
我们

首页 > 代码库 > cocos2d-x 3.0游戏实例学习笔记《卡牌塔防》第一步---开始界面&关卡选择

cocos2d-x 3.0游戏实例学习笔记《卡牌塔防》第一步---开始界面&关卡选择

看完仍有疑问？有类似问题直接问程序猿