最近在用白鹭引擎弄一个分页卡用于关卡选择
废话不多说 直接贴代码
class Sectionselect extends BaseView implements eui.UIComponent {
public touchlayer: eui.Group;
public startbtn: eui.Button;
private centeridx: number = 1;
private touchposx: number = 0;
//private touchposy: number = 0;
//private moveaccx = 0;
private centerscale: number = 1.4;
private cellwidth: number = 720;
private maxsecid: number = 1;
private _beginPosArr: any = {};
public constructor() {
super();
this.skinName = "SectionselectSkin";
}
public awake(...param: any[]) {
let self = this;
self.startbtn.addEventListener(egret.TouchEvent.TOUCH_TAP, this.onstartbtnClick, this);
BtnTool.btnSMin(self.startbtn);
self.touchlayer.addEventListener(egret.TouchEvent.TOUCH_BEGIN, this.ontouchBegin, this, true);
//self.touchlayer.addEventListener(egret.TouchEvent.TOUCH_MOVE, this.ontouchMove, this);
self.touchlayer.addEventListener(egret.TouchEvent.TOUCH_END, this.ontouchEnd, this, true);
//self.touchlayer.addEventListener(egret.TouchEvent.TOUCH_CANCEL, this.ontouchCancel, this);
self.touchlayer.addEventListener(egret.TouchEvent.TOUCH_TAP, this.ontouchTap, this, true);
self.touchlayer.addEventListener(egret.TouchEvent.TOUCH_RELEASE_OUTSIDE, this.ontouchoutside, this, true);
self.initSections();
}
public start(...param: any[]) {
let self = this;
self.maxsecid = App.UserConfig.getunlocksecid();
for(let i = 0; i < self.touchlayer.numChildren; i++) {
let item: SectionOne = <SectionOne>self.touchlayer.getChildAt(i);
item.x = self.cellwidth/2 + ( i+1 - self.maxsecid )* self.cellwidth;
item.y = 380;
//item.secgroup.scaleX = ( i+1 == self.maxsecid ? self.centerscale: 1);
//item.secgroup.scaleY = ( i+1 == self.maxsecid ? self.centerscale: 1);
//console.log( self.maxsecid, item.secgroup.scaleX, item.secgroup.scaleY, item.x , self.cellwidth, self.touchlayer.width );
item.initsection(i);
this._beginPosArr[i] = { x: self.cellwidth/2 + ( i+1 - self.maxsecid )* self.cellwidth, y: 380 };
}
self.centeridx = self.maxsecid;
}
private initSections():void {
let self = this;
let secnum = App.GameConfig.sections.length;
for(let i = 0; i < secnum; i++) {
let secone : SectionOne = new SectionOne();
self.touchlayer.addChild( secone );
secone.anchorOffsetX = secone.width/2;
secone.anchorOffsetY = secone.height/2;
}
}
private onstartbtnClick(event: egret.Event): void {
let self = this;
//console.log( "onstartbtnClick............................." );
App.UIManager.open("QingQiuZhiYuan", false, App.GameScene.getLayer(UILayer.LAYER_UI), false, self.centeridx);
}
// private getmovescale(distance: number): number {
// let self = this;
// let delta = Math.abs( distance - self.cellwidth/2 );
// if(delta <= self.cellwidth) {
// return self.centerscale - (self.centerscale - 1)*delta/self.cellwidth;
// }
// else {
// return 1;
// }
// }
private ontouchBegin(event: egret.TouchEvent): void {
//console.log( "SectionOne begin............................." );
event.preventDefault();
let self = this;
self.touchposx = event.stageX;
//self.touchposy = event.stageY;
//self.moveaccx = 0;
self.touchlayer.addEventListener(egret.TouchEvent.TOUCH_MOVE, this.ontouchMove, this);
//self.touchlayer.addEventListener(egret.TouchEvent.TOUCH_END, this.ontouchEnd, this);
}
private ontouchMove(event: egret.TouchEvent): void {
let self = this;
//console.log( "SectionOne move............................." );
let deltax = event.stageX - self.touchposx;
for(let i = 0; i < self.touchlayer.numChildren; i++) {
let item: SectionOne = <SectionOne>self.touchlayer.getChildAt(i);
item.x = self._beginPosArr[i].x + deltax;
// let sc = self.getmovescale(item.x);
// // if(i == 1)
// // console.log("scale x ", sc);
// item.secgroup.scaleX = sc;
// item.secgroup.scaleY = sc;
}
event.stopImmediatePropagation();
}
// private onslideend() {
// let self = this;
// let offset = 0;
// let movenum = Math.round( self.moveaccx / self.cellwidth );
// let finalx = movenum * self.cellwidth;
// let deltax = finalx - self.moveaccx;
// for(let i = 0; i < self.touchlayer.numChildren; i++) {
// let item: SectionOne = <SectionOne>self.touchlayer.getChildAt(i);
// let sc = self.getmovescale( item.x + deltax );
// let v = 1800;
// let mvtime = Math.abs( deltax/v ) * 1000;
// console.log("movenum:%d deltax:%d sc:%d mvtime:%d", movenum, deltax, sc, mvtime);
// egret.Tween.removeTweens(item);
// egret.Tween.get(item, { loop: false }).to({ "x": item.x + deltax, "scaleX": sc, "scaleY": sc }, mvtime, egret.Ease.cubicInOut ).call(() => {
// self.centeridx += movenum;
// self.startbtn.visible = (self.centeridx >= self.maxsecid);
// });
// }
// }
private ontouchEnd(event: egret.TouchEvent): void {
let self = this;
let offset = event.stageX - self.touchposx;
if (Math.abs(offset) < self.cellwidth / 10 ) {
//console.log("bound 1111111111111111111111");
self.boundAnimate();
event.stopImmediatePropagation();
self.touchlayer.removeEventListener(egret.TouchEvent.TOUCH_MOVE, this.ontouchMove, this);
}
else {
if (offset < 0) { //向左或向上 index+
if ( self.centeridx == self.touchlayer.numChildren ) {
//console.log("bound");
this.boundAnimate();
} else {
//console.log("slide 1");
this.slideAnimate(1);
}
}
else { //向右或向下 index--
if ( self.centeridx == 1 ) {
//console.log("bound");
this.boundAnimate();
} else {
//console.log("slide -1");
this.slideAnimate(-1);
}
}
event.stopImmediatePropagation();
self.touchlayer.removeEventListener(egret.TouchEvent.TOUCH_MOVE, this.ontouchMove, this);
}
//console.log( "SectionOne end............................." );
}
private slideAnimate(direction) {
let self = this;
self.touchlayer.touchEnabled = false;
let count = 0; //计数
for(let i = 0; i < self.touchlayer.numChildren; i++) {
let item: SectionOne = <SectionOne>self.touchlayer.getChildAt(i);
let finalX = this._beginPosArr[i].x;
egret.Tween.removeTweens(item);
egret.Tween.get(item).to({ x: finalX - direction * self.cellwidth }, 150, egret.Ease.sineOut).call(() => {
count++;
if (count == self.touchlayer.numChildren) { //只运行一次
this.centeridx += direction;
// this.refresh();
this.touchlayer.touchEnabled = true;
self.startbtn.visible = (this.centeridx <= self.maxsecid);
}
this._beginPosArr[i].x = finalX - direction * self.cellwidth;
// if(this.slideCallback)
// {
// this.slideCallback();
// }
});
}
}
private boundAnimate() {
let self = this;
self.touchlayer.touchEnabled = false;
for(let i = 0; i < self.touchlayer.numChildren; i++) {
let item: SectionOne = <SectionOne>self.touchlayer.getChildAt(i);
let finalX = this._beginPosArr[i].x;
egret.Tween.removeTweens(item);
egret.Tween.get(item).to({ x: finalX }, 150, egret.Ease.sineInOut).call(() => {
this.touchlayer.touchEnabled = true;
if (i == self.touchlayer.numChildren - 1) { //只运行一次
this.reset();
}
});
}
}
//重置页面偏移位置
private reset() {
let self = this;
for(let i = 0; i < self.touchlayer.numChildren; i++) {
let item: SectionOne = <SectionOne>self.touchlayer.getChildAt(i);
item.x = self.cellwidth/2 + ( i+1 - self.centeridx )* self.cellwidth;
}
}
// private ontouchCancel(event: egret.TouchEvent): void {
// let self = this;
// //console.log( "SectionOne cancel............................." );
// }
private ontouchTap(event: egret.TouchEvent): void {
let self = this;
let offset = 0;
offset = event.stageX - this.touchposx;
if (Math.abs(offset) != 0) {
event.stopImmediatePropagation();
}
//console.log( "SectionOne touchtap............................." );
}
private ontouchoutside(event: egret.TouchEvent): void {
let self = this;
self.touchlayer.removeEventListener(egret.TouchEvent.TOUCH_MOVE, this.ontouchMove, this);
self.refresh();
//console.log( "SectionOne ontouchoutside............................." );
}
//重绘数据
private refresh() {
let self = this;
for(let i = 0; i < self.touchlayer.numChildren; i++) {
let item: SectionOne = <SectionOne>self.touchlayer.getChildAt(i);
item.x = self.cellwidth/2 + ( i+1 - self.centeridx )* self.cellwidth;
}
}
}
window['Sectionselect'] = Sectionselect;
本文暂时没有评论，来添加一个吧(●'◡'●)