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

今天，学习了 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);
}