文字跑马灯实现过程
主要使用egret.Event.ENTER_FRAME
监听文本,在motionNotice函数内通过判文字宽度是否到尾部再回滚到-900;
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
| private mainMarquee:eui.Label; private marquees(): void { this.mainMarquee = new eui.Label(); this.addChildAt(this.mainMarquee, 30); this.mainMarquee.y = 25; this.mainMarquee.x = 91; this.mainMarquee.height = 50; this.mainMarquee.textColor = 0xe7be80; this.mainMarquee.fontFamily = "Verdana"; this.mainMarquee.verticalAlign = "middle"; this.mainMarquee.text = "egret(白鹭引擎)实现跑马灯效果egret(白鹭引擎)实现跑马灯效果egret(白鹭引擎)实现跑马灯效果"; this.mainMarquee.size = 20; this.mainMarquee.scrollRect = new egret.Rectangle(0, 0, 900, this.mainMarquee.height); this.addEventListener(egret.Event.ENTER_FRAME, this.motionNotice, this); }
private motionNotice(e: egret.Event): void { this.mainMarquee.scrollRect.x++; if (this.mainMarquee.scrollRect.x >= this.mainMarquee.textWidth) { this.mainMarquee.scrollRect.x = -900; } this.mainMarquee.scrollRect = this.mainMarquee.scrollRect; }
|
如果需要一个滚动的背景也是可以相同的方式添加的
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
| private addGB():void{ this.bgBitmap = new egret.Bitmap(RES.getRes("catrbg_png")); this.addChild(this.bgBitmap); this.bgBitmap.y = 0; this.bgBitmap.x = 0; this.bgBitmap.scrollRect = new egret.Rectangle(0, 0, 640, this.bgBitmap.height); this.addEventListener(egret.Event.ENTER_FRAME, this.bgNotices, this); } private bgBitmap: egret.Bitmap; private bgNotices(e: egret.Event): void { this.bgBitmap.scrollRect.x++; if (this.bgBitmap.scrollRect.x >= this.bgBitmap.width) { this.bgBitmap.scrollRect.x = -640; } this.bgBitmap.scrollRect = this.bgBitmap.scrollRect; }
|