关于cocos2dx之lua使用TableView

在手机游戏的开发中,滚动是一项非常重要的操作,而cocos2dx中使用的最广泛的就属于TableView了,不过由于cocos2dx的接口比较晦涩,所以需要一个熟悉的过程。本文主要讲解如何使用TableView。

首先当然是创建一个TableView,这比较简单,和其他控件差不多。看看示例代码:

    self._skillView = cc.TableView:create(cc.size(winSize.width / 3 - 50, winSize.height - 140))
    self._skillView:setDirection(cc.SCROLLVIEW_DIRECTION_VERTICAL)    
    self._skillView:setVerticalFillOrder(cc.TABLEVIEW_FILL_TOPDOWN)
    self._skillView:setPosition(cc.p(50, 10))
    self._skillView:setDelegate()
    skill_bg:addChild(self._skillView)

需要注意的是setDirection的参数,cc.SCROLLVIEW_DIRECTION_VERTICAL表示在垂直方向滚动,cc.SCROLLVIEW_DIRECTION_HORIZONTAL则表示在水平方向滚动。

其次为TableView设置一些回调函数。主要有4个回调函数。先看看示例代码:

    self._skillView:registerScriptHandler(SkillBoard.tableCellTouched, cc.TABLECELL_TOUCHED)
    self._skillView:registerScriptHandler(SkillBoard.cellSizeForTable, cc.TABLECELL_SIZE_FOR_INDEX)
    self._skillView:registerScriptHandler(SkillBoard.tableCellAtIndex, cc.TABLECELL_SIZE_AT_INDEX)
    self._skillView:registerScriptHandler(SkillBoard.numberOfCellsInTableView, cc.NUMBER_OF_CELLS_IN_TABLEVIEW)

TABLECELL_TOUCHED:TableView被触摸的时候的回调,主要用于选择TableView中的Cell。

TABLECELL_SIZE_FOR_INDEX:此回调需要返回TableView中Cell的尺寸大小。

TABLECELL_SIZE_AT_INDEX:此回调需要为TableView创建在某个位置的Cell。

NUMBER_OF_CELLS_IN_TABLEVIEW:此回调需要返回TableView中Cell的数量。 然后,我们先看最简单的两个回调函数的示例:

function SkillBoard.cellSizeForTable(view, idx)
	return 200, 200
end

function SkillBoard.numberOfCellsInTableView(view)
	return table.size(local_skills)
end

参数中的view表示TableView对象,idx表示Cell的索引。

再次,我们看看触摸函数,参数cell表示哪一个cell被触摸到了。

function SkillBoard.tableCellTouched(view, cell)
    local self = GUI.GetGUI("SkillBoard")    
    if self:isOpened() then
        for cl, sitem in pairs(self._skillItems) do
            local issel = (cl == cell)
            sitem:select(issel)
            if issel then
                self:onClickSkill(sitem:getSkill())
            end
        end
    end
end

最后,看看最重要的函数,就是映射cell的接口,idx表示cell的索引。

function SkillBoard.tableCellAtIndex(view, idx)    
    local self = GUI.GetGUI("SkillBoard")
    local cell = view:dequeueCell()
    if not cell then
        cell = cc.TableViewCell:new()
    end
    return cell
end

是不是特别简单呢?如果需要多样化的cell,比如物品栏,技能栏这些功能,只需要在cell上扩展,创建一些精灵或者按钮,作为cell的子节点加到cell上即可。例如:

        cell = cc.TableViewCell:new()
        local image1 = CHOOSE_SERVER_AREA_NORMAL
        local sprite1 = cc.Sprite:createWithSpriteFrameName(image1)
        sprite1:setAnchorPoint(cc.p(0, 0))
        sprite1:setPosition(cc.p(0, 0))
        sprite1:setTag(1)
        cell:addChild(sprite1)
        
        local image2 = CHOOSE_SERVER_AREA_SELECTED
        local sprite2 = cc.Sprite:createWithSpriteFrameName(image2)
        sprite2:setAnchorPoint(cc.p(0, 0))
        sprite2:setPosition(cc.p(0, 0))
        sprite2:setTag(2)
        cell:addChild(sprite2)

        local label = cc.Label:createWithSystemFont(strValue, DEFAULT_FONT_TTF, 20)
        label:setAnchorPoint(cc.p(0.5, 0.5))
        label:setPosition(cc.p(77, 30))
        label:setTag(3)
        cell:addChild(label)

好了,基本的使用方法就如此了,但是。。但是,还有最重要的一点,需要大家注意的。

numberOfCellsInTableView返回的个数和TableView创建的cell数量通常是不一样的,这是因为cocos2dx设计上为了节省资源,创建的cell数量 = tabview的高度 / 单个cell的高度 + 1。所以在触摸和选中等逻辑处理的时候,一定不能使用cell来标识。因为同一个cell物理对象,可能会映射N个逻辑对象。

通常我的做法是在tableCellAtIndex中把当前cell对应的逻辑对象存起来,这样在tableCellTouched就可以直接找到物理cell对应的逻辑对象来处理了。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Java成神之路

Java微信公众平台开发_04_自定义菜单

自定义菜单中请求包的数据是Json字符串格式的,请参见:  Java_数据交换_fastJSON_01_用法入门

1393
来自专栏hotqin888的专栏

MeritMS+jQuery.Gantt价值管理系统增加项目进度展示

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/hotqin888/article/det...

2461
来自专栏一“技”之长

iOS使用UIImagePickerController调用系统相机、相册与图库

        UIImagePickerController是系统封装好的一个导航视图控制器,使用其开发者可以十分方便的进行相机相册相关功能的调用。UIIma...

1801
来自专栏Android干货园

一款基于Material Desgin设计的APP

版权声明:本文为博主原创文章,转载请标明出处。 https://blog.csdn.net/lyhhj/article/details/50...

1931
来自专栏游戏杂谈

基于SOUI开发一个简单的小工具

Duilib 很久不维护了,而很多不同的分支,似乎都不太维护。微信 Windows 的版本是基于 Duilib 进行开发的,说明应该还是很广泛的。

2973
来自专栏学海无涯

iOS开发之UITableView联动实现城市选择器

在 iOS开发之城市选择器一文中用两列的UIPickerView实现了城市选择器,今天用两个UITableView来实现一下,首先这种联动在很多地方用得上,而且...

3816
来自专栏疯狂的小程序

微信小程序分享:TabBar不出现如何处理

今天打算开始实战一个微信小程序项目,一开始就踩坑了,正确设置了TabBar,但是TabBar就是不能显示出来,后面才找到原因,这里记录下:

2195
来自专栏运维

DELL R710 服务器内存排错

man dmidecode 可以得到详细的介绍和使用方法,dmidecode - DMI table decoder,DMI (Desktop Manageme...

3402
来自专栏

Flex 上传文件,服务端.net

using System; using System.Data; using System.Configuration; using System.Collec...

721
来自专栏我和未来有约会

从Flash到Silverlight进阶教程-Tweener

从Flash到Silverlight进阶教程 Tweener 在flash中有一个Tweener类,通过这个类我们可以通过代码来创建一些动画效果,这里将要介绍...

3146

扫码关注云+社区

领取腾讯云代金券