cocos2dx3.0进度条的简析
发布时间:2020-12-14 20:26:57 所属栏目:百科 来源:网络整理
导读:可以 说,进度条是游戏中特别常用的一个控件,大部分游戏都会需要用到资源加载条,技能道具的cd,或者是时间条。最近特别喜欢看底层,自我感觉底层是一个让人熟悉整个框架的特别好的方式,这次就来看下进度条的底层,感受一下。 class CC_DLL ProgressTimer
可以说,进度条是游戏中特别常用的一个控件,大部分游戏都会需要用到资源加载条,技能道具的cd,或者是时间条。最近特别喜欢看底层,自我感觉底层是一个让人熟悉整个框架的特别好的方式,这次就来看下进度条的底层,感受一下。 class CC_DLL ProgressTimer : public Node #ifdef EMSCRIPTEN,public GLBufferedNode #endif // EMSCRIPTEN { public: /** Types of progress @since v0.99.1 */ enum class Type//进度条类型枚举,顾名思义,radial是圆形增减的进度条,bar是单方向增减的进度条 { /// Radial Counter-Clockwise RADIAL,/// Bar BAR,}; /** Creates a progress timer with the sprite as the shape the timer goes through */ static ProgressTimer* create(Sprite* sp);//通过精灵去创建该对象 /** Change the percentage to change progress. */ inline Type getType() const { return _type; }//返回进度条类型 /** Percentages are from 0 to 100 */ inline float getPercentage() const {return _percentage; }//返回当前显示部分的百分值 /** The image to show the progress percentage,retain */ inline Sprite* getSprite() const { return _sprite; } //设置当前显示部分的百分值,精灵,类型 void setPercentage(float percentage); void setSprite(Sprite *sprite); void setType(Type type); /** * @js setReverseDirection * @lua setReverseDirection */ void setReverseProgress(bool reverse);//设置进度条的方向,圆形增减类型有效,设置顺时针和逆时针 inline bool isReverseDirection() { return _reverseDirection; }; inline void setReverseDirection(bool value) { _reverseDirection = value; }; /** * Midpoint is used to modify the progress start position. * If you're using radials type then the midpoint changes the center point * If you're using bar type the the midpoint changes the bar growth * it expands from the center but clamps to the sprites edge so: * you want a left to right then set the midpoint all the way to Point(0,y) * you want a right to left then set the midpoint all the way to Point(1,y) * you want a bottom to top then set the midpoint all the way to Point(x,0) * you want a top to bottom then set the midpoint all the way to Point(x,1) */ /** 根据注释可知,setmidPoint是设置进度条的圆心点,即开始位置,默认都是图片的中心位置,如果是圆形的,那么改变中心点,如果是bar型的,那么改变的是它的增长点 */ void setMidpoint(const Point& point); /** Returns the Midpoint */ Point getMidpoint() const; /** * This allows the bar type to move the component at a specific rate * Set the component to 0 to make sure it stays at 100%. * For example you want a left to right bar but not have the height stay 100% * Set the rate to be Point(0,1); and set the midpoint to = Point(0,.5f); */ /**根据注释可知,BarChangeRate是设置进度条方向,如果是圆形的,好像不用设置,如果是bar型的,那么改变的是它的增减方向,例如Point(0,1)表示从下到上,Point(1,0)表示的是从左到右,(1,1)表示四周往中间,这些都是默认的midpoint,此时都是中心点,如果要从上到下,那么设置barchangerate为(0,1),设置midpoint为(0,0),从右到左亦然。 */ inline void setBarChangeRate(const Point& barChangeRate ) { _barChangeRate = barChangeRate; } /** Returns the BarChangeRate */ inline Point getBarChangeRate() const { return _barChangeRate; } virtual void draw(Renderer *renderer,const kmMat4 &transform,bool transformUpdated) override; virtual void setAnchorPoint(const Point& anchorPoint) override; virtual void setColor(const Color3B &color) override; virtual const Color3B& getColor() const override; virtual void setOpacity(GLubyte opacity) override; virtual GLubyte getOpacity() const override; CC_CONSTRUCTOR_ACCESS: /** * @js ctor */ ProgressTimer(); /** * @js NA * @lua NA */ virtual ~ProgressTimer(); /** Initializes a progress timer with the sprite as the shape the timer goes through */ bool initWithSprite(Sprite* sp); protected: void onDraw(const kmMat4 &transform,bool transformUpdated); Tex2F textureCoordFromAlphaPoint(Point alpha); Vertex2F vertexFromAlphaPoint(Point alpha); void updateProgress(void); void updateBar(void); void updateRadial(void); virtual void updateColor(void) override; Point boundaryTexCoord(char index); Type _type; Point _midpoint; Point _barChangeRate; float _percentage; Sprite *_sprite; int _vertexDataCount; V2F_C4B_T2F *_vertexData; CustomCommand _customCommand; bool _reverseDirection; private: CC_DISALLOW_COPY_AND_ASSIGN(ProgressTimer);}; 大致的参数也已经写完,然后分别来两种情况的例子: 从上到下bar类型 //time's background spritetime1=Sprite::create("biao1.png"); spritetime1->setAnchorPoint(Point(0,1)); spritetime1->setPosition(Point(WinRect::LeftBottom().x+5+10,WinRect::Top().y-3-10-3)); this->addChild(spritetime1,6); //time's value auto spritetime2=Sprite::create("biao2.png"); progress=ProgressTimer::create(spritetime2); progress->setAnchorPoint(Point(0,1)); progress->setType(cocos2d::ProgressTimer::Type::BAR); progress->setPosition(Point(WinRect::LeftBottom().x+6+10,WinRect::Top().y-3-13-3)); //set began Point progress->setMidpoint(Point(0,0)); progress->setBarChangeRate(Point(0,1)); progress->setPercentage(100);//value this->addChild(progress,7); //显示当前时间的label,可忽略 Myinterface::getInstance()->setTime(m_itime); auto str = __String::createWithFormat("%f",m_itime); numsTTF=Label::createWithSystemFont("0","Thonburi",24); numsTTF->setString(str->getCString()); numsTTF->setAnchorPoint(Point(0,1)); numsTTF->setPosition(Point(WinRect::LeftBottom().x+150,WinRect::Top().y-15-10)); numsTTF->setColor(Color3B::BLACK); this->addChild(numsTTF,8); numsTTF->setVisible(true);顺时针radial类型: Sprite*sprite; sprite=Sprite::createWithSpriteFrameName("black.png"); auto boomprogress=ProgressTimer::create(sprite); boomprogress->setTag(type); boomprogress->setType(cocos2d::ProgressTimer::Type::RADIAL); boomprogress->setAnchorPoint(Point(0.5,0.5)); boomprogress->setPosition(p); this->addChild(boomprogress,7); boomprogress->setReverseProgress(true); //action auto to = ProgressFromTo::create(10,100,0);//十秒内从100走到0 auto pCall_N = CallFuncN::create(CC_CALLBACK_1(gameScene::maskcallback,this));//走完之后来个回调函数,这里我是用来当做技能cd auto pSequeue = Sequence::create(to,pCall_N,NULL); boomprogress->runAction(pSequeue); (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |