Cocos2d-js 3.2 技能冷却按钮的简单实现

一个简单的技能冷却按钮的实现

 var CoolButton = cc.Node.extend({   // 需要做成Node 否则会无法addchild
     callback : null,    // 点击后的回调
     coolInterval : null,    // 动画时间
     progressCooling : null, // 进度条
     sprNormal : null,
     sprStencil : null,
     menuBtn : null,
     ctor : function(resNormal, resPressed, resStencil, coolInterval, callback) {
         this._super();

         this.callback = callback;
         this.coolInterval = coolInterval;

         // menu item
         var btnItem = new cc.MenuItemImage(
                 resNormal,
                 resPressed,
                 this.onBtnClick,
                 this);

         // menu 默认在画面中间
         this.menuBtn = new cc.Menu(btnItem);
         this.menuBtn.attr({
             x : 0,
             y : 0
         });
         this.addChild(this.menuBtn, 0);

         // 图片覆盖在按钮上  造成无法点击的假象
         this.sprNormal = new cc.Sprite(resNormal);
         this.sprNormal.attr({
             x : 0,
             y : 0
         });
         this.addChild(this.sprNormal, 1);
         this.sprStencil = new cc.Sprite(resStencil);
         this.sprStencil.attr({
             x : 0,
             y : 0
         });
         this.addChild(this.sprStencil, 2);


         this.progressCooling = new cc.ProgressTimer(this.sprNormal);
         this.progressCooling.setType(cc.ProgressTimer.TYPE_RADIAL);
         this.progressCooling.setPercentage(0);  // 回复到0
         this.progressCooling.attr({
             x : 0,
             y : 0
         });
         this.addChild(this.progressCooling, 5);

         this.progressCooling.setVisible(false);
         this.sprNormal.setVisible(false);
         this.sprStencil.setVisible(false);
     },
     onBtnClick : function() {
         // 设置按钮不可按
         this.menuBtn.setVisible(false);
         // 开始倒计时
         this.progressCooling.setVisible(true);
         this.sprNormal.setVisible(true);
         this.sprStencil.setVisible(true);
         this.progressCooling.runAction(cc.sequence(cc.progressTo(this.coolInterval, 100),
                 cc.callFunc(this.coolEndCallback, this)));

         // 调用回调
         this.runAction(cc.callFunc(this.callback, this));
     },
     coolEndCallback : function() {
         this.menuBtn.setVisible(true);

         this.progressCooling.setVisible(false);
         this.progressCooling.setPercentage(0);  // 回复到0
         this.sprNormal.setVisible(false);
         this.sprStencil.setVisible(false);
     }
 });

调用示例：

 var btn = new CoolButton(res.SkillNormal_png, res.SkillPressed_png, res.SkillStencil_png,
                 4, this.skill);

源引：http://blog.csdn.net/a102111/article/details/43637697