设计开发

CocosCreator TypeScript项目引用第三方库的方法和问题记录

TypeScript对于习惯强类型语言(比如Unity C#)而又要写JavaScript项目(比如CocosCreator Egret)的程序员来说,确实提供了很大方便,而且对于一些由于弱类型语言导致的只能运行时检查的低级错误,使用TS都能很好的避免。

这次要记录的是使用TypeScript作为主开发语言的CocosCreator项目中引用第三方库的方法和问题,实测的是MessagePackprotobufjs和Photon这几个库。

继续阅读…

CocosCreator 2.0的cc.eventManager弃用换新API记录

Cocos Creator升级2.0以后发现原来写的一些代码开始报弃用警告了,今天有空学习下新API并更新下原来的代码,之前写的实现监听touch起动停事件的代码是这样写的:

    // use this for initialization
    onLoad: function () {
        let self = this;

        cc.eventManager.addListener({
            event: cc.EventListener.TOUCH_ONE_BY_ONE,

            onTouchBegan: function (touch, event) {
                // x = touch.getLocation().x
                // y = touch.getLocation().y

                return true;
            },
            onTouchMoved: function (touch, event) {
                // x = touch.getLocation().x
                // y = touch.getLocation().y

                return true;
            },
            onTouchEnded: function (touch, event) {
                const x = touch.getLocation().x;
                const y = touch.getLocation().y;
                const cp = self.dragonPlayer.getPosition();
                NetworkManager.instance.getNetPhoton().sendMyPost(cp.x, cp.y, x, y);
                const dist = cc.v2(x, y).sub(cp).mag();
                self.dragonPlayer.stopAllActions();
                self.dragonPlayer.runAction(cc.moveTo(dist / 80, x, y));
                return true;
            }
        }, self.node);
    },
继续阅读…

关于Javascript中类成员函数中内嵌函数的this闭包问题

之前写CocosLua和CocosJS时经常会遇到类成员函数中调用内嵌函数时的this传递问题,最近发现Javascript中可以通过使用箭头函数简化这个this的闭包问题,先给出测试代码:

class clsTest {
  constructor(var1) {
    this._var1 = var1;
  }

  foo() {
    console.log("1111", this._var1);

    (() => {
      console.log("2222", this._var1);
    })();

    (function() {
      console.log("3333", this);
    })();

    let self = this;
    (function() {
      console.log("4444", self._var1);
    })();
  }
}

let objTest = new clsTest(10);
objTest.foo();

JSFiddle:https://jsfiddle.net/u0yconbg/2/

为了简化示例代码,内嵌函数都写成了自调用的形式,可见333时的内嵌函数调用this是undefined,所以4444时在调用函数前声明了self用于闭包进内嵌函数访问this,(Lua中一般是local this = self),而2222的内嵌函数是通过箭头方式声明的,可见log中成功输出了clsTest类对象的_var1成员变量值,也就是说this被自动传递了,为此特意查了下文档:

An arrow function expression has a shorter syntax than a function expression and does not have its own this, arguments, super, or new.target. These function expressions are best suited for non-method functions, and they cannot be used as constructors.

来自:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

屏蔽Cesium的默认双击追踪选中entity行为

Cesium中,默认会对场景中添加的entity进行双击追踪效果(类似Unity中的选中物体后按F),参考

Remove default double click behavior in Cesiumhttp://webiks.com/remove-default-double-click-behavior-in-cesium/

这篇文章中介绍的方法后,发现所谓的”less intrusive way”并不好用,双击选中后的摄像机移动逻辑还是触发了,于是最终采用了第一种解决方法:

viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);

实测在1.48版中可以达到效果,另外伴随这个默认双击追踪实体行为的,还有个默认的选中指示框,这个可以通过在new Cesium.Viewer的时候指定selectionIndicator: false来关闭,如下:

var viewer = new Cesium.Viewer('cesiumContainer', {
        'timeline': false,
        'animation': false,
        'homeButton': false,
        'geocoder': false,
        'fullscreenButton': false,
        'searchButton': false,
        'scene3DOnly': false,
        'terrainShadows': Cesium.ShadowMode.DISABLED,
        'navigationHelpButton': false,
        'selectionIndicator': false,
        'sceneModePicker': false,
        'infoBox': false,
        'baseLayerPicker': false,
        'shadows': false,
});

Python 3.6 32bit在Win下安装pycrypto的方法(VS 2017)

在测试一个python操作AES加密解密的脚本时,发现需要安装一些依赖package,大部分直接pip install就搞定了,结果到pycrypto的时候,却遇到了pip报错安装失败的问题,仔细看了下发现是编译出错,搜索了下找到了这个:https://github.com/dlitz/pycrypto/issues/218,原来是需要VS Build Tools环境的问题,按照最后的提示(指定32位编译环境):

for Python 3.6 32 bit following set of commands worked:

cd “C:\Program Files (x86)\Microsoft Visual Studio\2017\Community\VC\Auxiliary\Build”
vcvarsall.bat x86_amd64
cd \
set CL=-FI”%VCINSTALLDIR%\tools\msvc\14.14.26428\include\stdint.h”
pip install pycrypto

执行后,提示:
继续阅读…

Unity中将Animation Clip嵌入Animator Controller的方法

最近再研究Unity的UI动效果,过程中发现一个小细节:在使用UGUI的Button时,如果设置Transition过渡方式为Animation动画,并通过Auto Generate Animation自动生成Animator Controller及四个按钮状态对应的Animation时,会发现生成的Asset资源是这样

和其他FBX动画等一样,动画Animation Clip是直接嵌入Controller的,而当实现一些如UI弹出动画之类的效果时,也使用Animator,自己手动创建Controller后,却没有可视化的直接在创建内嵌Clip以及State的方法,只能创建State然后关联Clip,或者先创建Clip,再拖入Controller自动生成关联State,最后Asset里会是这样:

看着明显不如Button自动生成的那种要整洁!
继续阅读…

Cocos2d-JS HTML5的cc.audioEngine音乐音效在iOS设备上不响应静音键的问题

之前写过一篇同样关于Cocos2d-JS H5的音频播放相关的文章: DOMException: play() can only be initiated by a user gesture(Cocos2d-JS HTML5),其中提到了移动端上H5的声音播放需要在用户操作后且必须在操作后一定时间内的问题,这次记录的问题也与此问题有关,直接现象为Cocos2d-JS(我用的3.13 lite版,通过js-builder获取:http://www.cocos2d-x.org/filecenter/jsbuilder,本文所描述问题可能仅与此版本相关!)的H5游戏在iOS设备上播放的音乐音效不受静音键影响,无法根据静音键静音!
做过iOS音频相关原生开发的应该知道,iOS通过对AVAudioSession的Category设置来决定应用的音频播放所属的分类,从而决定是否受静音键的影响,比如,静音开关开启的时候,短信音,Push消息提示音之类的会不播放,但优酷视频,虾米音乐之类的应用的音频还是会播放,不受影响,具体参考如下:

会话类型 说明 是否要求输入 是否要求输出 是否遵从静音键
AVAudioSessionCategoryAmbient 混音播放,可以与其他音频应用同时播放
AVAudioSessionCategorySoloAmbient 独占播放
AVAudioSessionCategoryPlayback 后台播放,独占
AVAudioSessionCategoryRecord 录音模式
AVAudioSessionCategoryPlayAndRecord 播放和录音,此时可以录音也可以播放
AVAudioSessionCategoryAudioProcessing 硬件解码音频,此时不能播放和录制
AVAudioSessionCategoryMultiRoute 多种输入输出,例如可以耳机、USB设备同时播放

 

继续阅读…

DOMException: play() can only be initiated by a user gesture(Cocos2d-JS HTML5)

Cocos2d-x目前一直在力推Cocos Creator,流程上Creator和Unity已经很像了(再来个编辑器状态可视化运行就完美了),其实Cocos还有一个纯JS版:http://www.cocos2d-x.org/filecenter/jsbuilder,而且还是可以自助选择所需组件的,最精简版是可以只有几百k的单js文件,使用此版本引擎的应用开发流程和Creator前的Cocos一样,代码为主!所以个人认为更适合做一些简单的小游戏或移植原有C++ Lua Obj-C项目。
由于对H5游戏开发接触的不多,大部分认知还停留在早期的canvas 2d状态,简单试了下这个纯JS版本,发现目前webgl的绘图效率已经可以在移动端和PC端(最新chrome)均达到很不错的效果了。不过这次要记录的问题和图形方面没关系,而是和声音有关,具体一点说是通过cc.audioEngine.playMusic播放游戏背景音乐产生的问题,错误现象直接写在标题中了。
其实在遇到标题中的错误之前还有一个问题,也算是关联问题,即H5游戏在移动端上不能以js代码形式主动触发音乐的播放,必须在用户操作后才可以播放,这个百度一下就可以查到,一开始在PC端还是按照原来做游戏的逻辑,loading完后splash,然后main menu直接播放bgm,PC浏览器下一切正常,但到了移动端却发现bgm根本没有播放,于是直接根据百度到的资料将初始bgm改为用户点击后才播放,本以为这样就可以了,但是后来又遇到了标题的问题,具体触发代码如下:
继续阅读…

Egret白鹭使用Photon第三方库后manifest.json不更新的问题

Egret版本:5.1.4,Photon JS/TS SDK版本:Photon-Javascript-Sdk_v4-0-0-6
按照白鹭第三方模块的引用方法(网上查到的方法版本很多2.x 3.x 4.x的都有,且各不相同,好不容易找到了5.x的最新方法):
在非白鹭项目位置创建lib项目,命令行执行:

egret create_lib Photon

生成的lib项目夹子内至少应该有:package.json tsconfig.json这两个文件,按照官方最新文档的配置:http://developer.egret.com/cn/2d/projectConfig/libraryProject
最终lib项目文件夹结构应该如下:
继续阅读…

使用Android Studio 3.0+调试任意环境生成的APK中的Java和Native C/C++代码(APK调试debug)

自从Google抛弃Eclipse ADT转投IntelliJ IDEA搞出Android Studio后,Android的开发调试环境可以说是日臻完善,先是Android Studio 2.x加入了调试原生C/C++代码的功能,一解Android NDK开发调试不方便之困(想当年可是拜ndk开发调试所赐才熟练掌握了gdb命令行的各种操作…),现在的3.x又加入了直接调试任意apk中Java和native .so的功能:

测试了下,虽然过程中遇到了个小问题,不过最终还是成功了,基本能和AS开发的带C++ Support项目原生调试体验一致。下面记录下这个”小问题“的解决方法:
先说明下这个小问题是用AS调试任意apk中的.so时找不到调试符号,且无法定位到源码并命中断点的问题,也就是说是有源码调试!无源码调试理论上应该也可以,但不在本次研究范围之内。
继续阅读…