cocos2d-js 3.0 rc2 自定义UI控件组件 例子:能播放动画的MenuItem。MenuItemSprite的bug

其实总体自定义UI组件都比较简单,尤其是cocos2d-js是开源的,如果有什么不明白的直接看js代码或者C++代码即可。当然js代码基本就够了。

另外,js的ctor函数虽然说是构造函数,但毕竟不是flash或者c++的构造函数,这只是一个普通函数,也就是说可以不在第一行默认调用,这就给扩展带来了不少方便。

现在想做一个声音按钮,点一下能关闭音乐,再点一下又能打开。当然就是MenuItemToggle了。

但想做得再炫一点,有声音的时候,按钮的样子能有几个音波的变化。那么就需要用MenuItemSprite,尝试自己做一个自定义的Sprite。不过,过程中发现这个MenuItemSprite有不少坑,大家需要注意(详细看代码)。(补充:以下代码只适用于html5版本,后来发现jsb版本对MenuItemSprite的初始化更严格一些,不能为null)

var SoundButton = cc.MenuItemToggle.extend({

    ctor:function(){
        var sprite = new cc.Sprite("#soundOn0000.png");     //先设置默认图片,否则鼠标响应有问题
        var animation = new cc.Animation();
        animation.addSpriteFrame(cc.spriteFrameCache.getSpriteFrame("soundOn0000.png"));
        animation.addSpriteFrame(cc.spriteFrameCache.getSpriteFrame("soundOn0001.png"));
        animation.addSpriteFrame(cc.spriteFrameCache.getSpriteFrame("soundOn0002.png"));
        animation.setDelayPerUnit(1/3);
        var action = cc.animate(animation).repeatForever();
        sprite.runAction(action);

        this._super(new cc.MenuItemSprite(sprite, null, null), new cc.MenuItemImage("#soundOff.png"));  //MenuItemSprite有bug,必须设置3个参数才能用,跟MenuItemImage不一样
        this.setCallback(this._soundOnOff, this);   //这样可以设置callback的target
    },

    _soundOnOff:function() {
        Sound.toggleOnOff();
    }
});

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏逍遥剑客的游戏开发

从Native到Web(六), emscripten学习笔记: SDL游戏移植尝试

1313
来自专栏企鹅号快讯

python环境的安装

所谓"工欲善其事,必先利其器",首先我们就要来安装一下python环境,和一款python IDE:pycharm,由于本人用的windows系统,在这里只介绍...

1856
来自专栏杨建荣的学习笔记

数据库日常运维中的几个操作建议(r9笔记第33天)

如果你去看其他DBA的操作的时候,如果要判断他们水平的高低,我想就是通过一些操作的差别来看了,而水平高低就体现于此。细节决定成败,越是看起来简单的操作越...

2663
来自专栏实用工具入门教程

如何部署邮件服务

邮件服务器是一种应用程序,它使我们能够以电子邮件的形式在组织的不同用户之间或在其外部发送消息,而不依赖于他们所连接的网络。我们将在邮件服务器中使用的基本术语是:...

1012
来自专栏ChaMd5安全团队

记一次phpcms漏洞利用到获得服务器过程分享

记一次phpcms漏洞利用到获得服务器 by lshc 随着最近phpcms V9 任意上传和注入poc的流出,在圈内又掀起了一阵漏洞利用浪潮,想到之...

4366
来自专栏前端人人

React多页面应用9(webpack4 引入eslint代码检查)

本教程总共9篇,每日更新一篇,请关注我们!你可以进入历史消息查看以往文章,也敬请期待我们的新文章! 1、React多页面应用1(webpack4 开发环境搭建,...

7408
来自专栏Crossin的编程教室

把你开发的网站免费发布到互联网上(2)

前几天,我们介绍了通过 PythonAnywhere 在互联网上创建一个站点: 把你开发的网站免费发布到互联网上(1) 本篇是上一篇的延续,来讲一讲如何将已有的...

2939
来自专栏JAVA同学会

初试spring-session

  它将取代容器中的HttpSession。在没有容器会话集群方案的情况下,使得支持会话集群微不足道。

602
来自专栏数据和云

深入内核:监听器的工作原理与故障诊断分析

熊军(老熊) 云和恩墨西区总经理 Oracle ACED,ACOUG核心会员 在Oracle的官方文档《Oracle Database PerformanceT...

3547
来自专栏一只程序汪的自我修养

使用requirejs编写模块化代码

1465

扫码关注云+社区