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));

今天就到这里了哦