javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-17 21:01:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #788 from NativeScript/issue-759

Browse Source 
Fixed: Android animations that animate a property to its current valu…
This commit is contained in:
Rossen Hristov
2015-09-21 11:03:00 +03:00
parent 6b9a476a7c 15eb5d29c8
commit bd44627e24
2 changed files with 230 additions and 211 deletions
Download Patch File Download Diff File Expand all files Collapse all files

127
apps/tests/ui/animation/animation-tests.ts
View File

@ -99,7 +99,7 @@ export var test_CancellingAnimation = function (done) {
animation1.cancel(); animation1.cancel();
// ``` // ```
// </snippet> // </snippet>
} }
export var test_ChainingAnimations = function (done) { export var test_ChainingAnimations = function (done) {
var mainPage: pageModule.Page; var mainPage: pageModule.Page;
@ -145,53 +145,53 @@ export var test_ChainingAnimations = function (done) {
// </snippet> // </snippet>
} }
export var test_ReusingAnimations = function (done) { //export var test_ReusingAnimations = function (done) {
var mainPage: pageModule.Page; // var mainPage: pageModule.Page;
var label: labelModule.Label; // var label: labelModule.Label;
var pageFactory = function (): pageModule.Page { // var pageFactory = function (): pageModule.Page {
label = new labelModule.Label(); // label = new labelModule.Label();
label.text = "label"; // label.text = "label";
var stackLayout = new stackLayoutModule.StackLayout(); // var stackLayout = new stackLayoutModule.StackLayout();
stackLayout.addChild(label); // stackLayout.addChild(label);
mainPage = new pageModule.Page(); // mainPage = new pageModule.Page();
mainPage.content = stackLayout; // mainPage.content = stackLayout;
return mainPage; // return mainPage;
}; // };
helper.navigate(pageFactory); // helper.navigate(pageFactory);
TKUnit.waitUntilReady(() => { return label.isLoaded }); // TKUnit.waitUntilReady(() => { return label.isLoaded });
// <snippet module="ui/animation" title="animation"> // // <snippet module="ui/animation" title="animation">
// # Reusing animations // // # Reusing animations
// ``` JavaScript // // ``` JavaScript
var animation1 = label.createAnimation({ translate: { x: 100, y: 100 } }); // var animation1 = label.createAnimation({ translate: { x: 100, y: 100 } });
var animation2 = label.createAnimation({ translate: { x: 0, y: 0 } }); // var animation2 = label.createAnimation({ translate: { x: 0, y: 0 } });
animation1.play().finished // animation1.play().finished
.then(() => animation1.play().finished) // .then(() => animation1.play().finished)
.then(() => animation1.play().finished) // .then(() => animation1.play().finished)
.then(() => animation2.play().finished) // .then(() => animation2.play().finished)
.then(() => animation1.play().finished) // .then(() => animation1.play().finished)
.then(() => animation2.play().finished) // .then(() => animation2.play().finished)
.then(() => { // .then(() => {
////console.log("Animation finished"); // ////console.log("Animation finished");
// <hide> // // <hide>
helper.goBack(); // helper.goBack();
done(); // done();
// </hide> // // </hide>
}) // })
.catch((e) => { // .catch((e) => {
console.log(e.message); // console.log(e.message);
// <hide> // // <hide>
helper.goBack(); // helper.goBack();
done(e); // done(e);
// </hide> // // </hide>
}); // });
// ``` // // ```
// </snippet> // // </snippet>
} //}
export var test_AnimatingMultipleViews = function (done) { export var test_AnimatingMultipleViews = function (done) {
var mainPage: pageModule.Page; var mainPage: pageModule.Page;
var label1: labelModule.Label; var label1: labelModule.Label;
var label2: labelModule.Label; var label2: labelModule.Label;
@ -240,7 +240,7 @@ export var test_ChainingAnimations = function (done) {
}); });
// ``` // ```
// </snippet> // </snippet>
} }
export var test_AnimateOpacity = function (done) { export var test_AnimateOpacity = function (done) {
var mainPage: pageModule.Page; var mainPage: pageModule.Page;
@ -258,7 +258,7 @@ export var test_AnimateOpacity = function (done) {
helper.navigate(pageFactory); helper.navigate(pageFactory);
TKUnit.waitUntilReady(() => { return label.isLoaded }); TKUnit.waitUntilReady(() => { return label.isLoaded });
label.animate({opacity: 0.75}) label.animate({ opacity: 0.75 })
.then(() => { .then(() => {
TKUnit.assert(label.opacity === 0.75); TKUnit.assert(label.opacity === 0.75);
helper.goBack(); helper.goBack();
@ -315,7 +315,7 @@ export var test_AnimateTranslate = function (done) {
helper.navigate(pageFactory); helper.navigate(pageFactory);
TKUnit.waitUntilReady(() => { return label.isLoaded }); TKUnit.waitUntilReady(() => { return label.isLoaded });
label.animate({ translate: {x: 100, y: 200} }) label.animate({ translate: { x: 100, y: 200 } })
.then(() => { .then(() => {
TKUnit.assert(label.translateX === 100); TKUnit.assert(label.translateX === 100);
TKUnit.assert(label.translateY === 200); TKUnit.assert(label.translateY === 200);
@ -384,3 +384,36 @@ export var test_AnimateRotate = function (done) {
done(e); done(e);
}); });
} }
export var test_AnimationsAreAlwaysPlayed = function (done) {
var mainPage: pageModule.Page;
var label: labelModule.Label;
var pageFactory = function (): pageModule.Page {
label = new labelModule.Label();
label.text = "label";
var stackLayout = new stackLayoutModule.StackLayout();
stackLayout.addChild(label);
mainPage = new pageModule.Page();
mainPage.content = stackLayout;
return mainPage;
};
helper.navigate(pageFactory);
TKUnit.waitUntilReady(() => { return label.isLoaded });
var animation1 = label.createAnimation({ opacity: 0 });
var animation2 = label.createAnimation({ opacity: 1 });
animation1.play().finished
.then(() => animation2.play().finished)
.then(() => {
TKUnit.assert(label.opacity === 1, `Label opacity expected vaue is 1, actual value is ${label.opacity}.`);
helper.goBack();
done();
})
.catch((e) => {
console.log(e.message);
helper.goBack();
done(e);
});
}

14
ui/animation/animation.android.ts
View File

@ -148,18 +148,15 @@ export class Animation extends common.Animation implements definition.Animation
case common.Properties.opacity: case common.Properties.opacity:
originalValue = nativeView.getAlpha(); originalValue = nativeView.getAlpha();
if (propertyAnimation.value !== propertyAnimation.target.opacity) {
nativeArray = java.lang.reflect.Array.newInstance(floatType, 1); nativeArray = java.lang.reflect.Array.newInstance(floatType, 1);
nativeArray[0] = propertyAnimation.value; nativeArray[0] = propertyAnimation.value;
animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "alpha", nativeArray)); animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "alpha", nativeArray));
propertyUpdateCallbacks.push(() => { propertyAnimation.target.opacity = propertyAnimation.value }); propertyUpdateCallbacks.push(() => { propertyAnimation.target.opacity = propertyAnimation.value });
propertyResetCallbacks.push(() => { nativeView.setAlpha(originalValue); }); propertyResetCallbacks.push(() => { nativeView.setAlpha(originalValue); });
}
break; break;
case common.Properties.backgroundColor: case common.Properties.backgroundColor:
originalValue = nativeView.getBackground(); originalValue = nativeView.getBackground();
if (!color.Color.equals(propertyAnimation.value, propertyAnimation.target.backgroundColor)) {
nativeArray = java.lang.reflect.Array.newInstance(java.lang.Object.class, 2); nativeArray = java.lang.reflect.Array.newInstance(java.lang.Object.class, 2);
nativeArray[0] = propertyAnimation.target.backgroundColor ? java.lang.Integer.valueOf((<color.Color>propertyAnimation.target.backgroundColor).argb) : java.lang.Integer.valueOf(-1); nativeArray[0] = propertyAnimation.target.backgroundColor ? java.lang.Integer.valueOf((<color.Color>propertyAnimation.target.backgroundColor).argb) : java.lang.Integer.valueOf(-1);
nativeArray[1] = java.lang.Integer.valueOf((<color.Color>propertyAnimation.value).argb); nativeArray[1] = java.lang.Integer.valueOf((<color.Color>propertyAnimation.value).argb);
@ -174,58 +171,47 @@ export class Animation extends common.Animation implements definition.Animation
animators.push(animator); animators.push(animator);
propertyUpdateCallbacks.push(() => { propertyAnimation.target.backgroundColor = propertyAnimation.value; }); propertyUpdateCallbacks.push(() => { propertyAnimation.target.backgroundColor = propertyAnimation.value; });
propertyResetCallbacks.push(() => { nativeView.setBackground(originalValue); }); propertyResetCallbacks.push(() => { nativeView.setBackground(originalValue); });
}
break; break;
case common.Properties.translate: case common.Properties.translate:
originalValue = nativeView.getTranslationX(); originalValue = nativeView.getTranslationX();
if (propertyAnimation.value.x * density !== originalValue) {
nativeArray = java.lang.reflect.Array.newInstance(floatType, 1); nativeArray = java.lang.reflect.Array.newInstance(floatType, 1);
nativeArray[0] = propertyAnimation.value.x * density; nativeArray[0] = propertyAnimation.value.x * density;
animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "translationX", nativeArray)); animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "translationX", nativeArray));
propertyUpdateCallbacks.push(() => { propertyAnimation.target.translateX = propertyAnimation.value.x; }); propertyUpdateCallbacks.push(() => { propertyAnimation.target.translateX = propertyAnimation.value.x; });
propertyResetCallbacks.push(() => { nativeView.setTranslationX(originalValue); }); propertyResetCallbacks.push(() => { nativeView.setTranslationX(originalValue); });
}
originalValue = nativeView.getTranslationY(); originalValue = nativeView.getTranslationY();
if (propertyAnimation.value.y * density !== originalValue) {
nativeArray = java.lang.reflect.Array.newInstance(floatType, 1); nativeArray = java.lang.reflect.Array.newInstance(floatType, 1);
nativeArray[0] = propertyAnimation.value.y * density; nativeArray[0] = propertyAnimation.value.y * density;
animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "translationY", nativeArray)); animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "translationY", nativeArray));
propertyUpdateCallbacks.push(() => { propertyAnimation.target.translateY = propertyAnimation.value.y; }); propertyUpdateCallbacks.push(() => { propertyAnimation.target.translateY = propertyAnimation.value.y; });
propertyResetCallbacks.push(() => { nativeView.setTranslationY(originalValue); }); propertyResetCallbacks.push(() => { nativeView.setTranslationY(originalValue); });
}
break; break;
case common.Properties.rotate: case common.Properties.rotate:
originalValue = nativeView.getRotation(); originalValue = nativeView.getRotation();
if (propertyAnimation.value !== originalValue) {
nativeArray = java.lang.reflect.Array.newInstance(floatType, 1); nativeArray = java.lang.reflect.Array.newInstance(floatType, 1);
nativeArray[0] = propertyAnimation.value; nativeArray[0] = propertyAnimation.value;
animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "rotation", nativeArray)); animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "rotation", nativeArray));
propertyUpdateCallbacks.push(() => { propertyAnimation.target.rotate = propertyAnimation.value; }); propertyUpdateCallbacks.push(() => { propertyAnimation.target.rotate = propertyAnimation.value; });
propertyResetCallbacks.push(() => { nativeView.setRotation(originalValue); }); propertyResetCallbacks.push(() => { nativeView.setRotation(originalValue); });
}
break; break;
case common.Properties.scale: case common.Properties.scale:
originalValue = nativeView.getScaleX(); originalValue = nativeView.getScaleX();
if (propertyAnimation.value.x !== originalValue) {
nativeArray = java.lang.reflect.Array.newInstance(floatType, 1); nativeArray = java.lang.reflect.Array.newInstance(floatType, 1);
nativeArray[0] = propertyAnimation.value.x; nativeArray[0] = propertyAnimation.value.x;
animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "scaleX", nativeArray)); animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "scaleX", nativeArray));
propertyUpdateCallbacks.push(() => { propertyAnimation.target.scaleX = propertyAnimation.value.x; }); propertyUpdateCallbacks.push(() => { propertyAnimation.target.scaleX = propertyAnimation.value.x; });
propertyResetCallbacks.push(() => { nativeView.setScaleX(originalValue); }); propertyResetCallbacks.push(() => { nativeView.setScaleX(originalValue); });
}
originalValue = nativeView.getScaleY(); originalValue = nativeView.getScaleY();
if (propertyAnimation.value.y !== originalValue) {
nativeArray = java.lang.reflect.Array.newInstance(floatType, 1); nativeArray = java.lang.reflect.Array.newInstance(floatType, 1);
nativeArray[0] = propertyAnimation.value.y; nativeArray[0] = propertyAnimation.value.y;
animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "scaleY", nativeArray)); animators.push(android.animation.ObjectAnimator.ofFloat(nativeView, "scaleY", nativeArray));
propertyUpdateCallbacks.push(() => { propertyAnimation.target.scaleY = propertyAnimation.value.y; }); propertyUpdateCallbacks.push(() => { propertyAnimation.target.scaleY = propertyAnimation.value.y; });
propertyResetCallbacks.push(() => { nativeView.setScaleY(originalValue); }); propertyResetCallbacks.push(() => { nativeView.setScaleY(originalValue); });
}
break; break;
default: default: