cocos2dx d出式模态对话框的实现与封装

cocos2dx d出式模态对话框的实现与封装,第1张

概述原文网址:http://blog.sina.com.cn/s/blog_705a5ff00101ox4s.html     在用Cocos2DX引擎开发游戏的过程中,我们经常需要d出一个对话框或者提示框,通知玩家一些必要的信息。这时候我们就需要考虑怎样设计和封装一个这样的d出对话框。首先,这样的d出框一般都是“模态窗口”,即在没有对当前d出的对话框进行确认的时候,不能继续往下 *** 作。        

原文网址:http://blog.sina.com.cn/s/blog_705a5ff00101ox4s.HTML


在用Cocos2DX引擎开发游戏的过程中,我们经常需要d出一个对话框或者提示框,通知玩家一些必要的信息。这时候我们就需要考虑怎样设计和封装一个这样的d出对话框。首先,这样的d出框一般都是“模态窗口”,即在没有对当前d出的对话框进行确认的时候,不能继续往下 *** 作。

一个对话框一般包含几个部分:背景图、两个按钮(个数可定制)、标题、文字内容。我们需要使对话框为模态窗口,并设置d出效果。下面来说说创建d出对话框的要点:


1、d出层的触摸优先级, *** 作与显示相一致

因为d出对话框是“模态窗口”,所以我们需要设置触摸优先级来保证对话框是模态的。

在这里我们以Ccmenu作为对话框按钮的 *** 作实现,我们知道Ccmenu的默认触摸级别是-128,那么我们的【d出层】触摸级别该设置为多少?

在我们设定触摸级别时,请记住一句话, *** 作与显示相一致。此话何意?现在设想这样一种情况,我们为了屏蔽d出层以外所有的层的 *** 作,而将d出层级别置为-129 ,这样便保证了它是模态的了(一般而言,除了 Ccmenu的级别,用户自定义也无需这么大),但是如果当前d出层上方还有其它的层(也可以是d出层的父节点上方有其它层,如多层的 UI设计),并且其上也有 Ccmenu 按钮,那么就出现了显示在 d出层上放层中的 Ccmenu 按钮不能点击,这不科学!实际,在d出层的Ccmenu 也不能点击,只是我们可以通过将d出层的触摸消息传递给层中的 Ccmenu解决。所以设置为一味的追求最大的触摸优先级,并不可取,它不能很好的做到 *** 作与显示相一致,而优先级小于 Ccmenu并不能屏蔽下方的其它 Ccmenu *** 作,所以对于d出层本身,它设置为 -128是合理的,对于同样级别的这些元素来说(d出层和Ccmenu),能够做到,显示在最上方的优先处理。如果在d出层上方还有层,是可以点击的,为什么不呢!而我们要做的是,通过逻辑控制,让d出层节点,最后添加到场景的最上方。

所以,在这里层本身的触摸优先级别设置为 -128 ,而d出层中的按钮是Ccmenu,都是同级, *** 作与显示相一致,唯一要注意的是逻辑的控制,什么时候d出层,由哪个节点d出层(一般由场景基层来负责),以保证它显示在最上方。


2、定制按钮个数

我们可以定制按钮的个数。在封装的时候添加addbutton方法,用来在当前对话框中动态地添加一个或几个按钮,而添加几个?当然由你来决定。但确定的是,它们的位置会随着按钮个数的不同而不同,如果一个按钮,将居中显示(一分为二),如果两个(三等份距离),如果三个(四等份距离),以此类推。这里addbutton()的主要作用是创建一个menuItem添加到Menu中。然后在onEnter中(此时按钮个数已经确定)计算并设置各按钮的位置,并添加至界面之中。


3、窗口的大小可变

d出对话框的窗口大小要是可变的,通过 getContentSize 来获取。

如果没有设置ContentSize ,那么采取的方案是,窗口大小与传入图片一样大。 如果设置了ContentSize,则将窗口设定为指定大小。这时候需要将背景图片进行缩放,如何缩放?【答案】是利用9宫格图CCScale9Sprite缩放图片,缩放带圆角的图片。原理如下: 九宫格图是 通过1个CCSpriteBatchNode和9个CCSprite来实现的,原理很简单,通过将原纹理资源切割成9部分(PS:这也是叫9宫格的原因),保持4个角不变形,根据想要的尺寸来进行拉伸或压缩。

使用方法:CCScale9Sprite* background=CCScale9Sprite::create("back.png"); background->setContentSize(CCSizeMake(400,200));//400x200是要生成的尺寸 background->setposition(Center); this->addChild(background);

4、回调函数的实现方案

对于回调一般有两种方式,一种是 delegate回调,这需要定义接口,由上层,继承实现接口,并把自己当作参数,传入d出层,由d出层调用 delegate 的接口方法实现,在Cocos2d-x 里面很多地方用到此方式。另一种则是函数绑定,就像 Ccmenu 那样的绑定函数。

在这里设计的是按钮个数可变,功能也不尽相同,所以我们选择绑定函数!进一步封装,将d出层的按钮回调函数设置为内部实现,然后在回调给它的上层,之后关闭对话框(关闭的 *** 作由对话框层来完成)。回调给它的上层的时候传递CCNode参数,以其 tag 标示,点击的是哪个按钮。【用voIDsetCallbackFunc(CCObject* target,SEL_CallFuncN callfun);作为外部接口,设置上层对象和上层的回调函数。】


5、onEnter动态创建d出层

根据设置的属性去创建层有两种方式:

其一,实时设置,实时刷新。比如在 staticPopupLayer* create(const char* gackgroundImage)的实现里面,创建一个精灵,并设置好图片,添加到当前层,如果调用了 setContentSize我们再在此方法获取精灵后去修改这个精灵的大小 其二,保留属性,动态组建。也就是说前面一些封装的函数比如setTitle()、setContentText(),addbutton()、setCallbackFunc()只用于设置属性参数(即给变量赋值)。参数设置好以后,在一个适当的执行时期,根据以上参数,动态创建符合需求的精灵/层,而这个 *** 作在onEnter 里尤为合适。 在这里我们使用动态组建的方式,即在前面用一些变量来保存对话框所需的信息, 然后在 onEnter 中,读取这些信息,以实时添加至界面之中。


封装

//PopupLayer.h

#include "cocos2d.h"

#include "cocos-ext.h"

USING_NS_CC;

USING_NS_CC_EXT;


classpopupLayer : public cclayer{

public:

PopupLayer();

~PopupLayer();

virtualbool init();


//需要重写触摸注册函数,重新给定触摸级别

virtualvoID registerWithtouchdispatcher();

//重写触摸函数,返回true,屏蔽其它层,达到“模态”效果

boolcctouchBegan(CCtouch *ptouch,CCEvent *pEvent);


//静态创建函数,创建一个d出层,设置背景图片

staticPopupLayer* create(const char* backgroundImage);


//设置标题

voIDsetTitle(const char* Title,int Fontsize = 20);

//设置文本内容,padding为文字到对话框两边预留的距离,这是可控的,距上方的距离亦是如此

voIDsetContentText(const char* text,int Fontsize=20,int padding=50,int paddingtop=100);


//设置上层对象和上层回调函数,用于回调时传递CCNode参数

voIDsetCallBackFunc(CCObject* target,SEL_CallFuncNcallfun);


//添加menuItem按钮,封装了一个函数,传入些必要的参数

booladdbutton(const char* normalimage,const char* selectedImage,constchar* Title,int tag=0);


//为了在显示层时的属性生效,选择在onEnter里动态生成

virtualvoID onEnter();

virtualvoID onExit();


CREATE_FUNC(PopupLayer);


private:

voIDbuttonCallBack(CCObject* pSender);


//文字内容两边的空白区域

intm_contentpadding;

intm_contentpaddingtop;

CCObject* m_callbackListener;

SEL_CallFuncN m_callback;

//定义了Ccmenu*类型变量m_pMenu,并且直接定义默认的set/get方法

CC_SYNTHESIZE_RETAIN(Ccmenu*,m_pMenu,Menubutton);

CC_SYNTHESIZE_RETAIN(CCSprite*,m_sfBackGround,SpriteBackGround);

CC_SYNTHESIZE_RETAIN(CCScale9Sprite*,m_s9BackGround,Sprite9BackGround);

CC_SYNTHESIZE_RETAIN(cclabelTTF*,m_ltTitle,LabelTitle);

CC_SYNTHESIZE_RETAIN(cclabelTTF*,m_ltContentText,LabelContentText);

};


//PopupLayer.cpp

#include"PopupLayer.h"

USING_NS_CC;


//构造函数中变量设初值

PopupLayer::PopupLayer()

{

m_contentpadding =0;

m_contentpaddingtop =0;

m_pMenu =NulL;

m_callbackListener =NulL;

m_callback =NulL;

m_sfBackGround =NulL;

m_s9BackGround =NulL;

m_ltContentText =NulL;

m_ltTitle =NulL;

}


//释放

PopupLayer::~PopupLayer()

{

CC_SAFE_RELEASE(m_pMenu);

CC_SAFE_RELEASE(m_sfBackGround);

CC_SAFE_RELEASE(m_s9BackGround);

CC_SAFE_RELEASE(m_ltContentText);

CC_SAFE_RELEASE(m_ltTitle);

}


//初始化

boolPopupLayer::init()

{

if ( !cclayer::init()){

returnfalse;

}


this->setContentSize(CCSizeZero);

//初始化需要的Menu

Ccmenu* menu =Ccmenu::create();

menu->setposition(CCPointZero);

setMenubutton(menu);//set()方法


settouchEnabled(true);//开启触摸响应

returntrue;

}


//重写触摸注册函数,重新给定触摸级别

voIDPopupLayer::registerWithtouchdispatcher(){

//这里的触摸优先级设置为-128,与Ccmenu同级,保证了屏蔽下方的触摸

CCDirector::sharedDirector()->gettouchdispatcher()->addTargetedDelegate(this,-128,true);

}


//触摸函数cctouchBegan,返回true

boolPopupLayer::cctouchBegan( CCtouch *ptouch,CCEvent *pEvent){

returntrue;

}


//创建一个d出层,给背景精灵变量赋值

PopupLayer*PopupLayer::create( const char* backgroundImage){

PopupLayer* popup =PopupLayer::create();

popup->setSpriteBackGround(CCSprite::create(backgroundImage));

popup->setSprite9BackGround(CCScale9Sprite::create(backgroundImage));

returnpopup;

}


//给标题变量赋值

voID PopupLayer::setTitle(const char* Title,int Fontsize ){

cclabelTTF* ltfTitle =cclabelTTF::create(Title,"Arial",Fontsize);

ltfTitle->setcolor(ccc3(0,0));

setLabelTitle(ltfTitle);

}


//给文本变量赋值

voIDPopupLayer::setContentText( const char* text,int Fontsize,intpadding,int paddingtop ){

cclabelTTF* content =cclabelTTF::create(text,Fontsize);

content->setcolor(ccc3(0,0));

setLabelContentText(content);

m_contentpadding =padding;

m_contentpaddingtop =paddingtop;

}


//给下层层变量和回调函数变量赋值

voIDPopupLayer::setCallBackFunc( CCObject* target,SEL_CallFuncNcallfun ){

m_callbackListener =target;

m_callback =callfun;

}


//给menu菜单变量添加Item

bool PopupLayer::addbutton(const char* normalimage,const char*Title,int tag ){

CCSize winSize =CCDirector::sharedDirector()->getWinSize();

CCPoint center =ccp(winSize.wIDth/2,winSize.height/2);


// 创建图片菜单按钮

CcmenuItemImage* menuImage =CcmenuItemImage::create(

normalimage,selectedImage,this,menu_selector(PopupLayer::buttonCallBack));

menuImage->setTag(tag);

menuImage->setposition(center);


//添加文字说明并设置位置

CCSize menuSize =menuImage->getContentSize();

cclabelTTF* ttf =cclabelTTF::create(Title,15);

ttf->setcolor(ccc3(0,0));

ttf->setposition(ccp(menuSize.wIDth/2,menuSize.height/2));

menuImage->addChild(ttf);


getMenubutton()->addChild(menuImage);

returntrue;

}


//销毁d出框,传递参数node给下层

voIDPopupLayer::buttonCallBack( CCObject* pSender ){

CCNode* node =dynamic_cast(pSender);

cclog("touch tag: %d",node->getTag());

if (m_callback &&m_callbackListener)

{

//执行HelloWorld层的回调函数,传递node参数

(m_callbackListener->*m_callback)(node);

}

this->removeFromParentAndCleanup(true);

}


//全部参数都设定好后,在运行时动态加载

voIDPopupLayer::onEnter(){

cclayer::onEnter();


CCSize winSize =CCDirector::sharedDirector()->getWinSize();

CCPoint center =ccp(winSize.wIDth/2,winSize.height/2);

CCSizecontentSize;

//设定好参数,在运行时加载

if(getContentSize().equals(CCSizeZero)){

getSpriteBackGround()->setposition(center);

this->addChild(getSpriteBackGround(),0);

contentSize =getSpriteBackGround()->getTexture()->getContentSize();

}

else{

CCScale9Sprite* background =getSprite9BackGround();

background->setContentSize(getContentSize());

background->setposition(center);

this->addChild(background,0);

contentSize =getContentSize();

}


//添加按钮,并根据Item的个数设置其位置

this->addChild(getMenubutton());

float btnWIDth =contentSize.wIDth /(getMenubutton()->getChildrenCount()+1);

CCArray* array =getMenubutton()->getChildren();

CCObject* pObj =NulL;

int i = 0;

CCARRAY_FOREACH(array,pObj){

CCNode* node =dynamic_cast(pObj);

node->setposition(ccp(winSize.wIDth/2- contentSize.wIDth/2 +btnWIDth*(i+1),

winSize.height/2 -contentSize.height/3));

i++;

}


// 显示对话框标题

if(getLabelTitle()){

getLabelTitle()->setposition(ccpAdd(center,ccp(0,contentSize.height/2 - 25.0f)));

this->addChild(getLabelTitle());

}


//显示文本内容

if(getLabelContentText()){

cclabelTTF* ltf =getLabelContentText();

ltf->setposition(center);

ltf->setDimensions(CCSizeMake(contentSize.wIDth- m_contentpadding*2,contentSize.height -m_contentpaddingtop));

ltf->setHorizontalAlignment(kCCTextAlignmentleft);

this->addChild(ltf);

}


//d出效果

CCSequence *popupActions =CCSequence::create(

CCScaleto::create(0.0,0.0),

CCScaleto::create(0.06,1.05),

CCScaleto::create(0.08,0.95),1.0),NulL);

this->runAction(popupActions);

}


//退出

voIDPopupLayer::onExit(){

cclayer::onExit();

}

d出层调用:

//定义一个d出层,传入一张背景图片

PopupLayer* popup =PopupLayer::create("popupBackGround.png");

//ContentSize是可选的设置,可以不设置,如果设置则把它当做9图缩放

//popup->setContentSize(CCSizeMake(400,360));

popup->setTitle("Message");

popup->setContentText("Mostpeople... blunder round this city.",20,50,150);

//设置回调函数,回调传回一个CCNode以获取tag判断点击的按钮

//这只是作为一种封装实现,如果使用delegate那就能够更灵活的控制参数了

popup->setCallBackFunc(this,callfuncN_selector(HelloWorld::buttonCallBack));

//添加按钮,设置图片、文字,tag信息

popup->addbutton("button.png","button.png","Ok",0);

popup->addbutton("button.png","Cancel",1);

this->addChild(popup);


测试截图:






这样,对话框的基本模型就完成了,它实现了以下功能:

一个可以d出的对话框实现 模态窗口的实现(需要逻辑的控制) 多按钮的支持,位置自适应,提供回调函数 提供标题和内容设置 支持 九图,控制适应d出框大小


参考文:http://blog.csdn.net/u012421525/article/details/14231205

总结

以上是内存溢出为你收集整理的cocos2dx d出式模态对话框的实现与封装全部内容,希望文章能够帮你解决cocos2dx d出式模态对话框的实现与封装所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1024967.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-23
下一篇 2022-05-23

发表评论

登录后才能评论

评论列表(0条)