首页 > 移动平台 > 详细

Android中GridView使用

时间:2014-03-01 01:43:26      阅读:534      评论:0      收藏:0      [点我收藏+]
原文:【Cocos2d-x for WP8 学习整理】(4)CCTableView 实现《天天爱消除》中的得分榜

接上回 CCScrollView 继续,在GUI 里还有个 CCScrollView 的子类---CCTableView 。 这个名字应该是从 IOS 里的 UITableView来的,其实是跟WP8的 Listbox 效果一样,实现

大数据的虚拟化展示, 不管在应用还是游戏里都是很常见的控件。 比如下面的 《天天爱消除》 的分数展示

bubuko.com,布布扣 

下面我们用 CCTableView 一步步实现上面的效果,


一、创建承载它的容器

我们选用一个Layer, 

bubuko.com,布布扣
class ListViewLayer : public cocos2d::CCLayer, public cocos2d::extension::CCTableViewDataSource, public cocos2d::extension::CCTableViewDelegate
{
public:
    virtual bool init();  
    
    virtual void scrollViewDidScroll(cocos2d::extension::CCScrollView* view);

    virtual void scrollViewDidZoom(cocos2d::extension::CCScrollView* view);

    //处理触摸事件
    virtual void tableCellTouched(cocos2d::extension::CCTableView* table, cocos2d::extension::CCTableViewCell* cell);
    //每一项的宽度和高度
    virtual cocos2d::CCSize cellSizeForTable(cocos2d::extension::CCTableView *table);
    //生成列表每一项的内容
    virtual cocos2d::extension::CCTableViewCell* tableCellAtIndex(cocos2d::extension::CCTableView *table, unsigned int idx);
    //一共多少项
    virtual unsigned int numberOfCellsInTableView(cocos2d::extension::CCTableView *table);

     CREATE_FUNC(ListViewLayer);
};
bubuko.com,布布扣

该 Layer 实现了 CCTableViewDataSource 和 CCTableViewDelegate 这两个接口,

分别为 CCTableView 提供数据源 和 响应事件,后面会作为 CCTableView 的 Delegate 存在

 

二、 创建并添加 CCTableView 对象

bubuko.com,布布扣
bool ListViewLayer::init()
{
    bool bRet = false;
    do
    {
        CC_BREAK_IF( !CCLayer::init() );

        bg = CCTextureCache::sharedTextureCache()->addImage("bg.png");
        bg2 = CCTextureCache::sharedTextureCache()->addImage("bg2.png");

        CCSize visibleSize = CCDirector::sharedDirector()->getVisibleSize();

        CCTableView* pTableView = CCTableView::create(this, CCSizeMake(visibleSize.width, visibleSize.height));
        pTableView->setDirection(kCCScrollViewDirectionVertical);
        pTableView->setPosition(CCPointZero);
        pTableView->setDelegate(this);  //将Delegate对象设置为刚才创建的容器.
        pTableView->setVerticalFillOrder(kCCTableViewFillTopDown);

        this->addChild(pTableView);
        pTableView->reloadData();

        bRet = true;
    }
    while(0);

    return bRet;
}
bubuko.com,布布扣

 

三、 为CCTableView提供数据

首先要 通过 numberOfCellsInTableView 指定 TableView 的单元个数,然后在 cellSizeForTable 里指定具体的单元格的尺寸大小,最后在 tableCellAtIndex 里控制每个单元格的具体数据。

代码如下:

bubuko.com,布布扣
unsigned int ListViewLayer::numberOfCellsInTableView(CCTableView *table)
{
    return 999;
}

CCSize ListViewLayer::cellSizeForTable(CCTableView *table)
{
    return CCSizeMake(CCDirector::sharedDirector()->getVisibleSize().width, 124);
}

CCTableViewCell* ListViewLayer::tableCellAtIndex(CCTableView *table, unsigned int idx)
{
     CCSize visibleSize = CCDirector::sharedDirector()->getVisibleSize();

     CCString *pString = CCString::createWithFormat("%d", idx + 1);

    //这里要注意,因为是单元格是会重用的,所以不一定每次都要新建。
    CCTableViewCell *pCell = table->dequeueCell();
    if (!pCell) 
     {
         pCell = new CCTableViewCell();
         pCell->autorelease();

        //Add background.
        CCSprite *pSprite;

        if(UserIndex == idx)
         {
             pSprite = CCSprite::createWithTexture(bg2);
         }
        else
         {
             pSprite = CCSprite::createWithTexture(bg);
         }

         pSprite->setAnchorPoint(CCPointZero);
         pSprite->setPosition(CCPointZero);
         pSprite->setTag(111);
         pCell->addChild(pSprite);

        //Add Icon.
        pSprite = CCSprite::create("Icon.png");
         pSprite->setPosition(ccp(18060));
         pCell->addChild(pSprite);

        //Add Rate.
        CCLabelTTF *pLabel = CCLabelTTF::create(pString->getCString(), "Arial"70.0);
         pLabel->setPosition(ccp(7060));
         pLabel->setTag(123);

         pCell->addChild(pLabel);

        //Add Name.
        pLabel = CCLabelTTF::create("Ghost Person""Arial"40.0);
         pLabel->setPosition(ccp(25060));
         pLabel->setAnchorPoint(CCPointZero);
         pLabel->setTag(123);

         pCell->addChild(pLabel);
     }
    else
     {
         CCLabelTTF *pLabel = (CCLabelTTF*)pCell->getChildByTag(123);
         pLabel->setString(pString->getCString());

        if(UserIndex == idx)//根据ID创建不同的效果.
         {
            CCSprite* bg3 = (CCSprite*)pCell->getChildByTag(111);
             bg3->setTexture(bg2);
         }
        else
         {
             CCSprite* bg3 = (CCSprite*)pCell->getChildByTag(111);
             bg3->setTexture(bg);
         }
     }

    return pCell; }
bubuko.com,布布扣

就这三步,大功告成了,附上效果图:

 

bubuko.com,布布扣 

 

丑是丑了一点啊,不过已经基本成型了。

而且发现在920上滑动的时候只有30帧左右,不知道其他手机如何,后面具体再测。

 

 欢迎有兴趣的童鞋加入Cocos2d-x 开发群  qq: 264152376

Android中GridView使用,布布扣,bubuko.com

Android中GridView使用

原文:http://www.cnblogs.com/hyzhou/p/3573412.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!