Cocos2d-x的学习之旅（八）进度条

概述声明 本教程仅用于初学cocos2dx同学使用，内容由本人（Code-Man)编写，此教程使用cocos2dx版本为3.4。本教程内容可以自由转载，但必须同时附带本声明，或注明出处。QQ群：Cocos2d-CodeMonkey ,461679592。 今天来讲一下进度条。进度条在游戏中通常以两种方式存在，我会分别介绍这两种的实现方式。 第一种：条形进度条。 第二种：扇形进度条。 资源： 条形进度条

声明

本教程仅用于初学cocos2dx同学使用，内容由本人（Code-Man)编写，此教程使用cocos2dx版本为3.4。本教程内容可以自由转载，但必须同时附带本声明，或注明出处。QQ群：Cocos2d-CodeMonkey,461679592。

今天来讲一下进度条。进度条在游戏中通常以两种方式存在，我会分别介绍这两种的实现方式。

第一种：条形进度条。 第二种：扇形进度条。
资源：
条形进度条：
效果：
扇形进度条：


效果：

总结：进度条并没有我们想象中那么难，无法就是有一张地图，上面覆盖一张一样大小的图片，根据百分比来进行显示，仅此而已。其实进度条还用在了资源加载方面，关于这方面的知识，会在以后的课程中讲解。

bool LessonEightScene::init(){    if (!Layer::init()) {        return false;    }        WinSize=Director::getInstance()->getVisibleSize();    //背景    auto bg=Sprite::create("LessonOne_Bg.png");    bg->setposition(WinSize/2);    this->addChild(bg);        //第一种更新函数（也叫调度器），每一帧执行一次    this->scheduleUpdate();                    //进度条底部图片    auto progress_bg=Sprite::create("petLvUp_probarFrame.png");    progress_bg->setposition(progress_bg->getContentSize().wIDth/2+100,WinSize.height/2+WinSize.height/2/2);    this->addChild(progress_bg);        //创建一个条形进度条    auto probar=Progresstimer::create(Sprite::create("petLvUp_probar.png"));    //这种进度条锚点（0，0）与底部图片重叠    probar->setAnchorPoint(Vec2(0,0));    //添加到底部图片上    progress_bg->addChild(probar);    //进度条的类型为条形，另一个是扇形。    probar->setType(Progresstimer::Type::bar);    //设置条形进度条是X轴(从左到右，从右到左)为进度的，还是Y(从上到下，从下到上)轴为进度.    probar->setbarChangeRate(Vec2(1,0));    //设置进度条的起始位置    probar->setMIDpoint(Vec2(0,0));    //进度的初始值，数值0~100之间。    probar->setPercentage(0);        //增加经验按钮    auto AddExbutton=MenuItemFont::create("经验加+5",[&,probar](Ref*){        if (probar->getPercentage()<100) {            //进度值小于100，则0.1秒的时间向当前的进度值前进5.            probar->runAction(Progressto::create(0.1,probar->getPercentage()+5));        }else{            //进度值大于等于100则设置进度值为0            probar->setPercentage(0);        }    });     AddExbutton->setposition(progress_bg->getposition()+Vec2(200,0));                    //扇形进度条底部图片    auto progress_bg_2=Sprite::create("sectorProgress.png");    progress_bg_2->setposition(progress_bg_2->getContentSize().wIDth/2+100,WinSize.height/2-WinSize.height/2/2);    this->addChild(progress_bg_2);        //创建一个扇形进度条    auto proSector=Progresstimer::create(Sprite::create("sectorProgress_frame.png"));    //这种进度条锚点（0，0）与底部图片重叠    proSector->setAnchorPoint(Vec2(0,0));    //添加到底部图片上    progress_bg_2->addChild(proSector);    //进度条的类型为条形，另一个是扇形。    proSector->setType(Progresstimer::Type::RADIAL);    //是否反向旋转，默认为false    proSector->setReverseProgress(true);    //进度的初始值，数值0~100之间。    proSector->setPercentage(100);        //扣血按钮    auto stopUpData1button=MenuItemFont::create("血量-5",proSector](Ref*obj){        if (proSector->getPercentage()<=0) {            proSector->setPercentage(100);        }else{            proSector->runAction(Progressto::create(0.1,proSector->getPercentage()-5));        }    });    stopUpData1button->setposition(progress_bg_2->getposition()+Vec2(200,0));        //按钮菜单    auto men=Menu::create(AddExbutton,stopUpData1button,NulL);    men->setposition(Vec2::ZERO);    this->addChild(men);                return true;}

本文Demo资源：http://pan.baidu.com/s/1dD2dRmL 总结

以上是内存溢出为你收集整理的Cocos2d-x的学习之旅（八）进度条全部内容，希望文章能够帮你解决Cocos2d-x的学习之旅（八）进度条所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。