cocos2d-x 关卡选择界面(CCScrollView的使用)

原创 2014年04月13日 17:30:08

今天要写一个关卡选择界面。

百度了下,采用了CCScrollView来实现。

具体CCScrollView的使用就不介绍了。 百度大把。(关键字: CCScrollView详解)

这里,主要通过一个实例介绍菜单界面的实现。

先看效果图。如下:


1.先从 http://pan.baidu.com/share/link?shareid=2511857370&uk=2685725110 中下载需要的资源

2.把Resources文件夹下的图片资源和  CCGameScrollView.h 以及 CCGameScrollView.cpp文件导入自己的工程中

3.让你的类继承CCGameScrollView并实现5个纯虚接口。

    //以下五个方法必须继承
    //滚动触发
    virtual void scrollViewDidScroll( cocos2d::extension::CCScrollView *view );
    //缩放触发
	virtual void scrollViewDidZoom( cocos2d::extension::CCScrollView *view );
    //初始化每个单独页面,pPage为这个页面的容器,nPage是这个页面的ID
	virtual bool scrollViewInitPage( cocos2d::CCNode *pScroll, cocos2d::CCNode *pPage, int nPage );
    //点击某个页面处理
	virtual void scrollViewClick( const cocos2d::CCPoint &oOffset, const cocos2d::CCPoint &oPoint , cocos2d::CCNode *pPage, int nPage );
    //每一次滑动后结束的回调,可以在这里处理一些事情
	virtual void scrollViewScrollEnd( cocos2d::CCNode *pPage, int nPage );

4.实现相关的方法即可。


下面具体给出我自己的测试类。


LevelSelect.h

//
//  LevelSelect.h
//  RunGame
//
//  Created by Colin on 14-4-13.
//
//

#ifndef __RunGame__LevelSelect__
#define __RunGame__LevelSelect__

#include <iostream>
#include "cocos2d.h"
#include "CCGameScrollView.h"    //导入头文件

using namespace cocos2d;

class LevelSelectScene
    : public cocos2d::CCLayer
    , public CCCGameScrollViewDelegate
{
public:
    
    LevelSelectScene();
	~LevelSelectScene();
    
    bool init();
    
    static cocos2d::CCScene* scene();
    
    //以下五个方法必须继承
    //滚动触发
    virtual void scrollViewDidScroll( cocos2d::extension::CCScrollView *view );
    //缩放触发
	virtual void scrollViewDidZoom( cocos2d::extension::CCScrollView *view );
    //初始化每个单独页面,pPage为这个页面的容器,nPage是这个页面的ID
	virtual bool scrollViewInitPage( cocos2d::CCNode *pScroll, cocos2d::CCNode *pPage, int nPage );
    //点击某个页面处理
	virtual void scrollViewClick( const cocos2d::CCPoint &oOffset, const cocos2d::CCPoint &oPoint , cocos2d::CCNode *pPage, int nPage );
    //每一次滑动后结束的回调,可以在这里处理一些事情
	virtual void scrollViewScrollEnd( cocos2d::CCNode *pPage, int nPage );
    
    CREATE_FUNC(LevelSelectScene);

    
private:
	CCCGameScrollView *m_ScrollView;

};
#endif /* defined(__RunGame__LevelSelect__) */



LevelSelect.cpp

//
//  LevelSelect.cpp
//  RunGame
//
//  Created by Colin on 14-4-13.
//
//

#include "LevelSelect.h"
#include "SimpleAudioEngine.h"

#include "GameMain.h"   //主游戏界面

using namespace cocos2d;
using namespace CocosDenshion;

USING_NS_CC_EXT;

LevelSelectScene::LevelSelectScene()
{
    
}

LevelSelectScene::~LevelSelectScene()
{
    
}

CCScene* LevelSelectScene::scene()
{
    CCScene *scene = CCScene::create();
    
    LevelSelectScene *layer = LevelSelectScene::create();
    
    scene->addChild(layer);
    
    return scene;
}

//滚动触发
void LevelSelectScene::scrollViewDidScroll( CCScrollView *view )
{
    
}
//缩放触发
void LevelSelectScene::scrollViewDidZoom( CCScrollView *view )
{
    
}

//初始化每个单独页面,pPage为这个页面的容器,nPage是这个页面的ID
bool LevelSelectScene::scrollViewInitPage( cocos2d::CCNode *pScroll, cocos2d::CCNode *pPage, int nPage )
{
	CCString str;
	str.initWithFormat("%03d.png", nPage + 1);
	CCSprite *sprite = CCSprite::create(str.getCString());
	pPage->addChild(sprite);
    
	return true;
}

//点击某个页面的处理
void LevelSelectScene::scrollViewClick( const cocos2d::CCPoint &oOffset, const cocos2d::CCPoint &oPoint , cocos2d::CCNode *pPage, int nPage )
{
	switch(nPage)
	{
        case 0:
		{
            //进入游戏主界面
            CCDirector::sharedDirector()->replaceScene(CCTransitionFadeBL::create(0.5,GameMain::scene()));

		}
            break;
        case 1:
		{
			//滚动到某个页面
			m_ScrollView->scrollToPage(2);
		}
            break;
        case 2:
		{
			//设置当前页面
			m_ScrollView->setCurPage(3);
		}
            break;
	}
    
}

//每一次滑动后结束的回调,可以在这里处理一些事情
void LevelSelectScene::scrollViewScrollEnd( cocos2d::CCNode *pPage, int nPage )
{
	CCLog("Current Page=%d", nPage);
}


bool LevelSelectScene::init()
{
	if(!CCLayer::init())
	{
		return false;
	}
    
    
	// CCScrollView
	m_ScrollView = CCCGameScrollView::create();	//创建一个scrollview
	m_ScrollView->setDirection(kCCScrollViewDirectionHorizontal);  //设置滚动的方向,目前来说只能横方向和纵方向
    
	//this,页面的数量,每个页面的尺寸(影响页面间的距离)
	m_ScrollView->createContainer(this, 5, CCSizeMake(CCDirector::sharedDirector()->getVisibleSize().width * 0.8, CCDirector::sharedDirector()->getVisibleSize().height));
	//一般是原点
	m_ScrollView->setPosition(ccp(0, 0));
	//视口的尺寸(一般是屏幕的尺寸)
	m_ScrollView->setViewSize(CCDirector::sharedDirector()->getVisibleSize());
    
	this->addChild(m_ScrollView);
    
    
	return true;
}



学习的路上,与君共勉。

cocos2d-x scrollView 滚动窗口

void ImportJson::importJsonFile() { CCNode * node = CCNode::create(); for (int i = 0; i < 8; i++) ...
  • SharlNagu
  • SharlNagu
  • 2015年01月03日 19:41
  • 734

Cocos2d-x使用Cocos Studio制作界面并应用---之游戏开发《赵云要格斗》(11)

本文主要讲了怎么用Cocos Studio制做登陆界面,并导出成Json文件,直接在coco2d-x中来调用。这样做的好处就是界面和代码是分离的,你如果想改界面的话,就可以直接在外面用Cocos St...
  • Evankaka
  • Evankaka
  • 2015年01月22日 20:14
  • 10859

cocos2d-x3.0 关于ScrollView的使用

本文主要介绍下ScrollView在cocos2dx中的使用,其主要用来实现关卡的选择,以及人物拖拽选择等方面。比如: 人物选择: 关卡选择: 其他不多说直接进入...
  • u014096244
  • u014096244
  • 2014年03月19日 13:50
  • 7049

cocos2d-x ui::ScrollView和ScrollView的使用

最近做项目发现个有趣的东西:scrollView
  • wtaotao2016
  • wtaotao2016
  • 2017年04月17日 18:54
  • 2750

跟着BOY学习开发cocos2d-x 游戏 实战篇(2)之 欢迎 界面编写

在这里我要道歉了本来我决定是每天更新一篇新的博客 可是 一放假 感觉就懒了 所以就没写了 今天 就把昨天的界面 给补上。              在这里我要说明一下 今天用到的主要知识点 按钮的使用...
  • wuyakenihao
  • wuyakenihao
  • 2013年07月13日 19:32
  • 5300

cocos2d-x 游戏关卡选择的设计

  • 2013年10月19日 11:41
  • 182KB
  • 下载

关于cocos2d::extension::ScrollView

直接贴代码:     cocos2d::extension::ScrollView* _scrollView;     _scrollView = extension::ScrollView:...
  • zhangzhenyuaf
  • zhangzhenyuaf
  • 2014年11月27日 15:16
  • 341

Cocos2d-x 3.0-ScrollView原理与使用

CScrollView的滚动是藉助于其内部容器的位置变动来达到的,再加以遮盖/剪切便实现不可见的部分进行隐藏。 藉助于CCScrollView,我们可以实现分页效果,简单的富文本,下拉式按钮等。...
  • chen983
  • chen983
  • 2015年02月26日 23:54
  • 902

quick-cocos2d-x 使用CCScrollView的问题及解决方法

由于CCScrollView是cocos2d-x的中的控件,在quick-cocos2d-x中并没有对应的UI,所以CCScrollView的触摸事件与quick-cocos2d-x的触摸机制不同会产...
  • longolder
  • longolder
  • 2014年07月05日 23:29
  • 2823

十三 手游开发神器 cocos2d-x editor 之选关滑动界面(ScrollView)

这一节主要是介绍cocos2dx editor的选关滑动界面。cocos2dx editor是开发跨平台的手机游戏工具,运行window系统上,javascript脚本语言,基于cocos2d-x跨平...
  • touchsnow
  • touchsnow
  • 2014年01月25日 17:14
  • 5299
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:cocos2d-x 关卡选择界面(CCScrollView的使用)
举报原因:
原因补充:

(最多只允许输入30个字)