Commit 64764173 authored by Chen Jiping's avatar Chen Jiping

perf:增加动画

parent d9ae9c77
...@@ -260,7 +260,7 @@ cc.Class({ ...@@ -260,7 +260,7 @@ cc.Class({
showQuestionAudio() { showQuestionAudio() {
if(this._curExercise.hotZoneItemArr && this._curExercise.hotZoneItemArr.length > 0){ if (this._curExercise.hotZoneItemArr && this._curExercise.hotZoneItemArr.length > 0) {
playAudioByUrl(this._curExercise.hotZoneItemArr[0].audio_url); playAudioByUrl(this._curExercise.hotZoneItemArr[0].audio_url);
} }
...@@ -460,7 +460,7 @@ cc.Class({ ...@@ -460,7 +460,7 @@ cc.Class({
this.maskLayer.opacity = 0; this.maskLayer.opacity = 0;
this.maskLayer.active = true; this.maskLayer.active = true;
cc.tween(this.maskLayer) cc.tween(this.maskLayer)
.to(0.5, {opacity: 255}, {easing: 'sineOut'}) .to(0.5, { opacity: 255 }, { easing: 'sineOut' })
.call(() => { .call(() => {
cb() cb()
}) })
...@@ -470,7 +470,7 @@ cc.Class({ ...@@ -470,7 +470,7 @@ cc.Class({
hideMaskLayer(cb = null) { hideMaskLayer(cb = null) {
this.maskLayer.opacity = 255; this.maskLayer.opacity = 255;
cc.tween(this.maskLayer) cc.tween(this.maskLayer)
.to(0.5, {opacity: 0}, {easing: 'sineIn'}) .to(0.5, { opacity: 0 }, { easing: 'sineIn' })
.call(() => { .call(() => {
this.maskLayer.active = false; this.maskLayer.active = false;
if (cb) { if (cb) {
...@@ -485,19 +485,34 @@ cc.Class({ ...@@ -485,19 +485,34 @@ cc.Class({
const centerPart = cc.find('Canvas/stage/centerPart'); const centerPart = cc.find('Canvas/stage/centerPart');
centerPart.scale = this._mapScaleMin; centerPart.scale = this._mapScaleMin;
if (this._curExercise.frames && this._curExercise.frames.length > 1) { if (this._curExercise.frames) {
if (centerPart.pic) { if (centerPart.picArr) {
centerPart.pic.removeFromParent();
for (let i = 0; i < centerPart.picArr.length; ++i) {
centerPart.picArr[i].removeFromParent();
}
} }
console.log(this._curExercise.frames[0].picUrl);
this.getSprNodeByUrl(this._curExercise.frames[0].picUrl, (spr) => { centerPart.picArr = [];
this._curExercise.frames.forEach((frame, i) => {
this.getSprNodeByUrl(frame.picUrl, (spr) => {
spr.node.parent = centerPart; spr.node.parent = centerPart;
spr.node.scale = 1.0; spr.node.scale = 1.0;
spr.node.x = 0; spr.node.x = 0;
spr.node.y = 0; spr.node.y = 0;
centerPart.pic = spr.node; centerPart.picArr.push(spr.node);
//默认显示第一帧动画
if (i == 0) {
spr.node.active = true;
}
else {
spr.node.active = false;
}
let picMaxW = centerPart.width; let picMaxW = centerPart.width;
...@@ -505,7 +520,18 @@ cc.Class({ ...@@ -505,7 +520,18 @@ cc.Class({
setSprNodeMaxLen(spr.node, picMaxW, picMaxH); setSprNodeMaxLen(spr.node, picMaxW, picMaxH);
centerPart.bubbleArr = centerPart.bubbleArr || [];
});
});
if (centerPart.bubbleArr) {
centerPart.bubbleArr.forEach((bubble, i) => {
bubble.removeFromParent();
});
}
centerPart.bubbleArr = [];
for (let i = 0; i < this._curExercise.hotZoneItemArr.length; ++i) { for (let i = 0; i < this._curExercise.hotZoneItemArr.length; ++i) {
...@@ -519,22 +545,22 @@ cc.Class({ ...@@ -519,22 +545,22 @@ cc.Class({
let bubble_bg = cc.find('Canvas/stage/centerPart/bubble_bg'); let bubble_bg = cc.find('Canvas/stage/centerPart/bubble_bg');
bubbleSpr.node.parent =bubble_bg; bubbleSpr.node.parent = bubble_bg;
console.log(hotZoneItem.rect.x, hotZoneItem.rect.y); console.log(hotZoneItem.rect.x, hotZoneItem.rect.y);
let x = hotZoneItem.rect.x / hotZoneItem.mapScale; let x = hotZoneItem.rect.x / hotZoneItem.mapScale;
let y = hotZoneItem.rect.y / hotZoneItem.mapScale; let y = hotZoneItem.rect.y / hotZoneItem.mapScale;
if( x < bubble_bg.width / 2){ if (x < bubble_bg.width / 2) {
x = - ( bubble_bg.width / 2 - x); x = - (bubble_bg.width / 2 - x);
} }
else{ else {
x = x - bubble_bg.width / 2; x = x - bubble_bg.width / 2;
} }
if(y < bubble_bg.height / 2){ if (y < bubble_bg.height / 2) {
y = bubble_bg.height / 2 - y; y = bubble_bg.height / 2 - y;
} }
else{ else {
y = - (y - bubble_bg.height / 2); y = - (y - bubble_bg.height / 2);
} }
...@@ -552,13 +578,11 @@ cc.Class({ ...@@ -552,13 +578,11 @@ cc.Class({
}); });
cc.tween(bubbleSpr.node) cc.tween(bubbleSpr.node)
.to(0.7, {scale: 1}, {easing: 'cubicIn'}).call(()=>{ .to(0.7, { scale: 1 }, { easing: 'cubicIn' }).call(() => {
}).start(); }).start();
}); });
} }
});
} }
}, },
...@@ -652,7 +676,7 @@ cc.Class({ ...@@ -652,7 +676,7 @@ cc.Class({
this._cantouch = true; this._cantouch = true;
}, },
_answer_node : null, _answer_node: null,
getCircleArr(answers) { getCircleArr(answers) {
const circleArr = []; const circleArr = [];
...@@ -772,12 +796,17 @@ cc.Class({ ...@@ -772,12 +796,17 @@ cc.Class({
cc.tween(this._answer_node) cc.tween(this._answer_node)
.to(0.7, {scale: 0}, {easing: 'cubicIn'}) .to(0.7, { scale: 0 }, { easing: 'cubicIn' })
.call(() => { .call(() => {
this._answer_node.active = false; this._answer_node.active = false;
this._answer_node.scale = this._mapScaleMin; this._answer_node.scale = this._mapScaleMin;
this._cantouch = true; this._cantouch = true;
const centerPart = cc.find('Canvas/stage/centerPart');
//播放动画
this.animation(centerPart, centerPart.picArr, 0, 80);
}) })
.start(); .start();
}, },
...@@ -813,7 +842,61 @@ cc.Class({ ...@@ -813,7 +842,61 @@ cc.Class({
/**
* 播放序列针动画
* @param parItem
* @param arr 图片数组
* @param nextIndex 下一图片顺序
* @param intervalTime 间隔时间
*/
animation(parItem, arr, nextIndex , intervalTime ){
if(!parItem){
return;
}
if(!arr || arr.length == 0){
return;
}
let tNextIndex = nextIndex;
//如果相等,则表示一轮播放结束,将播放顺序重置为0
if(nextIndex == arr.length){
tNextIndex = 0;
}
//暂停动画
if(parItem.animationStop){
//隐藏上一张图
if(nextIndex > 0){
arr[nextIndex - 1].active = false;
}
else if(nextIndex == 0){
arr[nextIndex].active = false;
}
return;
}
//console.log('nextIndex', tNextIndex);
//隐藏上一张图
if(nextIndex > 0){
arr[nextIndex - 1].active = false;
}
arr[tNextIndex].active = true;
setTimeout(() => {
let nextIndex = tNextIndex + 1;
this.animation(parItem, arr, nextIndex, intervalTime);
}, intervalTime);
},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment