使用白鹭引擎遇到的一些问题以及一些工具分享

时间：2015-10-14 21:17:44 阅读：2837 评论：0 收藏：0 [点我收藏+]

标签：

用egret也有一段时间了，记录一下遇到的bug和流水账。

BUG类

1 Uncaught SecurityError: Failed to execute ‘getImageData‘ on ‘CanvasRenderingContext2D‘: The canvas has been tainted by cross-origin data.

egret 2.5 里面将WebImageLoader的crossOrigin默认值设置为anonymous就可以了

心得：

1 关闭列表的滚动：比较hack的做法

var skin = this.list.skin;
var scroller:egret.gui.Scroller = skin._elementsContent[0];
if( scroller != null)
    scroller.verticalScrollPolicy = "off";

2 监听列表的滚动事件:

这个找了很久

this.list.dataGroup.addEventListener(egret.gui.PropertyChangeEvent.PROPERTY_CHANGE,this.onListTouchEnd, this);

private onListTouchEnd(evt:egret.gui.PropertyChangeEvent){

            var newPos:number = evt.newValue;
            var referPos:number = this.list.dataGroup.scrollRect.bottom-this.list.dataGroup.height;
            if( evt.property == "verticalScrollPosition" && referPos - newPos <= 10){
                //todo dosomething
            }
        }

工具：

1 抽屉效果

原理： Tween + mask实现

例如对显示对象d实现抽屉效果：

var tw:egret.Tween = egret.Tween.get(this.d,{onChange:this.updateMask,onChangeObj:this},null,true);
this.maskForD = new egret.Rectangle(0,0,0,60);

private updateMask(){
    var showWidth:number;
    if( this.isLeft){
        showWidth = 420-(this.itemGroup.x-20);
    }else{
        showWidth = 420 - this.itemGroup.x;
    }
    this.maskForD.width = showWidth;
    this.d.mask = this.maskForItemGroup;
}

2 帧事件的管理

沿用as的习惯，全局只有一个帧事件。

/**
 * Created by DukeCrushIt on 2015/8/5.
 */
module game {
    export class FrameMgr extends egret.HashObject {
        public constructor() {
            super();
            this.items = [];
            this.itemMap = {};
        }
        public itemMap:Object;
        private items:FrameItem[];
        private stage:egret.Stage;
        public referTime:number;
        public initStage(stage:egret.Stage){
            this.stage = stage;
            this.stage.addEventListener(egret.Event.ENTER_FRAME,this.update, this);
            this.referTime = egret.getTimer();
        }

        public update(evt:egret.Event){
            var temp:number = egret.getTimer();
            var delta:number = temp - this.referTime;
            var len:number = this.items.length;
            var item:FrameItem;
            for(var idx = len-1; idx >= 0; idx--){
                item = this.items[idx];
                item.callFun.call(item.callObj,delta);
            }
            this.referTime = temp;
            Model.SYSTIME += delta;
        }

        public addControll(item:FrameItem){
            if( this.items.indexOf(item) == -1){
                this.items.push(item);
                this.itemMap[item.callObj.name] = item;
            }
        }

        public delController(name:string){
            if( this.items.length == 0 ) return;
            var item:FrameItem = this.itemMap[name];
            if( item != null && item != undefined){
                var idx:number = this.items.indexOf(item);
                if(idx != -1){
                    this.items.splice(idx,1);
                }
            }
            delete this.itemMap[name];
        }

        public isUnderControl(name:string):boolean{
            return this.itemMap[name] != undefined && this.itemMap[name] != null;
        }

        public pause(){
            this.stage.removeEventListener(egret.Event.ENTER_FRAME,this.update, this);
        }

        public resume(){
            this.referTime = egret.getTimer();
            this.stage.addEventListener(egret.Event.ENTER_FRAME,this.update, this);
        }

        private static _instance:FrameMgr;
        public static getInstance():FrameMgr{
            if( FrameMgr._instance == null)
                FrameMgr._instance = new game.FrameMgr();
            return FrameMgr._instance;
        }
    }
}

FrameMgr

配合这个使用：

/**
 * Created by DukeCrushIt on 2015/8/5.
 */
module game {
    export class FrameItem extends egret.HashObject {
        public callObj:any;
        public callFun:Function;
        public constructor() {
            super();
        }
    }
}

FrameItem

3 简单的位移补间

用自带的Tween效率不是很好，于是自己实现了一个，如下：

/**
 * Created by DukeCrushIt on 2015/8/5.
 */
module game{
    export class MoveMgr extends egret.HashObject{
        public name:string;
        public frameItem:FrameItem;
        public constructor(){
            super();
            this.items = [];
            this.name = "movemgr";
            this.frameItem = new game.FrameItem();
            this.frameItem.callObj = this;
            this.frameItem.callFun = this.update;
            FrameMgr.getInstance().addControll(this.frameItem);
        }
        private items:MoveItem[];
        private spareTime:number = 10;
        public update(deltaTime:number){
            if( this.items.length == 0) return;
            var itemLen:number = this.items.length - 1;
            var item:MoveItem;
            var startTime = egret.getTimer();
            var gap:number;
            for(var i = itemLen; i >= 0 ; i--){
                item = this.items[i];
                item.update(deltaTime);
                gap = egret.getTimer() - startTime;
                if( gap >= this.spareTime)
                    break;
            }
        }

        public addItem(item:MoveItem){
            if( this.items.indexOf(item) == -1){
                this.items.push(item);
            }
        }

        public delItem(item:MoveItem){
            var idx:number = this.items.indexOf(item);
            if( idx != -1){
                this.items.splice(idx, 1);
            }
            MoveMgr.reclaim(item);
        }

        public removeAllHairItems(){
            var len:number = this.items.length;
            var item:MoveItem;
            var disObj:egret.DisplayObject;
            for( var idx = len - 1; idx >=0 ; idx--){
                item = this.items[idx];
                disObj = item.disObject;
                if( disObj instanceof Hair){
                    item.finish();
                }
            }
        }

        public finish(){
            var itemLen:number = this.items.length - 1;
            if( itemLen == -1 ) return;
            var item:MoveItem;
            for(var i = itemLen; i >= 0 ; i--){
                item = this.items[i];
                item.finish();
            }
        }

        private static _cache:MoveItem[]=[];
        public static reclaim(item:MoveItem){
            if( MoveMgr._cache.indexOf(item) == -1)
                MoveMgr._cache.push(item);
        }
        public static produce():MoveItem{
            if(MoveMgr._cache.length!=0)
                return MoveMgr._cache.pop();
            return new MoveItem();
        }

        private static _instance:MoveMgr;
        public static getInstance():MoveMgr{
            if( MoveMgr._instance == null)
                MoveMgr._instance = new game.MoveMgr();
            return MoveMgr._instance;
        }
    }
}

MoveMgr

需要配合这个使用：

/**
 * Created by DukeCrushIt on 2015/8/5.
 */
module game{
    export class MoveItem extends egret.HashObject{
        public disObject:egret.DisplayObject;
        private gapX:number;
        private gapY:number;
        public targetX:number;
        public targetY:number;
        public duration:number;
        public past:number;
        private roll:boolean=false;
        public callBackObj:any;
        public callBackFun:Function;
        public constructor(){
            super();
        }
        public init(disObject:egret.DisplayObject,targetX:number,targetY:number,duration:number,cbObj:any=null,cbFun:Function=null,roll:boolean=false){
            this.disObject = disObject;
            this.targetX = targetX;
            this.gapX = targetX - disObject.x;
            this.targetY = targetY;
            this.gapY = targetY - disObject.y;
            this.duration = duration;
            this.past = 0;
            this.callBackObj = cbObj;
            this.callBackFun = cbFun;
            this.roll = roll;
        }

        public update(deltaTime:number){
            this.past += deltaTime;
            if( this.past < this.duration){
                var refer:number = deltaTime/this.duration;
                this.disObject.x += this.gapX*refer;
                this.disObject.y += this.gapY*refer;
                if( this.roll){
                    this.disObject.rotation += this.gapX > 0 ? 3 : -3;
                }
            }else{
                this.disObject.x = this.targetX;
                this.disObject.y = this.targetY;
                if( this.callBackObj!= null && this.callBackObj != null)
                    this.callBackFun.call(this.callBackObj);
                MoveMgr.getInstance().delItem(this);
            }
            if( this.disObject.parent == null){
                MoveMgr.getInstance().delItem(this);
            }
        }

        public finish(){
            if(this.disObject != null){
                this.disObject.x = this.targetX;
                this.disObject.y = this.targetY;
            }
            this.roll = false;
            MoveMgr.getInstance().delItem(this);
        }
    }
}

MoveItem

4 做了一个简单的重力系统，如下：

/**
 * Created by DukeCrushIt on 2015/7/30.
 */
module dukeutil{
    export class GravitySystem extends egret.HashObject {
        public gravity:number = 0.98;
        private items:GravityItem[] = [];
        private itemMap:Object = {};
        private frameItem:game.FrameItem;
        public name:string;
        public constructor(){
            super();
            this.name = "gravitysystem";
            this.frameItem = new game.FrameItem();
            this.frameItem.callFun = this.update;
            this.frameItem.callObj = this;
            game.FrameMgr.getInstance().addControll(this.frameItem);
        }

        public addItem(item:GravityItem){
            if( this.items.indexOf(item) == -1 ){
                this.items.push(item);
                this.itemMap[item.displayObject.name] = item;
            }
        }

        public contains(name:string):boolean{
            return this.itemMap[name] != undefined;
        }
        private spareTime:number = 10;
        private update(delata:number){
            var startTime = egret.getTimer();
            var gap:number;
            var len:number = this.items.length;
            var idx:number;
            var item:GravityItem;
            var displayObject:egret.DisplayObject;
            for(idx = len-1; idx >= 0; idx--){
                item = this.items[idx];
                displayObject = item.displayObject;
                if( item.phase == 0){
                    displayObject.x+=item.currentSpeedX;
                    item.currentSpeedY += this.gravity;
                    displayObject.y += item.currentSpeedY;
                    if( item.doublePhase && displayObject.y >= item.targetY){
                            item.phase = 1;
                            item.currentSpeedX = item.currentSpeedX*0.8;
                    }else if( !item.doublePhase && (item.currentSpeedY < 1 && item.currentSpeedY > -1)){
                        delete this.itemMap[item.displayObject.name];
                        this.items.splice(idx,1);
                        if( item.overCall != null && item.overCallObj != null)
                            item.overCall.call(item.overCallObj);
                        item.reset();
                        GravitySystem.reclaim(item);
                    }
                }else{
                    item.step++;
                    item.currentSpeedX = item.currentSpeedX*0.9;
                    displayObject.x+=item.currentSpeedX;

                    //if( item.currentSpeedX > 0){
                    //    displayObject.rotation+=2;
                    //}else{
                    //    displayObject.rotation-=2;
                    //}
                    if( item.step >= 30){
                        delete this.itemMap[item.displayObject.name];
                        this.items.splice(idx,1);
                        if( item.overCall != null && item.overCallObj != null)
                            item.overCall.call(item.overCallObj);
                        item.reset();
                        GravitySystem.reclaim(item);
                    }
                }
                if( displayObject.x <= 0 || displayObject.x >= game.GameConst.StageW){
                    item.currentSpeedX = -item.currentSpeedX;
                }
                gap = egret.getTimer() - startTime;
                if( gap >= this.spareTime)
                    break;
            }
        }

        private static _itemCache:GravityItem[] = [];
        public static produce():GravityItem{
            if( GravitySystem._itemCache.length != 0)
                return GravitySystem._itemCache.pop();
            return new GravityItem();
        }
        public static reclaim(item:GravityItem){
            if( GravitySystem._itemCache.indexOf(item) == -1)
                GravitySystem._itemCache.push(item);
        }

        private static _instance:GravitySystem;
        public static getInstance():GravitySystem{
            if( GravitySystem._instance == null )
                GravitySystem._instance = new dukeutil.GravitySystem();
            return GravitySystem._instance;
        }
    }
}

GravitySystem

配合使用的类：

/**
 * Created by DukeCrushIt on 2015/7/30.
 */
module dukeutil{
    export class GravityItem extends egret.HashObject{
        public phase:number=0;//0 gravity 1 roll to
        public doublePhase:boolean = true;
        public displayObject:egret.DisplayObject;
        public targetY:number;
        public currentSpeedX:number;
        public currentSpeedY:number;
        public step:number=0;
        public overCallObj:any;
        public overCall:Function;
        public constructor(){
            super();
        }
        public reset(){
            this.phase = 0;
            this.step = 0;
            this.doublePhase = true;
            this.overCall = null;
            this.overCallObj = null;
        }
    }
}

View Code

使用白鹭引擎遇到的一些问题以及一些工具分享

标签：

原文地址：http://www.cnblogs.com/adoontheway/p/4878418.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行