一个简单的技能冷却按钮的实现
- 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