cocos2d-x 如何自定义简单的scrollView/scrollLayer

时间：3-9

平台：xcode4.2 cocos2d-x ＊.11.＊

说明：简单的实现scrollView，没有加速减速功能，没有进度条。

上图：

//
//  CCUIScrollView.h
//  cocos2dUI
//
//  Created by rorger on 12-3-7. contact me:jhcyd112@163.com
//  Copyright 2012年 __MyCompanyName__. All rights reserved.
//

#ifndef cocos2dUI_CCUIScrollView_h
#define cocos2dUI_CCUIScrollView_h
#include "cocos2d.h"
USING_NS_CC;

class CCUIScrollView:public CCLayer{
public:
    ~CCUIScrollView();
    CCUIScrollView(const CCRect& mRect);
    static CCUIScrollView* scrollViewWithCCRect(const CCRect& mRect);
    static CCUIScrollView* scrollViewWithColorAndCCRect(const ccColor4B& color,const CCRect& mRect);
    virtual bool init();
    
    //addTargetedDelegate
    virtual void registerWithTouchDispatcher(void);
    virtual bool ccTouchBegan(CCTouch *pTouch, CCEvent *pEvent);
    virtual void ccTouchMoved(CCTouch *pTouch, CCEvent *pEvent);
    virtual void ccTouchEnded(CCTouch *pTouch, CCEvent *pEvent);
    virtual void ccTouchCancelled(CCTouch *pTouch, CCEvent *pEvent);
    
    //clip contentLayer
    virtual void visit();
    
    //add child to contentLayer
    virtual void addChildInContentLayer(CCNode * child){contentLayer->addChild(child); }
    virtual void addChildInContentLayer(CCNode * child, int zOrder){contentLayer->addChild(child, zOrder); }
    virtual void addChildInContentLayer(CCNode * child, int zOrder, int tag){contentLayer->addChild(child, zOrder, tag);}
    
    //set method
    void setContentLayerColor(const ccColor4B& mColor);
    void setContentLayerSize(const CCSize& mSize){contentLayer->setContentSize(mSize);}

    //get method
    virtual bool getIsTouchInContentLayer(CCTouch *pTouch);
    const ccColor3B& getContentLayerColor(){return contentLayer->getColor();}
    const CCSize& getContentLayerSize(){return contentLayer->getContentSize();}
#warning this method is for test.
    CCLayerColor*  getScrollLayerCellAtIndex(int i);
protected:
    CC_SYNTHESIZE(CCLayerColor*, contentLayer, ContentLayer)
    CC_SYNTHESIZE(bool, isLockHorizontal, IsLockHorizontal)
    CC_SYNTHESIZE(bool, isLockVertical, IsLockVertical)
    CC_SYNTHESIZE(bool, isScrolling, IsScrolling)
private:
    //CCPoint based on world coordinates
    CCPoint preTouchPoint;
    CCPoint currentTouchPoint;
};


#endif//cocos2dUI_CCUIScrollView_h

//
//  CCUIScrollView.cpp
//  cocos2dUI
//
//  Created by rorger on 12-3-7.contact me:jhcyd112@163.com
//  Copyright 2012年 __MyCompanyName__. All rights reserved.
//

#include "CCUIScrollView.h"
USING_NS_CC;
#define contentViewFontColorRed  (GLubyte)(255 * 0.8) 
#define contentViewFontColorGreen  (GLubyte)(255 * 0.9) 
#define contentViewFontColorBlue  (GLubyte)(255 * 0.2) 
#define contentViewFontColorAlpha 1.0
#define kScrollLayerCellPositionY 25
#define myFontColor ccc3(contentViewFontColorRed, contentViewFontColorGreen, contentViewFontColorBlue)

CCLayerColor*  CCUIScrollView::getScrollLayerCellAtIndex(int i){
    //scrollLayer一行:scrollLayerCell
    CCLayerColor *scrollLayerCell = CCLayerColor::layerWithColorWidthHeight(ccc4((i%2==0)?0:100,(i%2==0)?100:0,0,i*30+50), 444, 50);
    scrollLayerCell->setIsTouchEnabled(false);
    scrollLayerCell->setPosition(ccp(0,i*50+50));
    CCLabelTTF *pLabelInfoName  = CCLabelTTF::labelWithString("item1:", "Arial", 20);
    pLabelInfoName->setScaleX(0.65);
    pLabelInfoName->setScaleY(0.65); 
    pLabelInfoName->setColor(myFontColor);
    pLabelInfoName->setAnchorPoint(ccp(0.0,0.5));
    pLabelInfoName->setPosition(ccp(150, kScrollLayerCellPositionY));
    scrollLayerCell->addChild(pLabelInfoName);
    CCLabelTTF *pLabelInfoValue = CCLabelTTF::labelWithString("item2", "Arial", 20);
    pLabelInfoValue->setScaleX(0.65);
    pLabelInfoValue->setScaleY(0.65); 
    pLabelInfoValue->setColor(myFontColor);
    pLabelInfoValue->setPosition(ccp(300, kScrollLayerCellPositionY));
    scrollLayerCell->addChild(pLabelInfoValue);
    return scrollLayerCell;
}

 
CCUIScrollView::CCUIScrollView(const CCRect& mRect){
    this->setPosition(mRect.origin);
    this->setContentSize(mRect.size);
    this->setIsTouchEnabled(true);
    this->setIsLockHorizontal(true);
    this->setIsScrolling(false);
    contentLayer = CCLayerColor::layerWithColorWidthHeight(
                                                           ccc4( 120,120, 120,80), mRect.size.width, mRect.size.height);
    contentLayer->setIsRelativeAnchorPoint(true);
    contentLayer->setAnchorPoint(ccp(0.5,1.0));
#warning this is for test
    for (int i = 0; i < 5; i++) {
        contentLayer->addChild(getScrollLayerCellAtIndex(i));
    }
    CCPoint contentLayerPosition = CCPointMake(mRect.origin.x + mRect.size.width/2.0, mRect.origin.y+mRect.size.height);
    contentLayer->setPosition(contentLayerPosition);
    this->addChild(contentLayer);
}

CCUIScrollView* CCUIScrollView::scrollViewWithCCRect(const CCRect& mRect){
    CCUIScrollView *pScrollView = new CCUIScrollView(mRect);
    if(pScrollView && pScrollView->init()){
        pScrollView->autorelease();
        return pScrollView;
    }
    CC_SAFE_DELETE(pScrollView)
    return NULL;
}

CCUIScrollView* CCUIScrollView::scrollViewWithColorAndCCRect(const ccColor4B& color,const CCRect& mRect){
    CCUIScrollView *pScrollView = new CCUIScrollView(mRect);
    if(pScrollView && pScrollView->init()){
        pScrollView->setContentLayerColor(color);
        pScrollView->autorelease();
        return pScrollView;
    }
    CC_SAFE_DELETE(pScrollView)
    return NULL;
}

CCUIScrollView::~CCUIScrollView(){
    
}

bool CCUIScrollView::init(){
    //TODO
    return true;
}

void CCUIScrollView::registerWithTouchDispatcher(){
    //change 0 if you need priority higher or lower.
    //swallows the touch message
    CCTouchDispatcher::sharedDispatcher()->addTargetedDelegate(this, 0, true);
}

bool CCUIScrollView::ccTouchBegan(CCTouch *pTouch, CCEvent *pEvent){
    
    CCPoint locationInView = pTouch->locationInView(pTouch->view());
    preTouchPoint = CCDirector::sharedDirector()->convertToGL(locationInView);
    if (this->getIsTouchInContentLayer(pTouch)) {
        isScrolling = true;
        printf("Began Scrolling\n");
    }
    else 
        isScrolling = false;
    return isScrolling;
}

void CCUIScrollView::ccTouchMoved(CCTouch *pTouch, CCEvent *pEvent){
 
    CCPoint locationInView = pTouch->locationInView(pTouch->view());
    currentTouchPoint = CCDirector::sharedDirector()->convertToGL(locationInView);
    CCPoint deltaPoint = ccpSub(currentTouchPoint, preTouchPoint);
    if(this->getIsLockHorizontal())
        deltaPoint.x=0;
    else if(this->getIsLockVertical())
        deltaPoint.y=0; 
    contentLayer->setPosition(ccpAdd(contentLayer->getPosition(), deltaPoint));
    preTouchPoint = currentTouchPoint;
#warning this is for test
    printf("Moving\n");
}

void CCUIScrollView::ccTouchEnded(CCTouch *pTouch, CCEvent *pEvent){
#warning this is for test
    printf("Moving End\n");
}

void CCUIScrollView::ccTouchCancelled(CCTouch *pTouch, CCEvent *pEvent){
    
}

void CCUIScrollView::setContentLayerColor(const ccColor4B &mColor){
    contentLayer->setColor(ccc3(mColor.r, mColor.g, mColor.b));
    contentLayer->setOpacity(mColor.a);
}

bool CCUIScrollView::getIsTouchInContentLayer( CCTouch *pTouch){
    CCPoint nodeSpaceLocation = this->convertTouchToNodeSpace(pTouch);
#warning this is for test
    printf("nodeSpaceLocation: %f,%f     ",nodeSpaceLocation.x,nodeSpaceLocation.y);
    CCRect contentLayerRect = CCRectZero;
    contentLayerRect.origin = CCPointZero;
    contentLayerRect.size = contentLayer->getContentSize();
#warning this is for test
    printf("RectOrigin:%f,%f  RectSize:%f,%f\n",contentLayerRect.origin.x,contentLayerRect.origin.y,contentLayerRect.size.width,contentLayerRect.size.height);
    return CCRect::CCRectContainsPoint(contentLayerRect, nodeSpaceLocation);
}

void CCUIScrollView::visit(){
    CCPoint convertedLocationLowerLeft = this->getParent()->convertToWorldSpace(this->getPosition());
    glEnable(GL_SCISSOR_TEST);
    glScissor(convertedLocationLowerLeft.x, convertedLocationLowerLeft.y,
              this->getContentSize().width, this->getContentSize().height);
    CCLayer::visit();
    glDisable(GL_SCISSOR_TEST);
}

增加上述两个文件，然后在HelloWorldScene.cpp的init方法增加：

CCUIScrollView *scrollView = CCUIScrollView::scrollViewWithCCRect(CCRectMake(20, 20, 444, 200));

    this->addChild(scrollView);

运行即可。