cocos2d-x 2.0 版更新了,把opengl 1.1 替换为opengl 2.0,这个版本只能在iphone 3gs,android 2.2 以上版本才能跑,并且android的模拟器也不支持!
这次更新终于更新了几个UI控件,比如Button,Slider,ListView(本来打算自己写个ListView的,这下省事了,看到注释,这里要感谢网龙公司了,当然,还要感谢cocos2d-x的整合)。
但是这个tests中没有加入对ListView的使用教程,只有在CCTextureWatcher中有简单的提到,但是CCTextureWatcher是缓存图片纹理的查看类,并不是单纯的ListView的教程介绍,考虑到以后肯定会用到,所以先记录一下简单的用法和原理。
1.CCListView的设计,主要分为3部分
(1)ListView容器
ListView容器就是盛放Cell的大容器,CCListView继承于CCLayerColor,主要是处理显示样式,监听触摸事件,更新的操作。
(2)Cell子容器
CCListViewCell也是继承于CCLayerColor,它处理的就很单纯了,就是负责ListView中每一项(Item)的显示
(3)代理方法
CCListViewDelegate定义了关于CCListView的回调接口,这个和ios app开发中TabView的原理是一样的。
(可能从android刚刚转到cocos2d-x的开发的我们不是很习惯这种设计,其实和android是非常类似的,Cell子容器和代理方法,不就是android中的ListView的各种adapter吗?只是adapter整合了它们,在初始化adapter的时候会将数据和显示规则都定义好)
2.简单用法
(1)类定义
我想一般的用法会是自定义一个层作为ListView添加到其它层上,首先继承CCLayer,还要继承CCListViewDelegate,用来处理显示和回调CCListView,当然也可以继承于CCObject,但是要注意的是一定要定义一个visit()方法,用于更新!
- #include "cocos2d.h"
- #include "CCListView.h"
- USING_NS_CC;
- using namespace cocos2d::extension;
- class ListViewDemoLayer: public CCLayer, public CCListViewDelegate
- {
- private:
- CCLabelTTF *m_InfoLabel;
- private:
- // 存放的List数据
- std::list<std::string> *m_pDataList;
- CCListView *m_pListView;
- bool m_bFresh;
- public:
- ListViewDemoLayer();
- ~ListViewDemoLayer();
- virtual bool init();
- LAYER_NODE_FUNC(ListViewDemoLayer);
- virtual void visit();
- public:
- // 继承自CCListViewDelegate所需要实现的方法
- virtual void CCListView_numberOfCells(CCListView *listView, CCListViewProtrolData *data);
- virtual void CCListView_cellForRow(CCListView *listView, CCListViewProtrolData *data);
- virtual void CCListView_didClickCellAtRow(CCListView *listView, CCListViewProtrolData *data);
- virtual void CCListView_didScrollToRow(CCListView *listView, CCListViewProtrolData *data);
- };
- #endif
(PS:注意那鬼魅的命名作用域)
(2)自定义
用一个list<string>对象作为数据模拟显示,(如果是做道具店,装备商店列表,可能就是自定义类型的list了,因为数据结构会比较复杂,这里只是一个简单的字符串的例子而已)
- // 初始化List数据
- m_pDataList = new std::list<std::string>;
- for (int i=0; i<15; i++) {
- char info[20];
- sprintf(info, "Cell %d", i);
- m_pDataList->push_back(info);
- }
定义一个CCListView对象,这里最重要的是要记得一定要设置其ContentSize(),如果不设置,则默认为0,什么都没有
- // 初始化List数据
- m_pDataList = new std::list<std::string>;
- for (int i=0; i<15; i++) {
- char info[20];
- sprintf(info, "Cell %d", i);
- m_pDataList->push_back(info);
- }
还定义了一个CCLabelTTF用于显示ListView的信息
visit()方法还是很重要的,这是在cocos2d-x引擎每帧更新的时候都会调用的(比如动画的变化。。。),我们在这里可以判断当前的ListView需要不需要更新,当ListView有增减项的时候,为了达到显示同步,是需要更新的,调用listView.reload()
- void ListViewDemoLayer::visit()
- {
- CCLayer::visit();
- if (m_bFresh) {
- m_pListView->reload();
- m_bFresh = false;
- }
- }
(3)CCListViewDelegate实现
virtual void CCListView_numberOfCells(CCListView *listView,CCListViewProtrolData *data);
返回ListView的条目数
virtual void CCListView_cellForRow(CCListView *listView,CCListViewProtrolData *data);
定义Cell的样式
在这里只简单的定义一个文本项,并且设置选中的背景色之类的
- void ListViewDemoLayer::CCListView_cellForRow(cocos2d::extension::CCListView *listView, cocos2d::extension::CCListViewProtrolData *data)
- {
- CCSize listSize = m_pListView->getContentSize();
- CCSize cellSize = CCSizeMake(listSize.width, listSize.height / 5);
- CCListViewCell *cell = CCListViewCell::node();
- cell->setOpacity(0);
- cell->setContentSize(cellSize);
- cell->setSelectionColor(ccc4(255, 0, 0, 255));
- data->cell = cell;
- std::list<std::string>::iterator it = m_pDataList->begin();
- for (int i=0; i<data->nRow; ++i) {
- ++it;
- }
- CCLabelTTF *cellLabel = CCLabelTTF::labelWithString(((std::string) *it).c_str(), "Arial", 32);
- cellLabel->setPosition(ccp(cellSize.width / 2, cellSize.height / 2));
- cell->addChild(cellLabel);
- }
(PS:这个机制是类似于android中BaseAdapter的getView()方法的)
ListView产生点击之后的回调
简单的修改一下显示文本,根据data->nRow得到当前项所在位置
- void ListViewDemoLayer::CCListView_didClickCellAtRow(cocos2d::extension::CCListView *listView, cocos2d::extension::CCListViewProtrolData *data)
- {
- char info[100];
- sprintf(info, "No. %d Row", data->nRow);
- m_InfoLabel->setString(info);
- }
(PS:这个机制类似于android中ListView.setOnItemClickListener())
virtual void CCListView_didScrollToRow(CCListView *listView,CCListViewProtrolData *data);
ListView滑动产生的回调
3.效果