cocos2dx TabelView 表格视图

创建tabelView：

1，添加头文件和命名空间

#include "cocos-ext.h"

USING_NS_CC;
USING_NS_CC_EXT;

2，继承 TableViewDataSource,TableViewDelegate两个类并重写某些方法

class HelloWorld : public cocos2d::Layer,TableViewDataSource,TableViewDelegate
{

public:
    static cocos2d::Scene* createScene(); // 创建图层

    virtual bool init(); // 初始化

    void menuCloseCallback(cocos2d::Ref* pSender); // a selector callback

    CREATE_FUNC(HelloWorld); // create宏

public:

    virtual Size tableCellSizeForIndex(TableView *table,ssize_t idx); 
    virtual Size cellSizeForTable(TableView *table); // 设置tableview的Cell大小


    virtual TableViewCell* tableCellAtIndex(TableView *table,ssize_t idx);// 获取编号为idx的cell

    virtual ssize_t numberOfCellsInTableView(TableView *table); // 设置tableview中cell的个数

public:

    // 当滑动tableview时触发该方法 参数为当前的tableview对象
    virtual void scrollViewDidScroll(ScrollView* view) {}

    // 当tableview被放大或缩小时触发该方法 参数为当前tableview对象
    virtual void scrollViewDidZoom(ScrollView* view) {}

    // 当cell被点击时调用该方法 参数为当前的tableview对象与被点击的cell对象
    virtual void tableCellTouched(TableView* table,TableViewCell* cell); // 必须实现的函数 

};

3，实现需要重写的方法

//设置编号为 idx 的cell的大小 此处都为100*100
Size HelloWorld::tableCellSizeForIndex(TableView *table,ssize_t idx)
{
    return cellSizeForTable(table);
}

Size HelloWorld::cellSizeForTable(TableView *table) {
    return Size(100,50);
};

//由于tableview是动态获取数据的，该方法在初始化时会被调用一次，之后在每个隐藏的cell显示出来的时候都会调用
TableViewCell* HelloWorld::tableCellAtIndex(TableView *table,ssize_t idx)
{
    CCString *string = CCString::createWithFormat("%d",idx);

    //获得一个可用的cell，因为在我们滑动cell的时候有些cell是显示的，有些不是显示出来的，把没有渲染的cell拿过来
    //这样就不用重新new出一个cell了，这样的话可以减小内存的开销

    TableViewCell *cell = table->dequeueCell();
    LabelTTF *label = NULL;
    if (NULL == cell) {

        cell = TableViewCell::create(); //创建一个新的cell

        CCSprite *sprite = CCSprite::create("..\\Resources\\tabel.png");//创建一个图片精灵

        sprite->setAnchorPoint(Vec2::ZERO); //设置精灵锚点为左下角

        sprite->setPosition(Vec2(0,0)); //设置精灵位置 相当于在cell中的相对位置

        cell->addChild(sprite); //将精灵加入到cell中

        label = LabelTTF::create(string->getCString(),"lidaha",20.0);//创建一个标签

        label->setPosition(Vec2::ZERO); //设置标签相对cell的位置

        label->setAnchorPoint(Vec2::ZERO); //设置标签锚点为左下角

        //为标签做一个标记,以便于在cell在重用队列中被取出来时，能够获取的该label并重置label信息
        label->setTag(123); 

        cell->addChild(label); //将标签加入到cell中
    }
    else
    {
        // 如果cell不为空,则根据tag获取到之前cell中存放的元素,并将元素信息重置
        //获取当前cell中的label
        label = (LabelTTF*)cell->getChildByTag(123);

        label->setString(string->getCString()); //重置label的相关信息
    }
    return cell;
}

//设置cell的个数 即一个tableview中包含了20个cell
ssize_t HelloWorld::numberOfCellsInTableView(TableView *table){
    return 20;
}


//当cell被点击时调用 cell->getIdx()获取当前点击cell的编号
void HelloWorld::tableCellTouched(TableView* table,TableViewCell* cell)
{
    // 在输出窗口打印出，当前cell的编号
    CCLOG("cell touched at index : %i",cell->getIdx());
}

4，在 init 方法中创建 TabelView

bool HelloWorld::init()
{
    //////////////////////////////
    // 1. super init first
    if ( !Layer::init() )
    {
        return false;
    }

    Size visibleSize = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();

    //创建一个talbleview 将datasource设置为当前的类的对象 tableview的显示区域大小为 100 * 300
    TableView* tableView = TableView::create(this,CCSizeMake(100,300));

    //设置tableview为水平方向 
    //ScrollView::Direction::VERTICAL 为垂直
    //ScrollView::Direction::HORIZONTAL 为水平
    tableView->setDirection(ScrollView::Direction::VERTICAL); 

    //设置位置
    tableView->setPosition(visibleSize / 2); 

    //设置代理对象
    tableView->setDelegate(this); 

    // 填充顺序
    tableView->setVerticalFillOrder(TableView::VerticalFillOrder::TOP_DOWN); 

    //添加tableview到当前layer
    this->addChild(tableView); 

    //这句话一定要加上啊，意思是用现有的配置去刷新所有的cell
    tableView->reloadData();

    return true;
}

cocos2dx TabelView 表格视图

相关文章