egret小结及小例子

作者：zccst

知识目录：
1，对象
2，显示容器
3，事件Event及其继承类
4，定时器


5，动画Tween和MovieClip

private demoMovieClip(){
        var data = RES.getRes("stay_json");//JSON
        var texture:egret.Texture = RES.getRes("stay_png");//Texture
        var mc:egret.MovieClip = new egret.MovieClip(data, texture);
        this.addChild(mc);
        mc.frameRate = 50;//每秒帧序列次数
        mc.gotoAndPlay("stay");

        var data2 = RES.getRes("weizhu_json");//JSON
        var texture2:egret.Texture = RES.getRes("weizhu_png");//Texture
        var mc2:egret.MovieClip = new egret.MovieClip(data2, texture2);
        this.addChild(mc2);
        mc2.y = 120;
        mc2.frameRate = 20;//每秒帧序列次数
        mc2.gotoAndPlay("weizhu");//Uncaught Error: [Fatal]MovieClip没有对应的frame：:weizhuwww
    }

    private demoTween(){
        //自定义
        var txtDesc:egret.TextField = new egret.TextField();
        txtDesc.text = "测试";
        txtDesc.x = 0;
        txtDesc.y = 0;
        this.addChild(txtDesc);
        var tw = egret.Tween.get(txtDesc);
        tw.to({x:(this.stage.width-60),y:(this.stage.height-30)},3000);
    }

6，声音

//静态播放的三种形式：
    private _anny:egret.Sound;
    private demoSound(result:any){
        //第一种：直接播放
        //console.log(result);
        //result.play();

        //第二种：先创建一个对象，对该对象的audio赋值
        this._anny = new egret.Sound();
        this._anny.audio = result;
        this._anny.play();

        //希望重复播放（第一种方式）
        this._anny.addEventListener("ended", this.rePlay.bind(this));
        //希望重复播放（第二种方式，直接在play(true) ）
    }
    private rePlay(){
        this._anny.load();
        this._anny.play();
    }

7，网络
对网络的详细解读详见：http://zccst.iteye.com/blog/2107182

class Net extends egret.DisplayObjectContainer{
    public constructor(){
        super();
        this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
    }

    private urlloader:egret.URLLoader;
    private onAddToStage(event:egret.Event){
        this.urlloader = new egret.URLLoader();
        this.urlloader.dataFormat = egret.URLLoaderDataFormat.VARIABLES;
        var urlreq:egret.URLRequest = new egret.URLRequest();
        //urlreq.url = "http://httpbin.org/user-agent";
        urlreq.url = "http://httpbin.org/headers";
        this.urlloader.load(urlreq);
        this.urlloader.addEventListener(egret.Event.COMPLETE, this.onComplete, this);
    }

    private onComplete(event:egret.Event):void{
        console.log(this.urlloader.data);

    }

}

环境搭建：
安装nodejs（node -v, npm）
安装webstorm（较好的支持typescript）
安装HTTP服务器（自带，或XMAPP）
安装chrome
安装egret（cd egret-core, npm intall -g）
检查egret是否安装成功（egret）


创建工作区。例如，D:\egret\code
创建项目：egret create HelloWorld
编译项目： egret build HelloWorld
运行项目： egret startserver HelloWorld
http://localhost:3000/HelloWorld/launcher/index.html
发布项目： egret publish HelloWorld
对源代码混淆加密，最终将js压缩为game-min.js，
将launcher和resource上传至服务器，发布完成
如有任何代码改动，再次： egret build HelloWorld




打飞机实例分析：

游戏资源载入
包括的对象：
背景图
开始按钮
我的飞机（1个）
我的子弹（多个）
敌机    （多个）
敌机子弹（多个）
碰撞（需要消失的子弹、敌机，游戏结束判断）
结束记分画面



我的飞机是new出来的：
this.myFighter = new fighter.Airplane(RES.getRes("f1"),100);//然后设置了创建子弹的监听事件

敌机是设置一个定时器，然后调用produce生成出来的：
var enemyFighter:fighter.Airplane = fighter.Airplane.produce("f2",1000);//然后设置了创建子弹的监听事件

getTimer()是从egret开始运行开始计时的
bullet.y -= 12*speedOffset;//我的子弹是从下往上走
if(bullet.y<-bullet.height)//如果走出，则移除
    delArr.push(bullet);





碰撞检测的两种方式：

1，检测点
13         var shp:egret.Shape = new egret.Shape();
14         shp.graphics.beginFill( 0xff0000 );
15         shp.graphics.drawRect( 0,0,100,100);
16         shp.graphics.endFill();
17         shp.width = 100;
18         shp.height = 100;
19         this.addChild( shp );
20
21         var isHit:boolean = shp.hitTestPoint( 10, 10 );
22         this.infoText.text = "碰撞结果" + isHit;



2，检测矩形
var rect1:egret.Rectangle = obj1.getBounds();//获取显示对象的测量边界
var rect2:egret.Rectangle = obj2.getBounds();
rect1.x = obj1.x;
rect1.y = obj1.y;
rect2.x = obj2.x;
rect2.y = obj2.y;
//此方法检查指定的 Rectangle 对象的 x、y、width 和 height 属性，以查看它是否与此 Rectangle 对象相交。
return rect1.intersects(rect2);







Android APP打包方案 Windows

创建工作目录D:\Labs
第一部分、安装Android开发环境
1，安装Java7
2，Android NDK  adt-bundle-windows-x86_64-20140624_and_ndk_r9d.zip
解压，关联ndk到eclipse

第二部分、安装Egret游戏框架
D:\Labs>cd egret-core
D:\Labs\egret-core>npm install -g
安装Egret的Android支持包（下载，放置在“labs/egret-support/”）

第三部分、创建一个Android打包示例
D:\Labs\projects> egret create ACoolHtmlGame
D:\Labs\projects>egret create_app ACoolAndroidGame -f ACoolHtmlGame -t ..\egret-support\egret-android-support




如果您觉得本文的内容对您的学习有所帮助，您可以微信：

评论

1 楼 zc5510670 2015-10-22  

非常不错