cocos2dx3.0进度条的简析
来源:互联网 发布:移动宽带送网络电视吗 编辑:程序博客网 时间:2024/05/12 00:42
可以说,进度条是游戏中特别常用的一个控件,大部分游戏都会需要用到资源加载条,技能道具的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);
1 0
- cocos2dx3.0进度条的简析
- cocos2dx3.0进度条的简析
- cocos2dx3.0 进度条
- Cocos2dx3.x + lua 进度条的使用
- cocos2dx3.0的代码风格
- cocos2dx3.0 随机数的获取
- cocos2dx3.0 DrawNode的使用
- cocos2dx3.0的项目属性继承 (vs2012)
- Cocos2dx3.0 帧事件的使用
- cocos2dx3.0的label字体去描边
- cocos2dx3.0的label字体去描边
- Cocos2dx3.0的自动批次渲染原理
- cocos2dx2.0 ----- cocos2dx3.0
- cocos2dx3.0备忘录
- cocos2dx3.0视频教程
- cocos2dx3.0 结构图
- cocos2dx3.0 对象池
- cocos2dx3.0 Ref
- MAC 安装cocoapods
- iPhone开发教程 UI基础课程(58课时)
- 可以写博客的感觉真好
- TCP和UDP的一些基础
- iOS开发之Objective-C与JavaScript的交互
- cocos2dx3.0进度条的简析
- HTML5 JS实现毛玻璃效果(高斯模糊)
- Android View系统解析(上)
- 什么是Node.js?(转)
- 励志贴
- windows上用libnfc的库函数编程
- 2014年终总结 --量变到质变,是一个过程!
- 如何关闭yum更新进程
- Download模块 (三)