Steps to Reproduce
Use the code from documentation (
http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.Animation-property-anchorPoint)
Using an anchorPoint (Android and iOS)
var animationType = [
{ name: 'Top Left', anchorPoint: {x:0, y:0} },
{ name: 'Top Right', anchorPoint: {x:1, y:0} },
{ name: 'Bottom Left', anchorPoint: {x:0, y:1} },
{ name: 'Bottom Right', anchorPoint: {x:1, y:1} },
{ name: 'Center', anchorPoint: {x:0.5, y:0.5} }
];
var animationTypeLength = animationType.length;
var animationCount = 0;
var animationTypePointer = 0;
var t = Ti.UI.create2DMatrix();
t = t.rotate(90);
// animation properties
var a = {
transform: t,
duration: 2000,
autoreverse: true
};
Ti.UI.backgroundColor = 'white';
var win = Ti.UI.createWindow();
var view = Ti.UI.createView({
backgroundColor:'#336699',
width:100, height:100
});
win.add(view);
var button = Ti.UI.createButton({
title:'Animate ' + animationType[animationTypePointer].name,
height: (Ti.UI.Android) ? 80 : 40,
width: (Ti.UI.Android) ? 300 : 200,
top:30
});
win.add(button);
function updateButton(name){
button.title = 'Animate ' + name;
}
button.addEventListener('click', function(){
// set new anchorPoint on animation for Android
a.anchorPoint = animationType[animationTypePointer].anchorPoint;
// set new anchorPoint on view for iOS
view.anchorPoint = animationType[animationTypePointer].anchorPoint;
animationCount++;
// determine position of next object in animationType array or return to first item
// using modulus operator
animationTypePointer = animationCount % animationTypeLength;
// animate view, followed by callback to set next button title
view.animate(a, function(){
updateButton(animationType[animationTypePointer].name);
});
});
win.open();
Actual Result
On Android anchorPoint is always in the center of view no matter what value is set. Such situation occurs on real device (Android 5.1.1) and on GenyMotion devices (Android 4.1, 5.2).
On iOS code works as it should.
The bug may be old because I encountered it with other project but gave up that time (
https://archive.appcelerator.com/topic/3536/anchor-point-is-not-working-on-android/1)
Expected Result
Anchor point should work and view should rotate around the anchor point no matter if it is iOS or Android.
Hello, Is there any chance to fix that bug anytime soon? It blocks all rotations on Android, except with centered anchorPoint. Thansk
This is a parity issue, or perhaps a documentation issue. On Android, you set the anchor point on the view being animated. On iOS, you set the anchor point on the animation object. At least, that's how it used to work back when I wrote this gist https://gist.github.com/skypanther/08a0334f674afb394445
I have the same problem. I need a solution, please.
@Tim: 1. I think you mix things. On Android you use anchor point on the animation object, and on the view for iOS. 2. My code fulfills both situations: adding anchor point to view and animation (same as yours). 3. Your code doesn't work properly on Android due same issue.
Like I said, this is old code that I haven't looked at in years. That code used to work; I used it in an app as well as in demonstrations in the Titanium classes I taught. So, this is a regression.
Closing this ticket as duplicate.