Egret

Egret萌新

Egret萌新
之前一直都不知道怎么编辑Egret项目，只会新建一个项目，然后输出的永远都是Egret的默认的页面（PS：我用的引擎版本是3.0.8），今天第一次参考白鹭开发的小白文档编写出了一个EgretEUI项目文件，制作过程如下：

1. 创建一个EUI项目，给项目取个名字，然后点击创建。
2. 打开所创建的项目，找到src文件下面的Main.ts文件，删除该文件。
3. 在src文件夹下新建两个TypeScript文件，一个命名为Card，另一个命名为Main。
4. 敲代码，Card.ts文件的代码如下：
   class Card extends egret.Sprite{
   public constructor(){
   super();
   this.drawCard();
   }
   private drawCard(){
   this.graphics.beginFill(0x0000ff);
   this.graphics.drawRect(0,0,50,50);
   this.graphics.drawRect(50,50,50,50);
   this.graphics.beginFill(0xff0000);
   this.graphics.drawRect(0,50,50,50);
   this.graphics.drawRect(50,0,50,50);
   this.graphics.endFill();
   }
   }
5. Main.ts文件代码如下所示：
   class Main extends egret.DisplayObjectContainer{
   public constructor(){
   super();
   this.addEventListener(egret.Event.ADDED_TO_STAGE,this.onAddToStage,this);
   }
   private onAddToStage(event:egret.Event){
   var _myCard=new Card();
   this.addChild(_myCard);
   }
   }
6. 编译运行，选择“项目”-“构建”进行编译，编译结束后，选择"项目"-“调试”调试项目。
7. 运行结果如下图所示：