寒風的Cocos2dx之旅之剪刀、石头、布系列专题(1)

前端之家收集整理的这篇文章主要介绍了寒風的Cocos2dx之旅之剪刀、石头、布系列专题(1)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

本节小编为读者们讲述如何在cocos2d上做一个剪刀石头布的游戏,游戏画面如下:


首先看到这个画面:我们来分析一下它到底有几个层?有菜单层、显示结果层、显示分数层、显示菜单背景层。宏观角度上看:有3个层:背景层->精灵层->菜单层。

让我们看看SettingScene.h头文件中都定义了什么:

#include "cocos2d.h"
#include "HelloWorldScene.h"
class SettingScene:public cocos2d::Layer
{
public:
	static cocos2d::Scene* createScene();
	//初始化╮(╯▽╰)╭
    virtual bool init();
    //定义的监听回调函数╮(╯▽╰)╭
    void shitou(cocos2d::Ref* pSender);
    void jiandao(cocos2d::Ref* pSender);
	void bu(cocos2d::Ref* pSender);
	//宏定义*************************************PS:当时就是因为下边括号里是HelloWorld而纠结为何场景不能切换╮(╯▽╰)╭
	CREATE_FUNC(SettingScene);
	 //分别设定点击按钮的背景、分数框体的背景
    cocos2d::LayerColor* backcolor1;
	cocos2d::LayerColor* backcolor2;
	cocos2d::LayerColor* backcolor3;
	//定义显示数字的标签控件
    cocos2d::LabelTTF* LabelTTFCountscore;
	cocos2d::LabelTTF* LabelTTFWinscore;
	cocos2d::LabelTTF* LabelTTFLosescore;
	cocos2d::LabelTTF* LabelTTFDrawscore;
	//定义计算出拳次数
	void ChuquanCount();
    //定义胜利次数
	void WinCount();
	//定义失败次数
	void LoseCount();
	//定义平局次数
	void DrawCount();
};
之后先在SettingScene.cpp中实现场景的回调:

Scene* SettingScene::createScene()
{
    auto scene = Scene::create();
	auto layer = SettingScene::create();
    scene->addChild(layer);
    return scene;
}
在Init()中定义:

	//设置按钮的背景
	backcolor1 = cocos2d::LayerColor::create(cocos2d::Color4B(0xFF,0x00,0x80),visibleSize.width-350,200);
	backcolor1->setPosition(Point(200,10));
	//backcolor1->setAnchorPoint(Point(200,0));
    this->addChild(backcolor1);
	//设置分数框体背景
	backcolor2= cocos2d::LayerColor::create(cocos2d::Color4B(30,144,255,255),140,150);
	backcolor2->setPosition(Point(30,340));
	this->addChild(backcolor2);
	//设置PLAY标签
	auto LabelTTFPlay=LabelTTF::create("Play:","HiraKakuProN-W3",30);
	LabelTTFPlay->setPosition(Point(250,190));
	LabelTTFPlay->setColor(Color3B(0,127));//*********************RGB颜色
	addChild(LabelTTFPlay);
	//设置分数标签
	auto LabelTTFCount=LabelTTF::create("count:",30);
	LabelTTFCount->setPosition(Point(80,460));
	addChild(LabelTTFCount);
	auto LabelTTFWin=LabelTTF::create("Win:",30);
	LabelTTFWin->setPosition(Point(80,430));
	addChild(LabelTTFWin);
	auto LabelTTFLose=LabelTTF::create("Lose:",30);
	LabelTTFLose->setPosition(Point(80,400));
	addChild(LabelTTFLose);
	auto LabelTTFDraw=LabelTTF::create("draw:",30);
	LabelTTFDraw->setPosition(Point(80,370));
	addChild(LabelTTFDraw);
	//游戏提示关键词:
	auto LabelTTFPlayer=LabelTTF::create("Player",40);
	LabelTTFPlayer->setPosition(Point(350,500));
	addChild(LabelTTFPlayer);
	auto LabelTTFCom=LabelTTF::create("Com",40);
	LabelTTFCom->setPosition(Point(650,500));
	addChild(LabelTTFCom);
现在我们把几个背景层建立好了,下边就是将菜单层放到我们的背景中:

        //添加所需要的精灵
	auto sprite01=Sprite::create("shitou.png");
	sprite01->setPosition(Point(300,100));
	this->addChild(sprite01);

	auto sprite02=Sprite::create("jiandao.png");
	sprite02->setPosition(Point(500,100));
	this->addChild(sprite02);

	auto sprite03=Sprite::create("bu.png");
	sprite03->setPosition(Point(700,100));
	this->addChild(sprite03);

	auto sprite04=Sprite::create("title.png");
	sprite04->setPosition(Point(500,550));
	this->addChild(sprite04);

	auto spritePlayer=Sprite::create("shitou.png");
	spritePlayer->setPosition(Point(350,350));
	this->addChild(spritePlayer);
	spritePlayer->setScale(1,1);

	auto spriteComputer=Sprite::create("shitou.png");
	spriteComputer->setPosition(Point(650,350));
	this->addChild(spriteComputer);
	spriteComputer->setScale(1,1);

	//加入具体的分数
	LabelTTFCountscore=LabelTTF::create("0",30);
	LabelTTFCountscore->setPosition(Point(150,460));
	addChild(LabelTTFCountscore);
	LabelTTFWinscore=LabelTTF::create("0",30);
	LabelTTFWinscore->setPosition(Point(150,430));
	addChild(LabelTTFWinscore);
        LabelTTFLosescore=LabelTTF::create("0",30);
	LabelTTFLosescore->setPosition(Point(150,400));
	addChild(LabelTTFLosescore);
	LabelTTFDrawscore=LabelTTF::create("0",30);
	LabelTTFDrawscore->setPosition(Point(150,370));
	addChild(LabelTTFDrawscore);
PS:小编我当时编写程序的时候遇到了个问题,在这里想跟大家分享一下

①Layer这个类没法定义锚点,所以要setPosition来定义它的位置,在你定义背景的长度宽度基础上。

cocos2d::Color4B(30,150

括号里的前三个是颜色值RGB,百度一下RGB颜色表。最后一个是透明度,255是不透明,0是全透明。140和159分别代表背景区域的宽度和高度。

这样游戏界面就顺利完成了!

猜你在找的Cocos2d-x相关文章