Cocos2D-x CCControlButton

这篇文章将详细介绍一下，如何使用extension/GUI中提供的CCControlButton，也就是button啦！平常我们用到buton的时候更多的是会想到用CCMenu，但是创建起来相对麻烦，首先要一个menu，然后还要一个menu item，这样用起来实在不爽。使用CCControlButton可以很简约的创建一个button。

下面分步骤介绍一下使用规则吧！

一、首先

#include "cocos-ext.h"
USING_NS_CC_EXT;

二、需要了解其中的两个枚举

（1）触摸事件

/** Kinds of possible events for the control objects. */
enum 
{
    CCControlEventTouchDown           = 1 << 0,    // A touch-down event in the control.
    CCControlEventTouchDragInside     = 1 << 1,    // An event where a finger is dragged inside the bounds of the control.
    CCControlEventTouchDragOutside    = 1 << 2,    // An event where a finger is dragged just outside the bounds of the control. 
    CCControlEventTouchDragEnter      = 1 << 3,    // An event where a finger is dragged into the bounds of the control.
    CCControlEventTouchDragExit       = 1 << 4,    // An event where a finger is dragged from within a control to outside its bounds.
    CCControlEventTouchUpInside       = 1 << 5,    // A touch-up event in the control where the finger is inside the bounds of the control. 
    CCControlEventTouchUpOutside      = 1 << 6,    // A touch-up event in the control where the finger is outside the bounds of the control.
    CCControlEventTouchCancel         = 1 << 7,    // A system event canceling the current touches for the control.
    CCControlEventValueChanged        = 1 << 8      // A touch dragging or otherwise manipulating a control, causing it to emit a series of different values.
};
typedef unsigned int CCControlEvent;

（2）button触摸状态

/** The possible state for a control.  */
enum 
{
    CCControlStateNormal       = 1 << 0, // The normal, or default state of a control°™that is, enabled but neither selected nor highlighted.
    CCControlStateHighlighted  = 1 << 1, // Highlighted state of a control. A control enters this state when a touch down, drag inside or drag enter is performed. You can retrieve and set this value through the highlighted property.
    CCControlStateDisabled     = 1 << 2, // Disabled state of a control. This state indicates that the control is currently disabled. You can retrieve and set this value through the enabled property.
    CCControlStateSelected     = 1 << 3  // Selected state of a control. This state indicates that the control is currently selected. You can retrieve and set this value through the selected property.
};
typedef unsigned int CCControlState;

三、创建 CCControlButton 实例：共有三种方法

1、static CCControlButton* create(CCNode* label, CCScale9Sprite* backgroundSprite);  

    //方法1
    
    //创建两个九宫格精灵，用于button显示的（正常，高亮）背景
    CCScale9Sprite *backgroundButton = CCScale9Sprite::create("button.png");
    CCScale9Sprite *backgroundHighlightedButton = CCScale9Sprite::create("buttonHighlighted.png");
    
    //创建一个button显示的label
    CCLabelTTF *titleButton = CCLabelTTF::create("CCControlButton -- 1", "Marker Felt", 30);
    titleButton->setColor(ccc3(159, 168, 176));
    
    //创建CCControlButton实例方法1：
    //static CCControlButton* create(CCNode* label, CCScale9Sprite* backgroundSprite);
    CCControlButton *button = CCControlButton::create(titleButton, backgroundButton);
    
    //Sets the background sprite to use for the specified button state.
    //设置当button在不同state（状态）的时候的背景
    button->setBackgroundSpriteForState(backgroundHighlightedButton, CCControlStateHighlighted);
    
    //Sets the color of the title to use for the specified state.
    //设置当button在不同state（状态）的时候button的标题颜色
    button->setTitleColorForState(ccWHITE, CCControlStateHighlighted);
    
    //设置button的背景图片根据label自动调整，默认已经是true了
    button->setAdjustBackgroundImage(true);
    
    //也可以设置为不是自动调整，而是固定为某个值，这个时候可以自定义button的size
//    button->setAdjustBackgroundImage(false);
//    button->setPreferredSize(CCSizeMake(200, 50));
    
    //affect a background sprite  设置背景精灵的透明度和颜色
//    button->setOpacity(50);
//    button->setColor(ccc3(0, 255, 0));
    
    button->setPosition(500, 300);
    
    //button的Selected和Enabled设置
//    button->setSelected(true);
//    button->setEnabled(true);
    
    //添加button的点击事件处理
    button->addTargetWithActionForControlEvents(this, cccontrol_selector(HelloWorld::touchUpInsideAction), CCControlEventTouchUpInside);
    
    this->addChild(button);

button点击之后的回调方法：

void HelloWorld::touchUpInsideAction(cocos2d::CCObject *sender, CCControlEvent controlEvent)
{
    CCControlButton *button = (CCControlButton*)sender;
    CCLabelTTF* label = (CCLabelTTF*)button->getTitleLabel();
    const char* lSting = label->getString();
    CCLog("button title = %s",lSting);
    
}

注意：其中参数 CCControlEvent controlEvent 并不是指针。

这种创建button实例的方法是最常见的。

2、static CCControlButton* create(std::string title, const char * fontName, float fontSize);

CCControlButton *button = CCControlButton::create("CCControlButton -- 2", "Marker Felt", 30);
    button->setTitleColorForState(ccBLACK, CCControlStateNormal);
    button->setTitleColorForState(ccRED, CCControlStateHighlighted);
    
    //设置背景,如果不设置背景，button就仅是一个label
    CCScale9Sprite *backgroundButton = CCScale9Sprite::create("button.png");
    CCScale9Sprite *backgroundHighlightedButton = CCScale9Sprite::create("buttonHighlighted.png");
    
    button->setBackgroundSpriteForState(backgroundButton, CCControlStateNormal);
    button->setBackgroundSpriteForState(backgroundHighlightedButton, CCControlStateHighlighted);
    
    button->addTargetWithActionForControlEvents(this, cccontrol_selector(HelloWorld::touchUpInsideAction), CCControlEventTouchUpInside);
    
    button->setPosition(500, 300);
    this->addChild(button);

buton的回调方法，同上。

注意：使用这种方式创建button的实例，可以创建一个只有label的button(没有背景），当然也可以添加背景图片。

添加了背景的

3、static CCControlButton* create(CCScale9Sprite* sprite);

CCScale9Sprite *backgroundButton = CCScale9Sprite::create("button.png");
    backgroundButton->setPreferredSize(CCSizeMake(100,50));
    CCScale9Sprite *backgroundHighlightedButton = CCScale9Sprite::create("buttonHighlighted.png");
    backgroundHighlightedButton->setPreferredSize(CCSizeMake(100,50));

    CCControlButton* button = CCControlButton::create(backgroundButton);
    button->setBackgroundSpriteForState(backgroundHighlightedButton, CCControlStateHighlighted);
    
    button->setAdjustBackgroundImage(false);

    button->addTargetWithActionForControlEvents(this, cccontrol_selector(HelloWorld::touchUpInsideAction),CCControlEventTouchUpInside );
    
    button->setPosition(500, 300);
    this->addChild(button);

void HelloWorld::touchUpInsideAction(cocos2d::CCObject *sender, CCControlEvent controlEvent)
{
    CCLog("touch button");
}

我在使用这种创建方式创建button实例的时候，始终无法为其添加title label。那么我们可以猜测到，这种创建方式，只是为了创建一个单纯的button,不显示button的label。

四、总结

大致CCControlButton的用法介绍就是这么多了，也可以参考引擎中给出的示例。个人感觉使用起来比CCMenu好多了。