ScrollView滚动层容器与button点击事件

今天讲的滚动层容器ScorllView与之前写的ListView滚动列表文章大致相当，他们之间只存在一些小的差异。

这是ListView与button 链接：http://blog.csdn.net/dyd961121/article/details/75450159

 

如果看了ListView列表滚动，这里简单分析一下差异。

ListView是ScrollView的一个子类，所以ScrollView能用的属性在ListView上也都能使用。

ListView方式创建含有button的滚动层相较与 ScrollView方式创建简单 不用设置内部滚动容器的大小尺寸

往里面添加元素会自动扩充容器的大小，用到布局容器Layout。按创建的顺序排列（如果是垂直滚动，

按从上到下依次排列。水平滚动按从左到右排列。）

附上ListView与button创建的图（用循环顺序创建的，左侧水平列表。右侧垂直列表）

详细创建方法，看链接

回到今天的正题，ScrollView滚动层容器。

这是一个垂直滑动的菜单菜单

引入头文件，都是用的UI 所以都一样

 

#include "ui\CocosGUI.h"
using namespace ui;

 

ScrollView创建的具体方式：

 

 

Size visibleSize = Director::getInstance()->getVisibleSize();

	ScrollView *scrollview = ScrollView::create();
	scrollview->setBackGroundImage("listviewbg.jpg");
	scrollview->setBackGroundImageScale9Enabled(true);
	scrollview->setDirection(ScrollView::Direction::VERTICAL); //设置滚动方向为垂直
	scrollview->setContentSize(Size(visibleSize.width*0.6, visibleSize.height*0.7));//可滑动的显示区域大小
	scrollview->setInnerContainerSize(Size(visibleSize.width, visibleSize.height*1.4));// 可滑动区域大小
	scrollview->setPosition(Point(visibleSize.width*0.2, visibleSize.height*0.1));
	scrollview->setBounceEnabled(true);
	this->addChild(scrollview,2);

	for (int i = 0; i < 6; i++)
	{
		Dictionary* strings = Dictionary::createWithContentsOfFile("string.xml");
		const char * str;
		str = ((String *)strings->objectForKey(StringUtils::format("button%d",i)))->getCString();
		auto button = Button::create("editbox.png");
		button->setTitleText(str);//button按钮上显示字符
		button->setTitleFontName("微软雅黑");
		button->setTitleColor(Color3B::BLACK);
		button->setScale(visibleSize.width*0.5 / button->getContentSize().width, visibleSize.height*0.2/ button->getContentSize().height);
		button->setTag(i);
		button->setPosition(Point(scrollview->getContentSize().width/2,scrollview->getInnerContainerSize().height - visibleSize.height*0.2*(i+1)));
		scrollview->addChild(button);
		button->addTouchEventListener([=](Ref *pSender, Widget::TouchEventType type)
		{
			switch (type)
			{
			case Widget::TouchEventType::ENDED:
			{
				auto it = (Button*)pSender;
				flag = it->getTag();
				//log("----%d", flag);
				switch (flag)
				{
				case 0:
					Director::getInstance()->replaceScene(TestLayer::createScene());
					break;
				case 1:
					Director::getInstance()->replaceScene(TestListView::createScene());
					break;
				case 2:
					Director::getInstance()->replaceScene(TestControl::createScene());
					break;
				case 3:
					Director::getInstance()->replaceScene(TestLoadingBar::createScene());
					break;
				case 4:
					Director::getInstance()->replaceScene(TestAudio::createScene());
					break;
				case 5:
					Director::getInstance()->replaceScene(TestRunBackGround::createScene());
					break;
				case 6:
					break;
				}
				break;
			}
			default:
				break;
			}
		});
	}

 

 

 

这样就创建完成了，部分已用注释，大家应该都看得懂。

注：button上的汉字用的xml文件获取。ScrollView需要设置button的位置。

小编初见解，如发现有误的地方，请指正。