热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

【Cocos2d-xforWP8学习整理】(4)CCTableView实现《天天爱消除》中的得分榜

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

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

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

 

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


一、创建承载它的容器

我们选用一个Layer, 

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);
};

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

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

 

二、 创建并添加 CCTableView 对象

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;
}

 

三、 为CCTableView提供数据

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

代码如下:

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;  }

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

 

 

 

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

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

 

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


推荐阅读
  • 本文介绍了如何通过掌握 IScroll 技巧来实现流畅的上拉加载和下拉刷新功能。首先,需要按正确的顺序引入相关文件:1. Zepto;2. iScroll.js;3. scroll-probe.js。此外,还提供了完整的代码示例,可在 GitHub 仓库中查看。通过这些步骤,开发者可以轻松实现高效、流畅的滚动效果,提升用户体验。 ... [详细]
  • 技术分享:深入解析GestureDetector手势识别机制
    技术分享:深入解析GestureDetector手势识别机制 ... [详细]
  • 本文介绍了在 Java 编程中遇到的一个常见错误:对象无法转换为 long 类型,并提供了详细的解决方案。 ... [详细]
  • 在 `UITableViewController` 中采用简洁的平面样式布局时,可以通过优化代码实现单元格扩展至屏幕边缘的效果,同时确保节标题以分组样式呈现,从而提升用户体验和界面美观度。通过这种方式,可以更好地组织和展示列表内容,使其更加清晰和有序。 ... [详细]
  • 在Android开发中,实现多点触控功能需要使用`OnTouchListener`监听器来捕获触摸事件,并在`onTouch`方法中进行详细的事件处理。为了优化多点触控的交互体验,开发者可以通过识别不同的触摸手势(如缩放、旋转等)并进行相应的逻辑处理。此外,还可以结合`MotionEvent`类提供的方法,如`getPointerCount()`和`getPointerId()`,来精确控制每个触点的行为,从而提升用户操作的流畅性和响应性。 ... [详细]
  • 掌握Android UI设计:利用ZoomControls实现图片缩放功能
    本文介绍了如何在Android应用中通过使用ZoomControls组件来实现图片的缩放功能。ZoomControls提供了一种简单且直观的方式,让用户可以通过点击放大和缩小按钮来调整图片的显示大小。文章详细讲解了ZoomControls的基本用法、布局设置以及与ImageView的结合使用方法,适合初学者快速掌握Android UI设计中的这一重要功能。 ... [详细]
  • 开发笔记:深入解析Android自定义控件——Button的72种变形技巧
    开发笔记:深入解析Android自定义控件——Button的72种变形技巧 ... [详细]
  • 地图集成方法与应用 ... [详细]
  • 在探讨C语言编程文本编辑器的最佳选择与专业推荐时,本文将引导读者构建一个基础的文本编辑器程序。该程序不仅能够打开并显示文本文件的内容及其路径,还集成了菜单和工具栏功能,为用户提供更加便捷的操作体验。通过本案例的学习,读者可以深入了解文本编辑器的核心实现机制。 ... [详细]
  • Android 图像色彩处理技术详解
    本文详细探讨了 Android 平台上的图像色彩处理技术,重点介绍了如何通过模仿美图秀秀的交互方式,利用 SeekBar 实现对图片颜色的精细调整。文章展示了具体的布局设计和代码实现,帮助开发者更好地理解和应用图像处理技术。 ... [详细]
  • 一个建表一个执行crud操作建表代码importandroid.content.Context;importandroid.database.sqlite.SQLiteDat ... [详细]
  • 本文详细介绍了在 CentOS 7 系统中配置 fstab 文件以实现开机自动挂载 NFS 共享目录的方法,并解决了常见的配置失败问题。 ... [详细]
  • 题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4277。作者:Bob Lee,日期:2012年9月15日。题目描述:给定n个木棍,求可以组成的不同三角形的数量,最多15根木棍。 ... [详细]
  • 本文详细介绍了使用 Python 进行 MySQL 和 Redis 数据库操作的实战技巧。首先,针对 MySQL 数据库,通过 `pymysql` 模块展示了如何连接和操作数据库,包括建立连接、执行查询和更新等常见操作。接着,文章深入探讨了 Redis 的基本命令和高级功能,如键值存储、列表操作和事务处理。此外,还提供了多个实际案例,帮助读者更好地理解和应用这些技术。 ... [详细]
  • 深入解析JavaScript中的函数防抖与节流技术及其应用场景
    本文深入探讨了JavaScript中函数防抖和节流技术的原理及应用场景。通过详细的示例代码,全面解析了这两种优化方法在实际开发中的重要作用,为开发者提供了宝贵的参考和实践指导。 ... [详细]
author-avatar
手机用户2602905773
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有