在MenuScene.cpp 点击单机游戏后会调用
Director::getInstance()->pushScene(MapChooseScene::createScene());
进入到关卡选择界面,我们采用ScrollView控件制作这个界面
由于scrollview拖动后,位置比较随意,我想是拖动到第二张图片,就完整的显示第二张图片,不要产生偏离位置的现象,所以在移动之后需要进行位置的校正,写了一个adjustScrollView()方法,用来进行该调整。
具体代码如下:
MapChooseScene.h内容:
const int MAP_COUNT = 3;//定义了三张关卡图片 const int TOUCH_DISTANCE = 50; //手势滑动距离 class MapChooseScene : public Layer,public ScrollViewDelegate //使用scrollview需要继承此类 { ……………. private: Size visibleSize; Layer* _spritesContainer; //用于存放3张关卡图片的sprite 容器 int currentPage; //当前所在的是第几张关卡地图 Point beginTouchPoint; //触摸按下时的位置 ScrollView *scrollView; //scrollview对象 void singleTouchDown(Object* pSender,Control::EventType event); void addBackgroundSprite(); //添加背景方法 void addScrollView(); //添加scrollview对象及其包含的sprite //继承 ScrollViewDelegate 类需要实现的3个方法 void scrollViewDidScroll(ScrollView* view); void scrollViewDidZoom(ScrollView* view); void scrollViewMoveOver(ScrollView* view); void adjustScrollView(float distance);//自定义方法,用来进行拖动后位置调整 void onTouchEnded(Touch*touch,Event *unused_event); bool onTouchBegan(Touch * touch,Event *unused_event); void onTouchMoved(Touch *touch,Event *unused_event); };
MapChooseScene.cpp文件内容:
bool MapChooseScene::init() { if ( !Layer::init() ) { return false; } visibleSize = Director::getInstance()->getVisibleSize(); currentPage = 1;//默认当前是第一张关卡图片 addBackgroundSprite(); //添加背景 addScrollView();//添加scrollview //添加触摸监听 setTouchMode(Touch::DispatchMode::ONE_BY_ONE); auto listener = EventListenerTouchOneByOne::create(); listener->setSwallowTouches(true); listener->onTouchBegan=CC_CALLBACK_2(MapChooseScene::onTouchBegan,this); listener->onTouchMoved=CC_CALLBACK_2(MapChooseScene::onTouchMoved,this); listener->onTouchEnded=CC_CALLBACK_2(MapChooseScene::onTouchEnded,this); Director::getInstance()->getEventDispatcher()->addEventListenerWithSceneGraphPriority(listener,this); return true; }
主要来看addScrollView()方法,他的主要功能就是创建3个关卡图片sprite,并添加到Layer类容器spritesContainer对象中,水平排列显示
void MapChooseScene::addScrollView() { _spritesContainer = Layer::create(); //创建地图sprite,添加到spritesContainer中 Sprite* beachSprite = Sprite::create(BEACH_ITEM); Sprite* seaSprite = Sprite::create(SEA_ITEM); Sprite* moonSprite = Sprite::create(MOON_ITEM); _spritesContainer->addChild(beachSprite); beachSprite->setPosition(ccpAdd(center, ccp(0, 0))); _spritesContainer->addChild(seaSprite); seaSprite->setPosition(ccpAdd(center, ccp(visibleSize.width, 0))); _spritesContainer->addChild(moonSprite); moonSprite->setPosition(ccpAdd(center, ccp(2*visibleSize.width, 0))); _spritesContainer->setPosition(CCPointZero); _spritesContainer->setContentSize(CCSize(visibleSize.width * MAP_COUNT, visibleSize.height));//容器大小 //进行scrollView对象的创建 并进行相关设置 scrollView = ScrollView::create(); scrollView->setContainer(_spritesContainer); scrollView->setDirection(ScrollView::Direction::HORIZONTAL);//水平显示 scrollView->setTouchEnabled(true); scrollView->setPosition(CCPointZero); scrollView->setViewSize(CCSizeMake(visibleSize);//每个关卡图片显示的大小 scrollView->setContentOffset(CCPointZero,true); scrollView->setContentSize(CCSize(visibleSize.width * MAP_COUNT, visibleSize.height));//scrollview 大小同spritesContainer相同 scrollView->setDelegate(this); scrollView->setBounceable(false); addChild(scrollView); }
按下后给beginTouchPoint赋值 bool MapChooseScene::onTouchBegan(Touch * touch,Event *unused_event) { beginTouchPoint = Director::getInstance()->convertToGL(touch->getLocationInView()); log("touch begain"); return true; } //触摸结束后,获取触摸距离,并调用图片位置校正方法adjustScrollView void MapChooseScene::onTouchEnded(Touch*touch,Event *unused_event) { Point endPoint = Director::getInstance()->convertToGL(touch->getLocationInView()); float distance = endPoint.x - beginTouchPoint.x; if(fabs(distance) > TOUCH_DISTANCE) { adjustScrollView(distance); } }
校正方法,根据触摸滑动的位置距离差值,确认是向左或向右滑动,如果是向左滑动当前页递增,否则递减 ,最小值为1 最大值为3
然后根据图片是第几页设置scrollview的Offset ,从而实现位置校正
void MapChooseScene::adjustScrollView(float offset) { if (offset<0) { currentPage ++; }else { currentPage --; } if (currentPage <1) { currentPage = 1; } if(currentPage > MAP_COUNT) { currentPage = MAP_COUNT; } CCPoint adjustPos = ccp(- visibleSize.width * (currentPage-1), 0); scrollView->setContentOffset(adjustPos, true); }
点击下载代码 地址 http://download.csdn.net/detail/lideguo1979/8268033
未完待续..............................