Issue with 'translate' animation method of 'Titanium.UI.2DMatrix'

Question

I was just creating a slide out control using Appcelerator Titanium.

What I have done:

I added a button on the view and added it on the window.

// Create a Button.
var Animate = Ti.UI.createButton({
    title : 'Animate',
    height : 'auto',
    width : 'auto',
    top : 'auto',
    left : 'auto'
});

// Listen for click events.
Animate.addEventListener('click', function() {
     var matrix = Ti.UI.create2DMatrix();
     if(flag)   //Initially the flag is set to true
     {
        matrix = matrix.translate(100,0);
     }
     else
     {
        matrix = matrix.translate(0,0);
     }
     flag = !flag;
     var a = Ti.UI.createAnimation({
        transform : matrix,
        duration : 1000,
        //autoreverse : true,
        //repeat : 3
    });
    self.animate(a);
});

// Add to the parent view.
self.add(Animate);   //Here self is my view

Expected Output

• Clicking on the button will slide out the view
• Clicking the same button will reset the view

Actual output:

• Clicking on the button will slide out the view
• Clicking again on the button not triggering any action
• If I click on the initial position of button it will reset the view

Screenshots:

Initial Screen

When I click on button, is Slide Out:

When I click to reset, Issue happens:

Answer 1

I tried a lot of methods, but nothing helped me. At-last I did the following and it worked.

Instead of adding animation to view I added that to it's window and changed the code little bit like.

var firstView = new FirstView();
self.add(firstView);
var xy = 0;

// Create a Button.
var Animate = Ti.UI.createButton({
    title : 'Animate',
    height : 100,
    width : 100,
    top : 0,
    left : 0
});

// Listen for click events.
Animate.addEventListener('click', function() {
    var xy = 0;
     var matrix = Ti.UI.create2DMatrix();
     if(flag)
     {
        xy = 100;
        matrix = matrix.translate(100,0);
     }
     else
     {
        xy = 0;
        matrix = matrix.translate(0,0);
     }
     flag = !flag;
     var a = Ti.UI.createAnimation({
        duration : 1000,
        left:xy
    });

    a.addEventListener('complete',function()
    {
        firstView.left = 0; 
    });

    self.animate(a);  //self is the parent window
});


// Add to the parent
firstView.add(Animate);