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 条评论
登录 后参与评论

相关文章

来自专栏Jackie技术随笔

基本TCP套接口编程

为了执行网络I/O,一个进程(无论是服务端还是客户端)必须做的第一件事情就是调用socket函数。

3566
来自专栏PhpZendo

PHP 文件系统完全指南

今天我们将开启一个新的探索旅程,深入到 PHP 文件系统中,系统的学习和掌握 PHP 文件系统的基本使用。

1343
来自专栏码洞

天下无难试之HTTP协议面试刁难大全

小编是一个非典型面试官,对于HTTP协议的第一个问题,一般人会问常用的状态码有哪些。小编不这么问,小编的问题是HTTP的全称是什么,把英语给我说出来!

871
来自专栏游戏杂谈

Linux下使用rsync同步文件

遇到的问题是几台游戏服务器,有一台新的服务器之前已经copy(Linux的scp命令)过文件上去,但在测试的过程中发现还是图片无法正常不显示出来,然后用http...

2082
来自专栏编程

小白爬虫之爬虫快跑

使用多线程时好像在目录切换的问题上存在问题,可以给线程加个锁试试 Hello 大家好!我又来了。 你是不是发现下载图片速度特别慢、难以忍受啊!对于这种问题一般解...

1878
来自专栏平凡文摘

Java程序员最常用的Linux命令

1814
来自专栏王磊的博客

WebClient 访问间歇性返回403解决方案

说明:前段时间做的一个项目莫名的返回403的错误,这种情况也多大是程序员最不喜欢的了,没办法先来分析一下错误信息。之前的代码如下: WebClient webc...

44611
来自专栏blackpiglet

使用 pip 发布 Python 程序

写过 Python 程序的小伙伴们都知道,需要 import 个非 Python 自带的软件包时,都要用到 pip 这个程序。平时我们都是用 pip,如果我们写...

2192
来自专栏醒者呆

程序员必备课程——网络编程入门

关键字:互联网协议,网络分层,socket,TCP/IP协议,jdk源码,多线程,线程池,ExecutorService 本文的主要目的是面向程序员,所以...

5506
来自专栏惨绿少年

rsync 服务部署详解

第1章 rsync 软件介绍 1.1 什么是rsync rsync 是一款开源的、快速的、多功能的、可实现全量及增量的本地或远程数据同步备份的优秀工具。 ht...

4000

扫码关注云+社区