JSRUN 用代码说话

CACollectionView(容器)

编辑教程

CACollectionView(容器)

类说明

CACollectionView同CATableView类似,主要用于数据的展示,实现了tableView的基本功能,同时对tableView拓展,更完美的进行展示数据。

CACollectionView的使用方法和CATableView比较类似,我们也要分别使用:CACollectionView、CACollectionViewCell、CACollectionViewDelegate、CACollectionViewDataSource来构建。

CACollectionView是表格视图的容器,是容器的载体。
CACollectionViewCell是表格视图的一个单元(本节后面简称cell)。
CACollectionViewDelegate是交互代理,响应cell选中和取消状态。
CACollectionViewDataSource是数据代理,设置Selection个数及Selection包含cell个数。

CACollectionView 属性

属性 说明
CollectionViewDataSource 添加数据代理
CollectionViewDelegate 添加交互代理
CollectionHeaderView 添加头部视图
CollectionFooterView 添加尾部视图
CollectionHeaderHeight 设置头部的高度
CollectionFooterHeight 设置尾部的高度
HoriInterval 水平间隔
VertInterval 垂直间隔
AllowsSelection 允许选择
AllowsMultipleSelection 允许多个选择
AlwaysTopSectionHeader 总是顶部的标题
AlwaysBottomSectionFooter 总是底部的节尾

CACollectionView 方法

方法 说明
createWithFrame 创建,并指定其Frame,默认Frame为(0,0,0,0)
createWithCenter 创建,并指定其Center,默认Center为(0,0,0,0)
dequeueReusableCellWithIdentifier 从复用队列中寻找指定标识符的cell
setAllowsSelection 是否开启cell选择
setAllowsMultipleSelection 是否可以多选cell
setSelectRowAtIndexPath 通过索引选择一行
setUnSelectRowAtIndexPath 通过索引取消选择一行
setShowsScrollIndicators 设置显示滚动指示器
cellForRowAtIndexPath 根据索引获取显示的cell
getHighlightCollectionCell 获取高亮显示的collectioncell
switchPCMode 开关PC模式
init 初始化
clearData 清除数据
reloadData 重载数据

CACollectionViewDelegate 方法

方法 说明
collectionViewDidSelectCellAtIndexPath 选中cell时调用
collectionViewDidDeselectCellAtIndexPath 取消选择cell时调用

CACollectionViewDataSource 方法

方法 说明
collectionCellAtIndex 获取指定cell
collectionViewHeightForRowAtIndexPath cell的高度
numberOfItemsInRowsInSection 每个cell里的item数量
numberOfRowsInSection 获取对应的section所包含的cell个数
numberOfSections 获取tableview包含的section个数
collectionViewSectionViewForHeaderInSection headerView的内容
collectionViewHeightForHeaderInSection 每个section的headerView
collectionViewSectionViewForFooterInSection footerView的内容
collectionViewHeightForFooterInSection 每个section的footerView
collectionViewWillDisplayCellAtIndex 回调当前将要显示的collectionView

我们本机的示例,不再使用自定义的CACollectionViewCell的方法来实现,我们来看看本节的示例代码:


#ifndef __HelloCpp__ViewController__
#define __HelloCpp__ViewController__

#include <iostream>
#include "CrossApp.h"

USING_NS_CC;

class FirstViewController : public CAViewController, CACollectionViewDelegate, CACollectionViewDataSource
{

public:
    FirstViewController();
    virtual ~FirstViewController();

protected:    
    void viewDidLoad();

    void viewDidUnload();

public:
    //选中item时调用
    virtual void collectionViewDidSelectCellAtIndexPath(CACollectionView *collectionView, unsigned int section, unsigned int row, unsigned int item);

    //取消item是调用
    virtual void collectionViewDidDeselectCellAtIndexPath(CACollectionView *collectionView, unsigned int section, unsigned int row, unsigned int item);

    //获取指定cell
    virtual CACollectionViewCell* collectionCellAtIndex(CACollectionView *collectionView, const DSize& cellSize, unsigned int section, unsigned int row, unsigned int item);

    //section的个数
    virtual unsigned int numberOfSections(CACollectionView *collectionView);

    //section中的cell个数
    virtual unsigned int numberOfRowsInSection(CACollectionView *collectionView, unsigned int section);

    //每个cell中Item的个数
    virtual unsigned int numberOfItemsInRowsInSection(CACollectionView *collectionView, unsigned int section, unsigned int row);

    //cell的高度
    virtual unsigned int collectionViewHeightForRowAtIndexPath(CACollectionView* collectionView, unsigned int section, unsigned int row);

private:
    //用于获得屏幕的size
    CADipSize size;

    //CACollectionView
    CACollectionView* p_Conllection;

    //颜色容器
    std::vector<CAColor4B> colorArr;
};

#endif /* defined(__HelloCpp__ViewController__) */

FirstViewController.cpp内容:

#include "FirstViewController.h"

FirstViewController::FirstViewController()
{
}

FirstViewController::~FirstViewController()
{
}

void FirstViewController::viewDidLoad()
{
    //获得屏幕大小
    size = this->getView()->getBounds().size;

    //随机出颜色
    for (int i = 0; i < 40; i++)
    {
        char r = CCRANDOM_0_1() * 255;
        char g = CCRANDOM_0_1() * 255;
        char b = CCRANDOM_0_1() * 255;

        //将随机的ccc4对象放入到容器里
        colorArr.push_back(ccc4(r, g, b, 255));
    }

    //生成CACollectionView
    p_Conllection = CACollectionView::createWithFrame(this->getView()->getBounds());

    //开启选中
    p_Conllection->setAllowsSelection(true);

    //开启多选
    p_Conllection->setAllowsMultipleSelection(true);

    //绑定交互代理
    p_Conllection->setCollectionViewDelegate(this);

    //绑定数据代理
    p_Conllection->setCollectionViewDataSource(this);

    //item水平间的距离
    p_Conllection->setHoriInterval(40);

    //itme竖直间的距离
    p_Conllection->setVertInterval(40);

    //添加到屏幕渲染
    this->getView()->addSubview(p_Conllection);
}

void FirstViewController::viewDidUnload()
{
    // Release any retained subviews of the main view.
    // e.g. self.myOutlet = nil;
}

void FirstViewController::collectionViewDidSelectCellAtIndexPath(CACollectionView *collectionView, unsigned int section, unsigned int row, unsigned int item)
{
    //选中
    CCLog("选中");
}

void FirstViewController::collectionViewDidDeselectCellAtIndexPath(CACollectionView *collectionView, unsigned int section, unsigned int row, unsigned int item)
{
    //取消选中
    CCLog("取消选中");
}

CACollectionViewCell* FirstViewController::collectionCellAtIndex(CACollectionView *collectionView, const DSize& cellSize, unsigned int section, unsigned int row, unsigned int item)
{
    //计算 如果cell个数大于颜色数组,则返回空
    if (row * 3 + item >= colorArr.size())
    {
        return NULL;
    }

    //获得
    DSize _size = cellSize;

    //根据标识获得CACollectionViewCell
    CACollectionViewCell* p_Cell = collectionView->dequeueReusableCellWithIdentifier("CrossApp");

    //如果没有找到相应的CACollectionViewCell则新建一个
    if (p_Cell == NULL)
    {
        p_Cell = CACollectionViewCell::create("CrossApp");

        //生成Item背景
        CAView* itemImage = CAView::createWithFrame(DRect(0, 0, _size.width, _size.height));
        itemImage->setTag(99);
        p_Cell->addSubview(itemImage);
        DSize itemSize = itemImage->getBounds().size;

        //生成itemCALabel
        CALabel* itemText = CALabel::createWithCenter(DRect(itemSize.width*0.5, itemSize.height*0.5, 150, 40));
        itemText->setTag(100);
        itemText->setFontSize(29);
        itemText->setTextAlignment(CATextAlignmentCenter);
        itemText->setVerticalTextAlignmet(CAVerticalTextAlignmentCenter);
        itemImage->addSubview(itemText);
    }

    //设置Item背景颜色
    CAView* itemImageView = p_Cell->getSubviewByTag(99);
    itemImageView->setColor(colorArr.at(row * 3 + item));
    CCLog("%d", row * 3 + item);

    //设置itme文本显示
    char pos[20] = "";
    sprintf(pos, "(%d,%d,%d)", section, row, item);
    CALabel* itemText = (CALabel*)p_Cell->getSubviewByTag(99)->getSubviewByTag(100);
    itemText->setText(pos);
    return p_Cell;
}

unsigned int FirstViewController::numberOfSections(CACollectionView *collectionView)
{
    return 1;
}

unsigned int FirstViewController::numberOfRowsInSection(CACollectionView *collectionView, unsigned int section)
{
    return colorArr.size() % 3 == 0 ? colorArr.size() / 3 : colorArr.size() / 3 + 1;
}

unsigned int FirstViewController::numberOfItemsInRowsInSection(CACollectionView *collectionView, unsigned int section, unsigned int row)
{
    return 3;
}

unsigned int FirstViewController::collectionViewHeightForRowAtIndexPath(CACollectionView* collectionView, unsigned int section, unsigned int row)
{
    return (this->getView()->getBounds().size.width - 40 * 4) / 3;
}

CACollectionView 属性说明

CollectionViewDataSource

类型:CACollectionViewDataSource*

解释:添加数据代理。set/get{}。

CollectionViewDelegate

类型:CACollectionViewDelegate*

解释:添加交互代理。set/get{}。

CollectionHeaderView

类型:CAView*

解释:添加头部视图。set/get{}。

CollectionFooterView

类型:CAView**

解释:添加尾部视图。set/get{}。

CollectionHeaderHeight

类型:unsigned int

解释:设置头部的高度。set/get{}。

CollectionFooterHeight

类型:unsigned int

解释:设置尾部的高度。set/get{}。

HoriIntervalsetHoriInterval

类型:unsigned int

解释:水平间隔。set/get{}。

VertInterval

类型:unsigned int

解释:垂直间隔。set/get{}。

AllowsSelection

类型:bool

解释:允许选择。is{}。

AllowsMultipleSelection

类型:bool

解释:允许多个选择。is{}。

AlwaysTopSectionHeader

类型:bool

解释:总是顶部的标题。is/set{}。

AlwaysBottomSectionFooter

类型:bool

解释:总是底部的节尾。is/set{}。


CACollectionView 方法说明

static CACollectionView* createWithFrame(const DRect& rect);

返回值:static CACollectionView*

参数:

类型 参数名 说明
DRect rect 区域大小

解释:创建,并指定其Frame,默认Frame为(0,0,0,0)

static CACollectionView* createWithCenter(const DRect& rect);

返回值:static CACollectionView*

参数:

类型 参数名 说明
DRect rect 中心点的位置及大小

解释:创建,并指定其Center,默认Center为(0,0,0,0)

CACollectionViewCell dequeueReusableCellWithIdentifier(const char reuseIdentifier);

返回值:CACollectionViewCell*

参数:

类型 参数名 说明
char reuseIdentifier 重用标识符

解释:从复用队列中寻找指定标识符的cell

virtual void setAllowsSelection(bool var);

返回值:virtual void

参数:

类型 参数名 说明
bool var 是否开启cell选择

解释:设置是否开启cell选择

virtual void setAllowsMultipleSelection(bool var);

返回值:virtual void

参数:

类型 参数名 说明
bool var 是否可以多选cell

解释:设置是否可以多选cell

void setSelectRowAtIndexPath(unsigned int section, unsigned int row, unsigned int item);

返回值:void

参数:

类型 参数名 说明
unsigned int section Section
unsigned int row
unsigned int item 项目

解释:设置索引路径选择行

void setUnSelectRowAtIndexPath(unsigned int section, unsigned int row, unsigned int item);

返回值:void

参数:

类型 参数名 说明
unsigned int section Section
unsigned int row
unsigned int item 项目

解释:设置索引路径不允许选择行

virtual void setShowsScrollIndicators(bool var);

返回值:virtual void

参数:

类型 参数名 说明
bool var 是否显示滚动指示器

解释:设置显示滚动指示器

CACollectionViewCell* cellForRowAtIndexPath(unsigned int section, unsigned int row, unsigned int item);

返回值:CACollectionViewCell*

参数:

类型 参数名 说明
unsigned int section Section
unsigned int row
unsigned int item 项目

解释:根据索引获取显示的cell

CACollectionViewCell* getHighlightCollectionCell();

返回值:CACollectionViewCell*

参数:

解释:获取高亮显示的collectioncell

virtual void switchPCMode(bool var);

返回值:virtual void

参数:

类型 参数名 说明
bool var 开关

解释:开关PC模式

virtual bool init();

返回值:virtual bool

参数:

解释:初始化

void clearData();

返回值:void

参数:

解释:清除数据

void reloadData();

返回值:void

参数:

解释:重载数据

CACollectionViewDelegate 方法说明

virtual void collectionViewDidSelectCellAtIndexPath(CACollectionView *collectionView, unsigned int section, unsigned int row, unsigned int item){};

返回值:virtual void

参数:

类型 参数名 说明
CACollectionView collectionView cell
unsigned int section Section
unsigned int row
unsigned int item 项目

解释:选中cell时调用

virtual void collectionViewDidDeselectCellAtIndexPath(CACollectionView *collectionView, unsigned int section, unsigned int row, unsigned int item){};

返回值:virtual void

参数:

类型 参数名 说明
CACollectionView collectionView cell
unsigned int section Section
unsigned int row
unsigned int item 项目

解释:取消选择cell时调用


CACollectionViewDataSource 方法说明

virtual CACollectionViewCell collectionCellAtIndex(CACollectionView collectionView, const DSize& cellSize, unsigned int section, unsigned int row, unsigned int item)

返回值:virtual CACollectionViewCell*

参数:

类型 参数名 说明
CACollectionView collectionView cell
DSize cellSize cell大小
unsigned int section Section
unsigned int row
unsigned int item 项目

解释:获取指定cell

virtual unsigned int collectionViewHeightForRowAtIndexPath(CACollectionView* collectionView, unsigned int section, unsigned int row)

返回值:virtual unsigned int

参数:

类型 参数名 说明
CACollectionView collectionView cell
unsigned int section Section
unsigned int row
unsigned int item 项目

解释:cell的高度

virtual unsigned int numberOfItemsInRowsInSection(CACollectionView *collectionView, unsigned int section, unsigned int row)

返回值:virtual unsigned int

参数:

类型 参数名 说明
CACollectionView collectionView cell
unsigned int section Section
unsigned int row
unsigned int item 项目

解释:每个cell里的item数量

virtual unsigned int numberOfRowsInSection(CACollectionView *collectionView, unsigned int section)

返回值:virtual unsigned int

参数:

类型 参数名 说明
CACollectionView collectionView cell
unsigned int section Section

解释:获取对应的section所包含的cell个数

virtual unsigned int numberOfSections(CACollectionView *collectionView)

返回值:virtual unsigned int

参数:

类型 参数名 说明
CACollectionView collectionView cell

解释:获取tableview包含的section个数

virtual CAView collectionViewSectionViewForHeaderInSection(CACollectionView collectionView, const DSize& viewSize, unsigned int section)

返回值:virtual CAView*

参数:

类型 参数名 说明
CACollectionView collectionView cell
DSize cellSize cell大小
unsigned int section Section

解释:headerView的内容

virtual unsigned int collectionViewHeightForHeaderInSection(CACollectionView *collectionView, unsigned int section)

返回值:virtual unsigned int

参数:

类型 参数名 说明
CACollectionView collectionView cell
unsigned int section Section

解释:每个section的headerView

virtual CAView collectionViewSectionViewForFooterInSection(CACollectionView collectionView, const DSize& viewSize, unsigned int section)

返回值:virtual CAView*

参数:

类型 参数名 说明
CACollectionView collectionView cell
const DSize& viewSize 视图大小
unsigned int section Section

解释:footerView的内容

virtual unsigned int collectionViewHeightForFooterInSection(CACollectionView *collectionView, unsigned int section)

返回值:virtual unsigned int

参数:

类型 参数名 说明
CACollectionView collectionView cell
CCSize cellSize cell大小
unsigned int section Section

解释:每个section的footerView

virtual void collectionViewWillDisplayCellAtIndex(CACollectionView table, CACollectionViewCell cell, unsigned int section, unsigned int row, unsigned int item) {};

返回值:virtual void

参数:

类型 参数名 说明
CACollectionView* table
CACollectionView collectionView cell
unsigned int section Section
unsigned int row
unsigned int item 项目

解释:回调当前将要显示的collectionView

JSRUN闪电教程系统是国内最先开创的教程维护系统, 所有工程师都可以参与共同维护的闪电教程,让知识的积累变得统一完整、自成体系。 大家可以一起参与进共编,让零散的知识点帮助更多的人。
X
支付宝
9.99
无法付款,请点击这里
金额: 0
备注:
转账时请填写正确的金额和备注信息,到账由人工处理,可能需要较长时间
如有疑问请联系QQ:565830900
正在生成二维码, 此过程可能需要15秒钟