class HelloTime extends egret.DisplayObjectContainer {
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
private spr: egret.Sprite; // 定义变量类型
private async onAddToStage(event: egret.Event) {
this.spr = new egret.Sprite();
// spr.graphics.beginFill(0xff0000);
// spr.graphics.drawRect(0, 0, 100, 100);
// spr.graphics.endFill();
// this.addChild(spr);
this.addChild(this.spr);
this.spr.width = 480;
this.spr.height = 800;
this.drawTxt();
this.drawContent();
/** --------------调用自己定义的class------------ */
// let _nCar: Card = new Card();
// this.addChild(_nCar);
// let _nAddView: AddView = new AddView();
// this.addChild(_nAddView);
// let _ManagerMent: ManagerMent = new ManagerMent();
// this.addChild(_ManagerMent);
// let _ChildrenObject: ChildrenObject = new ChildrenObject();
// this.addChild(_ChildrenObject);
// let _SimpleDate1: SimpleDate1 = new SimpleDate1();
// this.addChild(_SimpleDate1);
// let _TouchEventTest1: TouchEventTest1 = new TouchEventTest1();
// this.addChild(_TouchEventTest1);
// let _GraphicsTest: GraphicsTest = new GraphicsTest();
// this.addChild(_GraphicsTest);
// let _MayTest:MayTest = new MayTest();
// this.addChild(_MayTest);
// let _MyTweenAnim:MyTweenAnim = new MyTweenAnim()
// this.addChild(_MyTweenAnim);
// let _MyTimer1:MyTimer1 = new MyTimer1();
// this.addChild(_MyTimer1);
// let _MyBitMay1:MyBitMay1 = new MyBitMay1();
// this.addChild(_MyBitMay1);
let _MyBitMay2: MyBitMay2 = new MyBitMay2();
this.addChild(_MyBitMay2);
// let _MyPic: MyPic = new MyPic()
// this.addChild(_MyPic);
/** --------------调用自己定义的class------------ */
//加载图片
RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.onButtonComp, this);//3-5个参数
// RES.loadConfig('resource/default.res.json', 'resource/');
await RES.loadConfig("resource/default.res.json", "resource/");
RES.loadGroup('button1', 1); // 增加资源组
//填加定时器
this.timer = new egret.Timer(1000, 8);// 两个属性分别是 delay 与 repeatCount ,两个属性分别表示每次间隔的时间（以毫秒为单位）和执行的次数
this.timer.addEventListener(egret.TimerEvent.TIMER, this.timerFunc, this); // 定时器执行时 触发
this.timer.addEventListener(egret.TimerEvent.TIMER_COMPLETE, this.timerComFunc, this); //定时器 执行完成后 触发
}
private num: egret.TextField;
private n: number = 6;
private con: egret.TextField;
private timer: egret.Timer; // 声明计时器
private date: Date;
private drawTxt(): void {
this.num = new egret.TextField();
this.num.text = this.n.toString();
this.num.size = 100;
this.num.width = 480;
this.num.textColor = 0x00ff00;
this.num.textAlign = egret.HorizontalAlign.CENTER; // 样式居中
this.spr.addChild(this.num);
}
private drawContent(): void {
this.con = new egret.TextField();
this.con.text = '默默倒数六秒 迅速点击文字';
this.con.textColor = 0x00ff00;
this.con.width = 480;
this.con.textAlign = egret.HorizontalAlign.CENTER;
this.con.y = 120;
this.spr.addChild(this.con);
}
private img: egret.Bitmap;
private startTime: number;
private stopTime: number;
private finalTime: number;
private onButtonComp(): void {
this.img = new egret.Bitmap();
this.img.texture = RES.getRes('btn1');// 加载图片
let rect: egret.Rectangle = new egret.Rectangle(10, 10, 15, 15);
this.img.scale9Grid = rect;
this.img.y = 200;
this.img.x = 215;
this.img.width = 50;
this.img.height = 50;
this.spr.addChild(this.img);
this.img.touchEnabled = true;
this.img.addEventListener(egret.TouchEvent.TOUCH_TAP, this.onTouch, this);
}
private onTouch(evt: egret.TouchEvent) {
this.date = new Date();
this.startTime = this.date.getTime();
this.img.alpha = 0;
this.timer.start(); // 启动 停止 暂停
this.drawTxt();
this.spr.touchEnabled = true;
this.spr.addEventListener(egret.TouchEvent.TOUCH_TAP, this.onToucnSRP, this, true);
}
private timerFunc() {
if (this.n <= 3) {
this.num.text = '?';
} else {
this.spr.removeChildren();
this.drawTxt();
}
this.n--;
}
private timerComFunc() {
if (this.n <= -2) {
this.drawContent();
this.con.text = '别迷糊了快醒醒';
this.spr.removeEventListener(egret.TouchEvent.TOUCH_TAP, this.onToucnSRP, this, true);
}
}
private onToucnSRP(event: egret.TouchEvent) {
this.date = new Date();
this.stopTime = this.date.getTime();
this.finalTime = this.startTime - this.stopTime;
this.num.text = (this.finalTime / 1000 + 6).toFixed(3);
this.timer.stop();
this.drawContent();// 重新绘制
this.spr.removeEventListener(egret.TouchEvent.TOUCH_TAP, this.onToucnSRP, this, true);
switch (Math.floor(Math.abs(this.finalTime / 1000 + 6))) {
case 0:
this.con.text = '很专注';
break;
case 1:
this.con.text = '一般专注';
break;
case 2:
this.con.text = '不专注';
break;
}
}
}
class Card extends egret.Sprite {
public constructor() {
super();
this.drawCard();
}
private drawCard() {
this.graphics.beginFill(0x0000ff);
this.graphics.drawRect(190, 300, 50, 50);
this.graphics.drawRect(240, 350, 50, 50);
this.graphics.beginFill(0xff0000);
this.graphics.drawRect(240, 300, 50, 50);
this.graphics.drawRect(190, 350, 50, 50);
this.graphics.endFill();
}
}
// class AddView extends egret.DisplayObjectContainer{
class AddView extends egret.Sprite {
public constructor() {
super();
this.onAddTostage();
}
private onAddTostage() {
let spr: egret.Sprite = new egret.Sprite();
spr.graphics.beginFill(0xff0000);
spr.graphics.drawRect(215, 420, 50, 50);
spr.graphics.endFill();
//该对象以存在
this.addChild(spr);
// this.removeChild(spr);// 删除对象
// 该对象 保存于内存中
let spr1: egret.Sprite = new egret.Sprite();
spr1.graphics.beginFill(0x00ff00);
spr1.graphics.drawRect(215, 420, 25, 25);
spr1.y = 10;
spr1.x = 10;
this.addChild(spr1);
spr.addChild(spr1);
console.log(this.numChildren);
}
}
//深度值
class ManagerMent extends egret.DisplayObjectContainer {
public constructor() {
super();
this.onAddToStage();
}
private onAddToStage() {
let spr: egret.Sprite = new egret.Sprite();
spr.graphics.beginFill(0xff0000);
spr.graphics.drawRect(0, 0, 50, 50);
spr.graphics.endFill();
spr.x = 215;
spr.y = 480;
this.addChild(spr);
//深度值 z--测序
console.log(this.numChildren);
let spr1: egret.Sprite = new egret.Sprite();
spr1.graphics.beginFill(0x00ff00);
spr1.graphics.drawRect(0, 0, 50, 50);
spr1.graphics.endFill();
spr1.x = 215;
spr1.y = 540;
this.addChild(spr1);
console.log(this.numChildren);
let sprcon: egret.Sprite = new egret.Sprite();
this.addChild(sprcon);
sprcon.x = 10;
for (let i: number = 0; i < 4; i++) {
let spr: egret.Sprite = new egret.Sprite();
spr.graphics.beginFill(0xffffff * Math.random());
spr.graphics.drawRect(0, 0, 40, 20);
spr.graphics.endFill();
spr.x = i * 20;
spr.y = 600;
sprcon.addChild(spr);
}
let sprNew1: egret.Sprite = new egret.Sprite();
sprNew1.graphics.beginFill(0xff0000);
sprNew1.graphics.drawRect(0, 0, 40, 30);
sprNew1.graphics.endFill();
sprNew1.x = 10;
sprNew1.y = 600;
// sprcon.addChild(sprNew1);
sprcon.addChildAt(sprNew1, 1); // 按照下标插入
//修改指定下标 内的深度
sprcon.swapChildrenAt(1, 3); //修改指定下标 内的深度
//修改 深度
sprcon.setChildIndex(sprNew1, 4);
}
}
//获取子对象 通过深度值
class ChildrenObject extends egret.DisplayObjectContainer {
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
private onAddToStage(event: egret.Event) {
let spr: egret.Sprite = new egret.Sprite();
this.addChild(spr);
let spr1: egret.Sprite = new egret.Sprite();
spr1.graphics.beginFill(0x00ff00);
spr1.graphics.drawRect(0, 0, 100, 100);
spr1.graphics.endFill();
spr1.x = 50;
spr1.name = 'hello';
spr.addChild(spr1);
let _spr: egret.DisplayObject = spr.getChildAt(0);// 比较快
// let _spr: egret.DisplayObject = spr.getChildByName('hello');// 性能低
_spr.scaleX = 0.5;
}
}
// 7. 事件机制原理及流程
class SimpleDate1 extends egret.DisplayObjectContainer {
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
private onAddToStage(event: egret.Event) {
//创建一个男
let boy1: Boy = new Boy();
boy1.name = 'tong';
let girl1: Girl = new Girl();
girl1.name = 'xiao xue';
// 注册监听事件 第四个参数是冒泡 ，最后一个参数是优先级 数字越大越优先处理
boy1.addEventListener(DataEvent.DATE, girl1.getDate, girl1, false, 10);
//检测监听器
if (boy1.hasEventListener(DataEvent.DATE)) {
console.log('已经注册');
}
// 邀请函数
boy1.order();
// 移除监听器
boy1.removeEventListener(DataEvent.DATE, girl1.getDate, girl1);
if (!boy1.hasEventListener(DataEvent.DATE)) {
console.log('未注册');
}
}
}
//8. 事件类
class DataEvent extends egret.Event {
public static DATE: string = '约会';
public _year: number = 0;
public _month: number = 0;
public _date: number = 0;
public _where: string = '';
public _todo: string = '';
//type: string 事件类型
// bulles: boolean = false :指定是否参与冒泡阶段
// cancelable: boolean = false : 是否取消掉事件的 event 事件
public constructor(type: string, bulles: boolean = false, cancelable: boolean = false) {
super(type, bulles, cancelable);
}
}
class Boy extends egret.Sprite {
public constructor() {
super();
}
public order() {
let daterEvent: DataEvent = new DataEvent(DataEvent.DATE);
daterEvent._year = 2018;
daterEvent._month = 7;
daterEvent._date = 21;
daterEvent._where = '家里';
daterEvent._todo = '学习';
//发送请求事件
this.dispatchEvent(daterEvent);
}
}
class Girl extends egret.Sprite {
public constructor() {
super();
}
public getDate(event: DataEvent): void {
console.log('收到了:' + event.target.name + '的邀请');
console.log('希望在:' + event.target._year + '年' + event.target._month + '月' + event.target._date + '日' + event.target._where + event.target._todo);
}
}
//9. 事件实例 填加事件 案例
class TouchEventTest1 extends egret.DisplayObjectContainer {
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
public spr: egret.Sprite; // 定义变量类型
private onAddToStage(event: egret.Event) {
this.drawText();
this.spr = new egret.Sprite();
this.spr.graphics.beginFill(0x465112);
this.spr.graphics.drawRect(0, 0, 50, 50);
this.spr.graphics.endFill();
this.spr.x = 100;
this.spr.y = 100;
this.addChild(this.spr);
// this.drawContent();
this.spr.touchEnabled = true;//开启点击
this.spr.addEventListener(egret.TouchEvent.TOUCH_TAP, this.onTouch, this);
}
private onTouch(event: egret.Event): void {
this.txt.text = '点击了小方块';
}
//绘制文本
private txt: egret.TextField;
private drawText(): void {
this.txt = new egret.TextField();
this.txt.text = '点击';
this.txt.width = 200;
this.txt.height = 200;
this.txt.size = 12;
this.txt.textColor = 0x00ff00;
this.txt.textAlign = egret.HorizontalAlign.CENTER;
this.txt.x = 100;
this.txt.y = 100;
this.addChild(this.txt);
}
}
//10. 绘图
class GraphicsTest extends egret.DisplayObjectContainer {
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
private onAddToStage(event: egret.Event) {
let shp: egret.Shape = new egret.Shape();
shp.graphics.beginFill(0x123212, 0.8); //可设置透明度
shp.graphics.lineStyle(10, 0x455333);
shp.graphics.drawRect(150, 150, 50, 50); //绘制矩形
// shp.graphics.drawCircle(0, 0, 50);// 绘制圆形
shp.graphics.endFill();
this.addChild(shp);
this.drawLine();
this.drawCurve();
}
//lineStyle 设置当前区域的外边框
// 绘制直线
private drawLine(): void {
let shp1: egret.Shape = new egret.Shape();
shp1.graphics.lineStyle(1, 0x00ff00);
shp1.graphics.moveTo(0, 0);//起点
shp1.graphics.lineTo(50, 50);//终点
shp1.graphics.lineTo(30, 25);//终点
shp1.graphics.lineTo(10, 55);//终点
shp1.graphics.lineTo(11, 55);//终点
shp1.graphics.lineTo(99, 0);//终点
shp1.graphics.endFill();
this.addChild(shp1);
}
// 曲线的形成
private drawCurve(): void {
let shp2: egret.Shape = new egret.Shape();
shp2.graphics.lineStyle(3, 0x00ff00);
shp2.graphics.moveTo(100, 100);//起点
shp2.graphics.curveTo(200, 200, 400, 50);// 曲线的形成
shp2.graphics.endFill();
this.addChild(shp2);
}
}
//11.文本
class MayTest extends egret.DisplayObjectContainer {
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
private onAddToStage(event: egret.Event) {
let laber: egret.TextField = new egret.TextField();
laber.text = '这是一个文本域';
laber.textColor = 0x000000;
laber.width = 400;//设置宽度
// laber.height=100;//设置高度
// laber.fontFamily='KaiTi';//字体
this.addChild(laber);
console.log(laber.width + ':' + laber.height);
//文字的布局
laber.textAlign = egret.HorizontalAlign.RIGHT;
//设置ziti
laber.bold = true; //粗体 等等
laber.italic = true;//斜体 等等
}
}
//12. 动画
//01.MovieClip 序列帧动画 影片剪辑
class MyTweenAnim extends egret.DisplayObjectContainer {
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
private onAddToStage(event: egret.Event) {
let shp: egret.Shape = new egret.Shape();
shp.graphics.beginFill(0x00ff00);
shp.graphics.drawRect(0, 0, 100, 100);
shp.graphics.endFill();
this.addChild(shp);
//动画处理 类 egret.Tween
let tweeen = egret.Tween.get(shp);
tweeen.to({
x: 300,//x坐标
y: 300 //y 坐标
}, 2000);
}
}
//13 计时器
class MyTimer1 extends egret.DisplayObjectContainer {
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
/**
* 2个属性 delay, repeatCount
* 3个方法 start, reset, stop
* 2个事件 TimerEvent.TIMER, TimerEvent.TIMER_COMPLETE
*/
private onAddToStage(event: egret.Event) {
let timer: egret.Timer = new egret.Timer(1000, 5);//间隔1000 执行5次
//注册监听事件
timer.addEventListener(egret.TimerEvent.TIMER, this.timerFunc, this);
timer.addEventListener(egret.TimerEvent.TIMER_COMPLETE, this.timerComFunc, this);
timer.start();
// timer.stop();
}
private timerFunc() {
console.log('计时开始')
}
private timerComFunc() {
console.log('计时结束')
}
}
// 14.位图纹理
class MyBitMay1 extends egret.DisplayObjectContainer {
public constructor() {
super()
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
private onAddToStage(event: egret.Event) {
//完成 预加载
RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.configEvent, this);
// 预加载
// RES.addEventListener(RES.ResourceEvent.GROUP_PROGRESS,this.addImage,this);
RES.loadConfig('resource/default.res.json', 'resource/');// 具体路径 补充
}
private configEvent(event: egret.Event) {
RES.removeEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.configEvent, this);
RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.addImage, this);
RES.loadGroup('button');
}
private addImage() {
let img1: egret.Bitmap = new egret.Bitmap();
img1.texture = RES.getRes('btn1');//获取资源 同步获取资源
this.addChild(img1);//设置优先级
}
/**获取资源
* getRes() 同步获取
* getResAsync() 从缓存加载 如果没有则通过网络获取
* getResByUrl() 网络获取
*/
}
//资源 加载
//资源加载模块 RES 模块是一套完善的资源加载模块
//资源加载配置 可以配置资源组
//15.九宫格的使用
class MyPic extends egret.DisplayObjectContainer {
public constructor() {
super();
// this.addEventListener(egret.Event.ADDED_TO_STAGE,this.onAddToStage,this);
}
// private async onAddToStage(event:egret.Event){
// RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE,this.addImage,this);
// await RES.loadConfig('resource/assets/toolt.png','resource/')
// await RES.loadGroup('toolt2');
// }
private addImage() {
// let img:egret.Bitmap = new egret.Bitmap();
// img.texture = RES.getRes("toolt");
// this.addChild(img);
// img.x = 150;
// let img1:egret.Bitmap = new egret.Bitmap();
// img1.texture = RES.getRes("toolt");
// //使用九宫格
// let rect:egret.Rectangle = new egret.Rectangle(30,31,40,41);
// img1.scale9Grid = rect;
// // img1.height *= 2;
// console.log(img1.width);
// console.log(img1.height);
// img1.x = 50;
// img1.y = 200;
// this.addChild(img1);
}
}
// 14.位图纹理
class MyBitMay2 extends egret.DisplayObjectContainer {
public constructor() {
console.log('MyBitMay23');
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
private onAddToStage(event: egret.Event) {
RES.addEventListener(RES.ResourceEvent.GROUP_PROGRESS, this.addImage, this);
try {
const loadingView = new LoadingUI();
this.stage.addChild(loadingView);
RES.loadConfig("resource/default.res.json", "resource/");
RES.loadGroup("preload", 0, loadingView);
this.stage.removeChild(loadingView);
}
catch (e) {
console.error(e);
}
}
private addImage() {
console.log('MyBitMay2');
let img1: egret.Bitmap = new egret.Bitmap();
img1.texture = RES.getRes('description_json');//获取资源 同步获取资源
img1.fillMode = egret.BitmapFillMode.REPEAT;
this.addChild(img1);//设置优先级
}
/**获取资源
* getRes() 同步获取
* getResAsync() 从缓存加载 如果没有则通过网络获取
* getResByUrl() 网络获取
*/
}
// 使用雪碧图
class MyMaps extends egret.DisplayObjectContainer {
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
private onAddToStage(event: egret.Event) {
RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.addImg, this);
RES.loadConfig("resource/default.res.json", "resource/");
RES.loadGroup("lg");//倒入 纹理集生成的 .json
}
private addImg() {
let imgs: egret.SpriteSheet = RES.getRes("logo");//引入需要的img部分
let img: egret.Bitmap = new egret.Bitmap();
img.texture = imgs.getTexture("toolt");
this.addChild(img);
}
}
