cocos2d-js通用弹出界面类

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/zhenyu5211314/article/details/85330390

制作一个通用弹出界面类，用于制作弹出动画，退出动画等

///通用弹出式界面，背景透明，附带弹出动画。
LayoutConfig.NormalBaseLayer = cc.Layer.extend({
    _exit_target: null,
    _exit_func: null,
    _layout: null,
    _UI_LAYOUT_JSON: null,
    _is_enter: false,
    _is_exit: false,
    _show_mask: true,
    ctor: function(json, hideMask) {
        this._super();
        this._UI_LAYOUT_JSON = json;
        this._show_mask = !hideMask;
        this._exit_func = this.normalExit;
        cc.associateWithNative(this, cc.Layer);
    },

    onEnter: function() {
        this._super();
    },

    onExit: function() {
        this._layout = null;
        this.unscheduleAllCallbacks();
        g_textureCache.removeUnusedTextures();
        g_DataModel.cancelRegisterRequestByTarget(this);

        this._super();
    },

    init: function() {
        var bRet = false;
        if(this._super() && !this._layout) {
            if(this._show_mask) LayoutConfig.attachMask(this, 0, 0, true);
            this._layout = LayoutConfig.createBaseLayer(this._UI_LAYOUT_JSON, false);
            this.addChild(this._layout, 1, 1);
            this.enterAnimation();
            bRet = true;
        }

        UIAudio.openUI();
        return bRet;
    },

    enterAnimationBegin: function() {
        this._is_enter = true;
    },

    enterAnimation: function() {
        if(this._is_enter) {
            return;
        }
        this.enterAnimationBegin();
        LayoutConfig.layerCommonScaleAnimation(this._layout, this.enterAnimationEnd, this);
    },

    enterAnimationEnd: function() {
        this._is_enter = false;
    },

    exitAnimationBegin: function() {
        this._is_exit = true;
    },

    exitAnimationEnd: function() {
        this._is_exit = false;
    },


    setExitCallBack: function(target, callback) {
        this._exit_target = target;
        this._exit_func = callback;
    },

    exitLayer: function() {
        if(this._is_exit) {
            return;
        }
        this.exitAnimationBegin();
        LayoutConfig.layerCommonScaleHideAnimation(this._layout, function() {
            this.exitAnimationEnd();
            if(this._exit_func) {
                Controller.callFunc(this._exit_func, this._exit_target);
            } else {
                this.removeFromParent();
            }
        }, this);

    },

    normalExit: function() {
        this.removeFromParent();
    },

});

通用弹入动画：

LayoutConfig.layerCommonScaleAnimation = function(layer, func, target) {
    layer.setScale(0.0);
    layer.setVisible(true);
    var seq = cc.Sequence.create(
        cc.ScaleTo.create(0.2, 1.1),
        cc.ScaleTo.create(0.1, 1.0),
        cc.CallFunc.create(function() {
            Controller.callFunc(func, target);
        }, this)
    );
    layer.runAction(seq);
};

通用弹出动画：

LayoutConfig.layerCommonScaleHideAnimation = function(layer, func, target) {
    layer.setScale(1.0);
    layer.setVisible(true);
    var seq = cc.Sequence.create(
        cc.ScaleTo.create(0.1, 1.1),
        cc.ScaleTo.create(0.2, 0.1),
        cc.Hide.create(),
        cc.DelayTime.create(0.05),
        cc.CallFunc.create(function() {
            Controller.callFunc(func, target);
        }, this)
    );
    layer.runAction(seq);
};

新建弹出界面：

var ShopBuyDialog5 = LayoutConfig.NormalBaseLayer.extend({
    _enter_target:null,
    _enter_callback:null,
    _cost:null,
    ctor: function (des,cost,exitT,exitCB,enterT,enterCB) {
        this._super("ShopBuyDialog5", false);
        this.setData(des,cost);
        this.init();
        this.setExitCallBack(exitT,exitCB);
        this.setEnterCallBack(enterT,enterCB);
    },

    onEnter: function () {
        this._super();
    },

    onExit: function () {
        this._super();
    },

    init: function () {
        if (this._super()) {
            this.initLayoutConfig();
        }
    },

    setData:function(des,cost){
        this._des = des;
        this._cost= cost ? cost :0;
    },

    enterAnimationBeg:function(){
        this._super();
        this._layout.setVisible(false);
    },

    enterAnimationEnd:function(){
        this._super();
        this._layout.setVisible(true);
    },

    exitAnimationBegin:function(){
        this._super();
    },

    initLayoutConfig:function(){

    },

    setEnterCallBack:function(enterT,enterCB){
        this._enter_target = enterT;
        this._enter_callback =enterCB;
    }

});