CanTK支持Promise API
ChenLin edited this page Nov 19, 2015
·
1 revision
live demo: 几个常用API的Promise包装
-
- 基础动画函数
UIElement.prototype.animate = function(config, onAnimationDone, onAnimationStep, actionWhenBusy) {
var deferred = Deferred();
this.doAnimate(config, function() {
if(typeof onAnimationDone === 'function') {
onAnimationDone.apply(null, arguments);
}
deferred.resolve();
}, function() {
if(typeof onAnimationStep === 'function') {
return onAnimationStep.apply(null, arguments);
}
}, actionWhenBusy);
return deferred.promise;
}
调用示例:
var uiIcon = win.find("ui-icon-general");
var oldY = uiIcon.y;
uiIcon.animate({yEnd: oldY - 200, duration: 1000, interpolator: 'dec'}, animateOneDone, animateOneStep)
.then(function() {
return uiIcon.animate({yEnd: oldY, duration: 1000, interpolator: 'accelerate'}, animateTwoDone, animateTwoStep);
})
.then(function() {
console.debug('all animation play done');
})
.catch(function(err) {
console.debug('animation catch error') ;
});
-
- 骨骼动画播放函数
UISkeletonAnimation.prototype.play = function(animationName, repeatTimes, onDone, onOneCycle, useFadeIn, duration) {
var deferred = Deferred();
this.doPlay(animationName, repeatTimes, function() {
if(typeof onDone === 'function') {
onDone();
}
deferred.resolve();
}, function() {
if(typeof onOneCycle === 'function') {
onOneCycle();
}
}, useFadeIn, duration);
return deferred.promise;
};
调用示例:
//批量播放
Promise.all([uiDB2.play('run', 3, onPlayRunDone, onPlayRunStep), uiDB3.play('happy', 4, onPlayHappyDone, onPlayHappyStep)])
.then(function() {
console.debug('all animation play done');
})
.catch(function(err) {
});
//轮流播放
uiDB.play('run', 1, onRunPlayDone).then(function(data) {
return uiDB.play('happy', 1, onHappyPlayDone);
}).then(function() {
console.debug('play done');
}).catch(function(err) {
console.debug('catch Error');
});
-
- 帧动画
UIFrameAnimation.prototype.playSequence = function(sequence, repeatTimes, onDone, onOneCycle) {
this.deferred = Deferred();
var n = this.frames.length;
if(!n || !sequence || !sequence.length) {
return;
}
this.current = 0;
this.playing = true;
this.onDone = onDone;
this.onOneCycle = onOneCycle;
this.runningSequence = sequence;
this.nextUpdateTime = Date.now();
this.repeatTimes = repeatTimes ? repeatTimes : 0xFFFFFFFF;
return this.deferred.promise;
}
调用示例:
uiFrame.play('fire_1', 1)
.then(function() {
return uiFrame.play('fire_2', 1);
})
.then(function() {
return uiFrame.play('fire_1', 3);
})
.then(function() {
console.debug('frame animate play done');
})
.catch(function(err) {
console.debug('frame animate play catch error');
});
-
- 如果以上函数还不能满足你的需求,可以自行封装。
-
- 如果对
promise
本身不够了解可以来这里看看代码Promise 实现。
- 如果对
-
- 传送门: promise A+ spec