CCScrollView可以使游戏有滚动视图的效果，并且可以通过滚动视图切换游戏场景，滚动视图常用于游戏中选择关卡
实例1：使用CCScrollView创建一个简单的滚动视图
首先创建一个ScrollView类
然后在ScrollView.h中添加下面的代码
#ifndef __ScrollView_H__
#define __ScrollView_H__#include "cocos2d.h"
#include "cocos-ext.h"
USING_NS_CC;
USING_NS_CC_EXT;class ScrollView : public CCLayer
{
public:virtual bool init(); static CCScene* scene();CREATE_FUNC(ScrollView);//响应触摸事件bool ccTouchBegan(CCTouch* touch, CCEvent*);void ccTouchEnded(CCTouch* touch, CCEvent*);CCNode* _contaner;
};#endif // __ScrollView_H__
在ScrollView.cpp中添加下面的代码
#include "ScrollView.h"CCScene* ScrollView::scene()
{CCScene *scene = CCScene::create();ScrollView *layer = ScrollView::create();scene->addChild(layer);return scene;
}bool ScrollView::init()
{CCLayer::init();CCSize winSize = CCDirector::sharedDirector()->getWinSize();CCPoint center = ccp(winSize.width / 2, winSize.height / 2);//创建一个结点CCNode* c = CCNode::create();//创建5个紧挨着的精灵for(int i = 0; i < 5; i++){CCSprite* sprite = CCSprite::create("HelloWorld.png");c->addChild(sprite);//设置图片的位置，每两张图片相差一张图片的宽度sprite->setPosition(ccpAdd(center, ccp(i*winSize.width, 0)));}//滚动视图//第一个参数：显示的视图大小//第二个参数：视图的实际大小CCScrollView* view = CCScrollView::create(winSize, c);addChild(view);//设置视图运动的方向为水平运动view->setDirection( kCCScrollViewDirectionHorizontal);//设置视图的宽度和高度view->setContentSize(CCSize(winSize.width * 5, winSize.height * 5));return true;
}
执行结果
实例2：CCScrollView的高级应用
不会出现两张图片的相交位置在窗口中(当切换完成图片后总会在窗口上显示一张完整的图片)
在ScrollView.cpp中添加下面的代码
#include "ScrollView.h"CCScene* ScrollView::scene()
{CCScene *scene = CCScene::create();ScrollView *layer = ScrollView::create();scene->addChild(layer);return scene;
}bool ScrollView::init()
{CCLayer::init();CCSize winSize = CCDirector::sharedDirector()->getWinSize();CCPoint center = ccp(winSize.width / 2, winSize.height / 2);//创建一个结点CCNode* c = CCNode::create();_contaner = c;//创建5个紧挨着的精灵for(int i = 0; i < 5; i++){CCSprite* sprite = CCSprite::create("HelloWorld.png");c->addChild(sprite);//设置图片的位置，每两张图片相差一个屏幕的宽度sprite->setPosition(ccpAdd(center, ccp(i*winSize.width, 0)));//给视图编号char buf[10];sprintf(buf, "%d", i);CCLabelTTF* label = CCLabelTTF::create(buf, "Arial", 36); sprite->addChild(label);label->setPosition(center);}//滚动视图//第一个参数：在窗口显示的视图大小//第二个参数：结点CCNodeCCScrollView* view = CCScrollView::create(winSize, c);addChild(view);//设置视图运动的方向为水平运动view->setDirection( kCCScrollViewDirectionHorizontal);//设置视图的宽度和高度view->setContentSize(CCSize(winSize.width * 5, winSize.height * 5));//取消ScrollView的弹性 view->setBounceable(false); //注册触摸事件setTouchEnabled(true);setTouchMode(kCCTouchesOneByOne);return true;
}//鼠标点下的时候
bool ScrollView::ccTouchBegan(CCTouch* touch, CCEvent* ev)
{return true;
}//鼠标起来的时候
void ScrollView::ccTouchEnded(CCTouch* touch, CCEvent*)
{//得到鼠标点下去的时候的位置CCPoint ptDown = touch->getStartLocation();//得到鼠标松开时的位置CCPoint ptUp = touch->getLocation();//当两个位置的距离的平方小于25时(认为是点击，否则是滑动)if(ptUp.getDistanceSq(ptDown) <= 25){//检查点击的是哪一个图片//将世界坐标转换成结点坐标CCPoint ptInContainer = _contaner->convertToNodeSpace(ptUp);//定义一个数组保存5个精灵CCArray* arr = _contaner->getChildren();for(int i = 0; i < 5; ++i){//获取精灵的索引(获取点击的是哪个精灵)CCSprite* sprite = (CCSprite*)arr->objectAtIndex(i);//boundingBox()获取精灵的边框(判断触摸点是否在边框内，当在的时候，打印精灵的编号)if(sprite->boundingBox().containsPoint(ptInContainer)){CCLog("click i is %d", i);break;}}}else{//滑动 int x = _contaner->getPositionX(); if (x >= -1920 && x <= 0) { // adjust // 0, -480, -960, -1440, -1920 int idx = (-x +240)/ 480; x = -idx * 480; CCMoveTo* moveTo = CCMoveTo::create(0.5f, ccp(x, this->_contaner->getPositionY())); this->_contaner->runAction(moveTo); } }
}
执行结果：
当在图片中点击后会打印点击的图片的编号
改进后不会出现的情形
