cocos2dX UI控件之CCControlButton

我們今天繼續來學習cocos2dXde 控件, 嗯, 今天我們學習的是CCControlButton, 看名字我們就知道這是一個控制按鈕, 老規矩, 我們先準備一些資源文件

1是默認的, 2是選中的, 3是禁用狀態的

先來看看函數:

CCControlButton::create( 九妹對象);//關於九妹我就不解釋了額, 如果有忘了的朋友, 可以參考<<cocos2dX UI控件之CCEditBox>>

CCControlButton::create( 文字標籤, 九妹對象);

按鈕狀態:

CCControlStateDisabled            //禁用

CCControlStateHighlighted        //點擊

CCControlStateNormal               //正常

setBackgroundSpriteForState( 九妹對象, 按鈕狀態);

setTitleColorForState( CCC3顏色, 按鈕狀態);

setTitleForState( 字體標籤, 按鈕狀態);

關於CCControlButton, 我們可以這麼看, CCControlButton具有按鈕的一切屬性和方法, 我們可以往裏面添加標題和背景初始化

廢話少說, 我們來創建一個CCControlButton:

記得加上 cocos-ext.h和USING_NS_CC_EXT哦

//創建3個九妹對象作爲背景
	CCScale9Sprite* bg1 = CCScale9Sprite::create( "1.png");		//默認
	CCScale9Sprite* bg2 = CCScale9Sprite::create( "2.png");		//選中
	CCScale9Sprite* bg3 = CCScale9Sprite::create( "3.png");		//禁用

	CCLabelTTF* ttf = CCLabelTTF::create( "chick me", "Arial", 50);
	CCControlButton* cb = CCControlButton::create( ttf, bg1);
	cb->setBackgroundSpriteForState( bg2, CCControlStateHighlighted);	//點擊時候
	cb->setBackgroundSpriteForState( bg3, CCControlStateDisabled);		//禁用的時候
	cb->setPosition( ccp( visibleSize.width / 2 - 100, visibleSize.height / 2));
	addChild( cb, 0, 101);

	CCScale9Sprite* bg12 = CCScale9Sprite::create( "1.png");
	CCScale9Sprite* bg22 = CCScale9Sprite::create( "2.png");
	CCScale9Sprite* bg32 = CCScale9Sprite::create( "3.png");
	CCLabelTTF* ttf2 = CCLabelTTF::create( "lock", "Arial", 50);
	CCControlButton* cb2 = CCControlButton::create( ttf2, bg12);
	cb2->setBackgroundSpriteForState( bg22, CCControlStateHighlighted);
	cb2->setBackgroundSpriteForState( bg32, CCControlStateDisabled);
	cb2->setEnabled( false);											//設置禁用
	cb2->setPosition( ccp( visibleSize.width / 2 + 100, visibleSize.height / 2));
	addChild( cb2, 0, 102);

我們來看看效果:

沒有點擊的時候:

被點擊的時候:

左邊的可以被點擊, 而右邊的不能被點擊, 簡單吧, 可是光這樣我們沒有什麼用處( 旁白: 我就說吧, 怎麼沒有反應), 下面我們就來實現消息事件:

CCControlEvenTouchDown                   //按下

CCControlEvenTouchDragInside          //在按鈕內部拖動

CCControlEvenTouchDragOutside       //在其按鈕外部拖動

CCControlEventTouchDragEnter //按下進入按鈕

CCControlEvenTouchDragExit              //按下離開按鈕

CCControlEvenTouchUpinside              //在按鈕內部擡起

CCControlEvenTouchUpOutside           //在按鈕外部擡起

CCControlEventTouchCancel //按鈕被其他事件中斷

CCControlEvenTouchCancel                 //取消所有觸點

首先, 我們實現兩個回調函數, 一個是按鈕點擊時的回調函數, 一個是按住之後進入按鈕的回調函數:

void touchDown(CCObject* pSender, CCControlEvent event);
	void inButton(CCObject* pSender, CCControlEvent event);

然後我們來實現這兩個函數:

void HelloWorld::menuCloseCallback(CCObject* pSender)
{
}

void HelloWorld::touchDown(CCObject* pSender, CCControlEvent event)
{
	CCControlButton* cb = (CCControlButton*)this->getChildByTag( 102);
	cb->setEnabled( true);
}

void HelloWorld::inButton(CCObject* pSender, CCControlEvent event)
{
	CCLabelTTF* ttf = CCLabelTTF::create( "in button 2", "Arial", 24);
	ttf->setPosition( ccp( CCDirector::sharedDirector()->getWinSize().width / 2,
							CCDirector::sharedDirector()->getWinSize().height / 2 - 100));
	addChild( ttf);
}

將事件綁定上去:

cb->addTargetWithActionForControlEvents(		//點擊
		this,
		cccontrol_selector(HelloWorld::touchDown),
		CCControlEventTouchDown
		);
	cb2->addTargetWithActionForControlEvents(		//點擊之後, 移動
		this,
		cccontrol_selector(HelloWorld::inButton),
		CCControlEventTouchDragInside
		);

來看看效果吧, 辛苦了這麼久;;

我們店家了Button1, Button2就可以使用了

然後我們點擊Button2, 並按住鼠標在Button2裏面移動:

是不是很簡單, 大家要多練習哦, 

還有, 由於我們使用的背景圖是九妹對象, 所以我們的背景圖是字符串有多大, 背景有多大, 我們可以用setPreferredSize設置背景的默認大小哦, 當然, 字符串的長度如果超過了背景圖的大小, 也會自動擴展的.

 cb->setPreferredSize(CCSize(300, 50));

今天就到這裏了哦