记录一下旋转的原理,使用计时器来移动坐标,或者改为按帧移动也可。
代码里的对象或其他接口,能看得懂就行,就不贴上来了。
效果:
private _circleCenter = {x: 279, y: 229};//中心,订半径
private _aPos = {x: 155, y: 80};//椭圆度(x越大,横向偏移越大)
private _eff1: UIEffect;
private _eff2: UIEffect;
private _angle: number = 0;
private _speedTime: number = 20;//速度(多少时间毫秒执行一次位置移动)
private _speedPos: number = 3;//速度(一个时间单位内执行多少角度的位置移动)
/**展示绕圈特效*/
private showBallsEff(){
//第一个物品
this._eff1 = EffectManager.getInstance().showEffect(UrlUtil.getCommonEffectURL("lymarkeff"),0, 0, this.g_actEff, 40, true);
//第二个物品
this._eff2 = EffectManager.getInstance().showEffect(UrlUtil.getCommonEffectURL("lymarkeff"),0, 0, this.g_actEff, 40, true);
//如果还没有计时器,添加一个
if (!(TimerManager.getInstance().has(this._speedTime, this.showCircle, this))){
TimerManager.getInstance().add(this._speedTime, this.showCircle, this);
}
}
/**展示绕圈 计算角度*/
private showCircle(){
let a = this;
a._angle += a._speedPos;
if(a._angle >= 360){
a._angle = 0;
}
let pos = a._angle * Math.PI / 180;
let pos2 = (180 + a._angle) * Math.PI / 180;
a._eff1.x = Math.ceil(a._aPos.x * Math.cos(pos) + a._circleCenter.x);
a._eff1.y = Math.ceil(a._aPos.y * Math.sin(pos) + a._circleCenter.y);
a._eff2.x = Math.ceil(a._aPos.x * Math.cos(pos2) + a._circleCenter.x);
a._eff2.y = Math.ceil(a._aPos.y * Math.sin(pos2) + a._circleCenter.y);
//当旋转到中心图片后面时候切换层次
if(a._angle > 200 && a._angle < 340){
if(a.g_actEff.getChildIndex(a._eff1.content) != 0){
a.g_actEff.setChildIndex(a._eff1.content, 0);
}
if(a.g_actEff.getChildIndex(a._eff2.content) != a.g_actEff.numChildren){
a.g_actEff.setChildIndex(a._eff2.content, a.g_actEff.numChildren);
}
}
else{
if(a.g_actEff.getChildIndex(a._eff2.content) != 0){
a.g_actEff.setChildIndex(a._eff2.content, 0);
}
if(a.g_actEff.getChildIndex(a._eff1.content) != a.g_actEff.numChildren){
a.g_actEff.setChildIndex(a._eff1.content, a.g_actEff.numChildren);
}
}
// console.log(pos, a._eff1.x, a._eff1.y,"-------------", a._angle, a.g_actEff.getChildIndex(a.img_mainRing), a.g_actEff.getChildIndex(this._eff1.content));
}