关闭

【Cocos2d-x 游戏开发】 2 --- Button、CCMoveBy

标签: 游戏编程cocos2dx游戏开发
525人阅读 评论(0) 收藏 举报
分类:

好久没写了,今天抽空补一篇.....

cocos2dx中包含很多物体运动方式、特效的函数,这使得我们在实现某些功能时很方便,关于这些,大家可以自行百度“cocos2dx中常见的46中动作+22中特效详解"进行学习。

今天的工程涉及CCMoveBy,Buttob的使用,先看一下效果图。


(是不是很熟悉,嘿嘿 )由于手里的资源短缺,所以某些地方缺了零件,不过不影响今天的内容,大家先凑合看看,回头自行完善吧。。。大笑

打开cocos studio,新建一个开发语言是C++的项目。由于我们项目的背景图是700*600的,所以我们修改项目场景大小为700*600(默认没有700*600的使用自定义尺寸)。


接下来在资源栏导入今天使用的资源,然后删除项目中原有的png资源(个人习惯把一类功能的资源归到一个文件夹便于管理)


新建一个精灵到场景,使用"image3245"作为精灵的贴图,设置位置为350,300,尺寸使用原尺寸(700*600),接下来发布项目到Visual studio,使用visual studio打开项目(以上内容如果不会,可以看第一节内容)。此时F5运行查看,发现图片只占了屏幕左下角,看下一步吧(如果显示一切正常,可以跳过下一步了)

打开文件AppDelegate.cpp,定位到applicationDidFinishLaunching函数,修改以下代码调整窗口大小到700*600

glview = GLViewImpl::createWithRect("KingdomBrush", Rect(0, 0, 700, 600));
director->getOpenGLView()->setDesignResolutionSize(700, 600, ResolutionPolicy::SHOW_ALL);
再次运行,背景完整显示了吧。


接下来做背景上的图,我们发现背景以上有5个对象,其中四个对象只是用来显示的(姑且这么认为),一个对象是一个按钮(start)。由于这5个对象要运动,把他们当做精灵比较方便,但是有一个按钮,按钮使用精灵的话,按钮的不同贴图切换就比较复杂,所以我们在cocos studio中新建五个控件,其中四个是精灵,一个是按钮。



其中俩个精灵的贴图为”image3278",另外俩个精灵的贴图为"image3279"和"image3289",按钮使用"image 3264"和"image 3264"作为正常状态和按下状态的贴图,禁用状态先不管,加好贴图以后需要调整各控件的位置,使之位于我们效果图的位置(开始按钮上面的铁链精灵需要使用缩放放大一些),注意这里需要调整各控件的层级关系,在上面的图中可以调整各控件的层级关系,在界面中越靠上的,在上图中的位置越靠下,那么Sprite_1就是我们的背景,因为他在整个图的最底层。(这里的层级关系大家可以看成是ps中的层级,如果你不会ps,就当我没说...)调整好这些控件以后发布资源,切换到visual studio,ctrl+s保存一下,F5执行程序,看看我们的效果,如果和我们要的效果不一样,返回cocos studio继续调整。

接下来我们实现控件的运行效果。控件运动使用CCMoveBy函数实现,因为有一个先后顺序,所以我们在设计之前需要确定每一个控件的时间差,这里我使用时间差相差0.1s,控件位置相差100px,然后依次计算每一个控件的初始位置,然后再程序运行后,依次运动到我们刚刚调整好的位置上。搞明白这个过程就可以写了,打开HelloWorld.cpp的init函数在addChild(rootNode)之后添加以下代码

	//Sprite move speed:0.1s Move 100 Pixel
	//Title init postion(350,820),Move to(350,420) 
	CCSprite* TitleSprite = (CCSprite*)rootNode->getChildByName("Sprite_4");
	CCActionInterval* moveBy1 = CCMoveBy::create(0.4f, ccp(0, -400));
	TitleSprite->runAction(moveBy1);

	//Chain1 Init position(350,820),Move to(350,220)
	CCSprite* ChainSprite1 = (CCSprite*)rootNode->getChildByName("Sprite_3");
	CCActionInterval * moveBy2 = CCMoveBy::create(0.6f, ccp(0, -600));
	ChainSprite1->runAction(moveBy2);

	//Button Sprite Init position(350,790),Move to(350,190)
	CCSprite* BtnSprite = (CCSprite*)rootNode->getChildByName("Button_1");
	CCActionInterval* moveBy3 = CCMoveBy::create(0.6, ccp(0, -600));
	BtnSprite->runAction(moveBy3);

	//Chain2 Init position(350,810),Move to(350,110)
	CCSprite* ChainSprite2 = (CCSprite*)rootNode->getChildByName("Sprite_2");
	CCActionInterval * moveBy4 = CCMoveBy::create(0.7f, ccp(0, -700));
	ChainSprite2->runAction(moveBy4);

	//About Init position(350,890),Move to(350,90)
	CCSprite* AboutSprite = (CCSprite*)rootNode->getChildByName("Sprite_5");
	CCActionInterval* moveBy5 = CCMoveBy::create(0.8, ccp(0, -800));
	AboutSprite->runAction(moveBy5);

注意这里,由于按钮控件不能执行MoveBy,所以这里我们把他转为Sprint类型,以实现按钮的运动。

以上代码 如果看不懂,那么你需要多看看其他教程了 。

执行我们的程序,发现我们的效果实现了(当然和原版的差了很多,以后慢慢完善吧)


最后我们为按钮添加响应。接着上面的代码写

<span style="white-space:pre">	</span>//Button
	Button* StartBtn = (Button*)rootNode->getChildByName("Button_1");
	StartBtn->addTouchEventListener(CC_CALLBACK_2(HelloWorld::BtnStartCallback, this));

这里我们为按钮添加回调函数,所以接下来要在HelloWorld类中添加BtnStartCallback函数,在HelloWorld.h中添加public函数定义

<span style="white-space:pre">	</span>//Start button Callback function
	void BtnStartCallback(Ref* pSender, Widget::TouchEventType type);
回到.cpp文件

void HelloWorld::BtnStartCallback(Ref* pSender, Widget::TouchEventType type)
{
	MessageBox("按钮", "提示");
}

回调函数我们使用MessageBox,验证按钮消息的响应,

注意在.h文件中添加命名空间

using namespace cocos2d::ui;
执行一下我们的项目,点击开始............网速问题,先上传资源文件,工程文件下次补上 

工程下载:链接:http://pan.baidu.com/s/1nt46GVv 密码:h7to

以上内容,如有错误,望大家指出...谢谢微笑

7/11 --- 0:30 Bug


0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:9317次
    • 积分:150
    • 等级:
    • 排名:千里之外
    • 原创:5篇
    • 转载:2篇
    • 译文:0篇
    • 评论:0条
    文章分类