cocos2d-C++ 学习UI控件（三）之 LoadingBar|ScrollView

最新推荐文章于 2020-06-22 20:59:29 发布

沙猪大少

最新推荐文章于 2020-06-22 20:59:29 发布

阅读量1.1k

点赞数 1

分类专栏：游戏开发 cocos2d-x 文章标签： cocos2d-x ui 控件

本文链接：https://blog.csdn.net/qq_16112417/article/details/51242356

版权

游戏开发 cocos2d-x 专栏收录该内容

17 篇文章 0 订阅

订阅专栏

今天，学习了 cocos2dx中UI控件里面的滑动框ScrollView和进度条 LoadingBar。首先说明一下我现在学习的都是调用cocos2dx中UI控件的API，而不是自己实现自己的UI控件。原因有两点，

1.我现在刚开始学习这些UI，感觉应该先从基础开始，熟悉拉这些UI控件之后，在扩展自己的。

2.现在扩展自己的UI控件不是说不可以，但感觉扩展有复杂又简单，花太多时间去扩展一个完善复杂的真的没必要，毕竟现在是学习阶段，应该把时间更多的放在学习基础的东西上。

----------------------------------------------------------------------------- LoadingBar

void HelloWorld::addLoadingBar()
{
	auto loadingbar = LoadingBar::create("loading.png");

	auto bg_Sprite = Sprite::create("loading-bg.png");
	bg_Sprite->setAnchorPoint(Vec2(0, 0.5));
	bg_Sprite->setPosition(Vec2(300, 300));
	Size bg_size = bg_Sprite->getContentSize();       //获取背景图大小
	bg_Sprite->addChild(loadingbar);

	loadingbar->setAnchorPoint(Vec2(0, 0.5));
	loadingbar->setPosition(Vec2(0, bg_size.height/2));
	loadingbar->setScale9Enabled(true);                  //开启九宫格渲染。
	loadingbar->setContentSize(bg_size);                  //设置进度条大小
	//loadingbar->setCapInsets(Rect(0,0,bg_size.width, bg_size.height));       //还不是很清楚作用
	loadingbar->setPercent(80);            //设置当前进度

	this->addChild(bg_Sprite,1);
}

进度条的效果图

----------------------------------------------------------------------------- ScrollView

void HelloWorld::addScrollView()
{
	auto Scroll_sprite = Sprite::create("item4.jpg");
	Size Scroll_Inner =  Scroll_sprite->getContentSize();

	auto scroll = ScrollView::create();
	scroll->setInnerContainerSize(Scroll_Inner);                  //设置滑动框的内容大小
	scroll->setContentSize(Size(200, 200));                      //设置滑动框的大小
	scroll->setDirection(ScrollView::Direction::BOTH);          //设置上下左右都可以滑动
	scroll->setBackGroundImage("button/Button01.png");         //设置背景图片     
	scroll->setBackGroundImageScale9Enabled(true);            //设置layout背景的capInsets,它只在开启scale9后影响背景图的渲染
	scroll->addChild(Scroll_sprite);                         //添加内容，这里我添加了一个Sprite，也可以是其他的对象，如果想显示丰富的内容可以添加layer

	Scroll_sprite->setPosition(Vec2(Scroll_Inner.width/2,Scroll_Inner.height/2));              //布局，把添加的Sprite位置调到中心点

	scroll->setScrollBarColor(Color3B(255,0,0));                  //修改滑块颜色，给滑块添加图片，没有找到API，可能要自己添加
	//ScrollViewBar* ScrollviewBar_H = ScrollViewBar::create(scroll, ScrollView::Direction::HORIZONTAL);               //获取滑动框的滑块对象
	scroll->setAnchorPoint(Vec2(0, 0));          
	scroll->setPosition(Vec2(100, 100));
	this->addChild(scroll,1);
}