ListView 两列多行实现

ListView 两行多列实现

ListView只能添加Layout对象，不能添加Node的非Widget对象

1.使用cocosStudio1.6制作出 ListView 的界面

2.手动向 ListView 中添加内容

3.将要添加的内容也使用 cocosStudio 制作出来

4.然后创建一个新的类用来获取将要添加的内容

5.创建出来多个将要添加的内容

6.创建一个cocos2d::ui::Layout 将其包裹起来，并设置其各自的位置，(本代码就添加两列)

7.将创建的多个cocos2d::ui::Layout一次添加到ListView中(m_pListView->pushBackCustomItem(pLayout1);)

8.m_pListView->pushBackCustomItem(pLayout1);

　　添加的是：每调用一次就添加一行，下次再调用的时候就将其添加到下一行(本代码是竖直中心对齐)

代码：(未优化)

 1 HelloWorld.h
 2
 3 #ifndef __HELLOWORLD_SCENE_H__
 4 #define __HELLOWORLD_SCENE_H__
 5
 6 #include "cocos2d.h"
 7
 8 // 使用 cocosStudio 1.6 制作的头文件
 9 #include "cocos-ext.h"
10 USING_NS_CC;
11 USING_NS_CC_EXT;
12 using namespace cocos2d::ui;
13
14 class HelloWorld : public cocos2d::CCLayer
15 {
16 public:
17     // Here's a difference. Method 'init' in cocos2d-x returns bool, instead of returning 'id' in cocos2d-iphone
18     virtual bool init();
19
20     // there's no 'id' in cpp, so we recommend returning the class instance pointer
21     static cocos2d::CCScene* scene();
22
23     // a selector callback
24     void menuCloseCallback(CCObject* pSender);
25     void   scrollCallBack(CCObject* object , ScrollviewEventType type);
26
27     // implement the "static node()" method manually
28     CREATE_FUNC(HelloWorld);
29 };
30
31 #endif // __HELLOWORLD_SCENE_H__

HelloWorld.cpp#include "HelloWorldScene.h"
#include "ListViewItem.h"
#include "cocos-ext.h"USING_NS_CC_EXT;USING_NS_CC;CCScene* HelloWorld::scene()
{// 'scene' is an autorelease objectCCScene *scene = CCScene::create();// 'layer' is an autorelease objectHelloWorld *layer = HelloWorld::create();// add layer as a child to scenescene->addChild(layer);// return the scenereturn scene;
}// on "init" you need to initialize your instance
bool HelloWorld::init()
{//
    // 1. super init firstif ( !CCLayer::init() ){return false;}//cocos2d::ui::Widget* LV = GUIReader::shareReader()->widgetFromJsonFile("LV_1.json"); // LV_1.ExportJson//UILayer*  m_pUIlayer = UILayer::create();//m_pUIlayer->addWidget(LV);//this->addChild(m_pUIlayer);//cocos2d::ui::UIListView* m_pHeroList = dynamic_cast<cocos2d::ui::UIListView*>(m_pUIlayer->getWidgetByName("ListView_1"));//m_pHeroList->addEventListenerScrollView(this,SEL_ScrollViewEvent(&HelloWorld::scrollCallBack));//LV->setTouchEnabled(true);// 以下使用的必须是json文件cocos2d::ui::Widget *m_pWidget = GUIReader::shareReader()->widgetFromJsonFile("ListView_1/ListView_1.json");// 创建一个可以装Widge的一个层cocos2d::ui::UILayer *m_pUIlayer = cocos2d::ui::UILayer::create();// 使用 addWidget 方法加载 cocosStudio制作的json文件m_pUIlayer->addWidget(m_pWidget);// 将 UILayer 添加到场景中this->addChild(m_pUIlayer);// 获取文件中的 ListView 列表容器cocos2d::ui::UIListView *m_pListView = dynamic_cast<cocos2d::ui::UIListView*>(m_pUIlayer->getWidgetByName("dylv_twolistview"));// 添加时间交互m_pListView->addEventListenerScrollView(this, SEL_ScrollViewEvent(&HelloWorld::scrollCallBack));// 获取按钮cocos2d::ui::UIButton *button = dynamic_cast<cocos2d::ui::UIButton*>(m_pUIlayer->getWidgetByName("dybtn_button"));// 创建一个 layout 用来添加另一个 cocosStudio 导出的 json 文件cocos2d::ui::Layout *pLayout1 = cocos2d::ui::Layout::create();cocos2d::ui::Layout *pLayout2 = cocos2d::ui::Layout::create();cocos2d::ui::Layout *pLayout3 = cocos2d::ui::Layout::create();cocos2d::ui::Layout *pLayout4 = cocos2d::ui::Layout::create();cocos2d::ui::Layout *pLayout5 = cocos2d::ui::Layout::create();cocos2d::ui::Layout *pLayout6 = cocos2d::ui::Layout::create();cocos2d::ui::Layout *pLayout7 = cocos2d::ui::Layout::create();// 设置 layout 的大小pLayout1->setSize(cocos2d::CCSizeMake(140,70));pLayout2->setSize(cocos2d::CCSizeMake(140,70));pLayout3->setSize(cocos2d::CCSizeMake(140,70));pLayout4->setSize(cocos2d::CCSizeMake(140,70));pLayout5->setSize(cocos2d::CCSizeMake(140,70));pLayout6->setSize(cocos2d::CCSizeMake(140,70));pLayout7->setSize(cocos2d::CCSizeMake(140,70));// 创建另一个 json 文件， 即一个按钮 （使用 cocosStudio 制作）ListViewItem *item1 = ListViewItem::create(1);ListViewItem *item2 = ListViewItem::create(2);ListViewItem *item3 = ListViewItem::create(3);ListViewItem *item4 = ListViewItem::create(4);ListViewItem *item5 = ListViewItem::create(5);ListViewItem *item6 = ListViewItem::create(6);ListViewItem *item7 = ListViewItem::create(7);ListViewItem *item8 = ListViewItem::create(8);ListViewItem *item9 = ListViewItem::create(9);ListViewItem *item10 = ListViewItem::create(10);ListViewItem *item11 = ListViewItem::create(11);ListViewItem *item12 = ListViewItem::create(12);ListViewItem *item13 = ListViewItem::create(13);// 设置按钮的位置 ( 实现两排的效果， 一个在前，一个在后 )item1->setPosition(ccp(0,0));item2->setPosition(ccp(70,0));// 将两个 按钮 都添加到一个 layout 中，使其实现在同一排的效果pLayout1->addChild(item1);pLayout1->addChild(item2);item3->setPosition(ccp(0,0));item4->setPosition(ccp(140,0));pLayout2->addChild(item3);pLayout2->addChild(item4);item5->setPosition(ccp(0,0));item6->setPosition(ccp(70,0));pLayout3->addChild(item5);pLayout3->addChild(item6);item7->setPosition(ccp(0,0));item8->setPosition(ccp(70,0));pLayout4->addChild(item7);pLayout4->addChild(item8);item9->setPosition(ccp(0,0));item10->setPosition(ccp(70,0));pLayout5->addChild(item9);pLayout5->addChild(item10);item11->setPosition(ccp(0,0));item12->setPosition(ccp(70,0));pLayout6->addChild(item11);pLayout6->addChild(item12);item13->setPosition(ccp(0,0));//item14->setPosition(ccp(70,0));
pLayout7->addChild(item13);// 将 layout 依次添加到 ListView 中， 每调用一次这个方法，都是在下面在添加一列m_pListView->pushBackCustomItem(pLayout1);m_pListView->pushBackCustomItem(pLayout2);m_pListView->pushBackCustomItem(pLayout3);m_pListView->pushBackCustomItem(pLayout4);m_pListView->pushBackCustomItem(pLayout5);m_pListView->pushBackCustomItem(pLayout6);m_pListView->pushBackCustomItem(pLayout7);return true;
}// ListView 的事件交互的方法
void   HelloWorld::scrollCallBack(CCObject* object , ScrollviewEventType type)
{switch (type){case SCROLLVIEW_EVENT_SCROLL_TO_BOTTOM:{CCLOG("-- silent -- 1 -- SCROLLVIEW_EVENT_SCROLL_TO_BOTTOM");}break;case SCROLLVIEW_EVENT_SCROLLING:{CCLOG("-- silent -- 2 -- SCROLLVIEW_EVENT_SCROLLING");}break;case SCROLLVIEW_EVENT_BOUNCE_RIGHT:{CCLOG("-- silent -- 3 -- SCROLLVIEW_EVENT_BOUNCE_RIGHT");}break;default:break;}
}void HelloWorld::menuCloseCallback(CCObject* pSender)
{
#if (CC_TARGET_PLATFORM == CC_PLATFORM_WINRT) || (CC_TARGET_PLATFORM == CC_PLATFORM_WP8)CCMessageBox("You pressed the close button. Windows Store Apps do not implement a close button.","Alert");
#elseCCDirector::sharedDirector()->end();
#if (CC_TARGET_PLATFORM == CC_PLATFORM_IOS)exit(0);
#endif
#endif
}

 1 ListViewItem.h
 2
 3 #ifndef __LISTVIEWITEM_SCENE_H__
 4 #define __LISTVIEWITEM_SCENE_H__
 5
 6 #include "cocos2d.h"
 7
 8 // 使用 cocosStudio 1.6 制作的头文件
 9 #include "cocos-ext.h"
10 USING_NS_CC;
11 USING_NS_CC_EXT;
12 using namespace cocos2d::ui;
13
14
15 class ListViewItem : public cocos2d::ui::UILayout
16 {
17 public:
18     // Here's a difference. Method 'init' in cocos2d-x returns bool, instead of returning 'id' in cocos2d-iphone
19     virtual bool init(int id);
20
21     // there's no 'id' in cpp, so we recommend returning the class instance pointer
22     static ListViewItem* create(int id);
23
24     // 按钮的回调函数
25     void menuCallBack(cocos2d::CCObject*pSender,cocos2d::ui::TouchEventType type);
26
27
28 };
29
30 #endif // __LISTVIEWITEM_SCENE_H__

ListViewItem.cpp#include "ListViewItem.h"
#include "cocos-ext.h"USING_NS_CC_EXT;
USING_NS_CC;ListViewItem* ListViewItem::create(int id)
{ListViewItem *item = new ListViewItem();if(item && item->init(id)){item -> autorelease();return item;}else{delete item;item = NULL;return NULL;}
}// on "init" you need to initialize your instance
bool ListViewItem::init(int id)
{//
    // 1. super init firstif ( !cocos2d::ui::UILayout::init() ){return false;}cocos2d::ui::Widget*pWidget =GUIReader::shareReader()->widgetFromJsonFile("ListViewItem_1/ListViewItem_1.json");this->addChild(pWidget);this->setTouchEnabled(true);cocos2d::ui::UIButton *button = dynamic_cast<cocos2d::ui::UIButton*>(pWidget->getChildByName("dybtn_buttonitem"));button->setTouchEnabled(true);button->addTouchEventListener(this, SEL_TouchEvent(&ListViewItem::menuCallBack));cocos2d::ui::UILabel *m_pLabel = dynamic_cast<cocos2d::ui::UILabel*>(button->getChildByName("dylab_numbutton"));char str[5];sprintf(str, "%d", id);m_pLabel->setText(str);m_pLabel->setColor(ccc3(255, 0, 0));return true;
}void ListViewItem::menuCallBack(cocos2d::CCObject*pSender,cocos2d::ui::TouchEventType type){// 获取被点击的那个按钮cocos2d::ui::UIButton *button = dynamic_cast<cocos2d::ui::UIButton*>(pSender);cocos2d::ui::UILabel *m_pLabel = dynamic_cast<cocos2d::ui::UILabel*>(button->getChildByName("dylab_numbutton"));std::string strButtonNum = m_pLabel->getName();switch (type){case cocos2d::ui::TouchEventType::TOUCH_EVENT_BEGAN:{CCLOG("-- silent -- began -- menuCallBack ---- %s", strButtonNum.c_str());}break;case cocos2d::ui::TouchEventType::TOUCH_EVENT_MOVED:{}break;case cocos2d::ui::TouchEventType::TOUCH_EVENT_ENDED:{CCLOG("-- silent -- ended -- menuCallBack ---- %s", strButtonNum.c_str());}break;case cocos2d::ui::TouchEventType::TOUCH_EVENT_CANCELED:{}break;default:break;}}

转载于:https://www.cnblogs.com/dudu580231/p/4916742.html

ListView 两列多行实现相关推荐

flex 两列多行布局
flex 两列多行布局 display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; 把这段 ...
Excel如何把两列多行数据转为多列少行
今天跟大家分享一下Excel如何把两列多行数据转为多列多行 1.如下图有两列数据,现在我们想要将这两列数据转为多列 2.首先我们选中要转换的数据单元格区域 3.然后点击下图选项(Excel工具箱,百度 ...
日期选择窗口_Excel攻略|添加日期、智能填充、多窗口同步、两列（行）交换
↑点上方蓝字子玉科技关注我们并分享点在看一.添加日期在表单中不断地输入日期想必是大家都经历过的痛苦,那么该如何避免这一切呢? # 1 选中目标空格,使用ctrl+:组合键,就能快捷输入现下的日期, ...
根据接口获取得数据，布局两列多行的代码写法
html代码 <div class="template-fa"><div class="template" v-for="(item ...
用excle插入自定义两列（行）数据作为X、Y轴生成图表
最近在学习DSP的ADC采集模块,当采集到数据后,往往需要将两列差分信号的数据生成散点图,查了好多资料都没有一个系统的讲解,索性自己探索一下!经过不翻车索,终于研究出来了,对该过程进行一下记录.防止自 ...
python 倒数两列_100行Python代码实现每天不同时间段定时给女友发消息
这篇文章主要介绍了100行Python代码,每天不同时间段定时给女友发消息,本文给出了实现思路,代码简单易懂非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下我忘了,会写程序的人哪里的女朋友. ...
查询时拼接两列数据_如何用VBA代码查询两列数据差异？
爱就一个字,我只说一次-- 北京市第三交通委提醒您:代码千万条,注释第一条,命名不规范,修订两行泪-- 咳,给大家拜晚年了,再提前祝大家元宵快乐-- 我们今天和大家分享的内容是如何用VBA代码查询两列 ...
谷歌浏览器网页表格复制一列_如何冻结或隐藏Google表格中的列和行
谷歌浏览器网页表格复制一列 The greater the number of rows and columns in your Google Sheets spreadsheet, the more ...
pandas计算dataframe两列数据值相等的行号、取出DataFrame中两列值相等的行号
pandas计算dataframe两列数据值相等的行号.取出DataFrame中两列值相等的行号目录 pandas计算dataframe两列数据值相等的行号.取出DataFrame中两列值相等的行号

ListView 两列多行实现

ListView 两列多行实现相关推荐

最新文章

热门文章