Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-15633] Android: Animate is canceling the view transform

GitHub Issuen/a
TypeBug
PriorityHigh
StatusClosed
ResolutionFixed
Resolution Date2014-04-17T21:29:37.000+0000
Affected Version/sn/a
Fix Version/s2014 Sprint 08, 2014 Sprint 08 SDK, Release 3.3.0
ComponentsAndroid
Labels2DMatrix, SupportTeam, alloy, android, animate, qe-closed-3.3.0, qe-testadded, transform
ReporterMostafizur Rahman
AssigneeSunila
Created2013-10-25T22:59:03.000+0000
Updated2014-07-23T11:00:46.000+0000

Description

when we apply an animation to a view, the animation begin from initial left and don't unterresing to the transform applied early
var t1 = Titanium.UI.create2DMatrix();
$.btTranslate.addEventListener("click",function(e){
	t1 = t1.translate(50,0);
	$.coords.transform = t1;
});

$.btTestAnimate.addEventListener("click",function(e){
	t1 = t1.translate(50,0);
	$.coords.animate({transform : t1,duration:1000});
});
<View id="contentview">
<Label id="coords">test</Label>
<Button id="btTranslate" backgroundColor="red" width="50" height="50" top="100"/>
<Button id="btTestAnimate" backgroundColor="yellow" width="50" height="50" top="160"/>
</View>

Comments

  1. hamza ezzi 2013-10-25

    tested with SDK 3.1.3GA .. for iPhone works fine but not for android
  2. Sunila 2013-11-25

    If the layout is already done, we need to trigger requestLayout so that the animation is applied https://github.com/appcelerator/titanium_mobile/pull/5022
  3. Sunila 2013-12-03

    Test case in native code var win = Ti.UI.createWindow({ backgroundColor:'white', }); var coords = Ti.UI.createLabel({ text:'coords' }); win.add(coords); var btTranslate = Ti.UI.createButton({top:100,title:"btTranslate"}); win.add(btTranslate); var btTestAnimate = Ti.UI.createButton({top:200,title:"btTestAnimate"}); win.add(btTestAnimate); var t1 = Titanium.UI.create2DMatrix(); btTranslate.addEventListener("click",function(e){ t1 = t1.translate(50,0); coords.transform = t1; }); btTestAnimate.addEventListener("click",function(e){ t1 = t1.translate(50,0); coords.animate({transform : t1,duration:1000}); }); win.open();
  4. Sunila 2014-02-03

    Click on btTestAnimation, you will see that animation starts from middle. Click on btTranslate and then on btTestAnimation, you will see that animation still starts from the middle instead of from 50 to the right from middle.
  5. Thomas Neerup 2014-03-31

    Any news on this one... ?
  6. Sunila 2014-04-02

    Added comments in the PR regarding the issue with multiple operations in the matrix.
  7. Sunila 2014-04-17

  8. Neha Mittal 2014-04-25

    Verified fix with below environment: Appc Studio: 3.3.0.201404211130 SDK build: 3.3.0.v20140424130915 acs: 1.0.14 npm: 1.3.2 alloy: 1.4.0-dev CLI: titanium-3.3.0-dev titanium-code-processor:1.1.1-beta1 Xcode: 5.1.1 Osx: Mavericks(10.9.2) Device: Nexus 5(4.4.2) Clicked on btTranslate and then on btTestAnimation, the animation starts from the position applied early. Hence closing the issue.

JSON Source