Titanium Community Questions & Answer Archive

We felt that 6+ years of knowledge should not die so this is the Titanium Community Questions & Answer Archive

Animate view transitions with a slide like new windows

Is there any way to have a transition between views that slides like the transition used when a new window is created? Thanks in advance for any replies.

— asked March 16th 2010 by Joseph Burger
  • mobile
0 Comments

4 Answers

  • Accepted Answer

    When you create your window and add elements to it, you could try setting it off screen first using left:320

    Then create an animation :

    
        var slide_it_left = Titanium.UI.createAnimation();
        slide_it_left.left = 0; // to put it back to the left side of the window
        slide_it_left.duration = 300;
    

    Then, use this animation when you 'open' the window :

    
    mywindow.open(slide_it_left);
    
    — answered March 16th 2010 by Kosso
    permalink
    0 Comments
  • set the width and height of your viewToAnimate to the width and height of its container view, in your case contentView

    — answered October 23rd 2012 by sameeh harfoush
    permalink
    0 Comments
  • Thanks, I used your method and also did the opposite for the currently active window at the same time so that the active window slides out and the new window slides in.

    — answered March 17th 2010 by Joseph Burger
    permalink
    1 Comment
    • It is not working for me. Can you please help. I am trying on Android emulator, with titanium SDK 1.0.7.201112152014.
      I have created a window with its left property set to 320

      Titanium.UI.createWindow({
      left:320});
      then applying above code.

      — commented February 15th 2012 by avaya sahu
  • Can someone help me. I am trying to achieve the same.
    The container which holds the view is contentView.
    If it is already having a child I will make it removed by animating it to slid to left.
    If there is no child then it will only animate the passed view which will move from right to left.

    Sdk 1.8
    Platform : Android 3.0 (emulator)

    function animateView (view) {
        if(contentView.children.length>0) {
            var slide_it_left = Titanium.UI.createAnimation();
            slide_it_left.left = -1*contentView.width; // to put it back to the left side of the window
            slide_it_left.duration = 400;
            var viewToAnimate  = contentView.children[0];
            //a1.curve = Titanium.UI.ANIMATION_CURVE_LINEAR;
            slide_it_left.addEventListener('complete', function () {
                contentView.remove(viewToAnimate );
            });
            viewToAnimate.animate(slide_it_left);
        } 
        {
            view.width=contentView.width;
            view.height=contentView.height;
            view.slide_it_left = contentView.width;
            contentView.add(view);
            var slide_it_left = Titanium.UI.createAnimation();
            slide_it_left.left = 0; // to put it back to the left side of the window
            slide_it_left.duration = 395;
            slide_it_left.addEventListener('complete', function () {
                viewModule.viewInit();
            });
            view.animate(slide_it_left);
           }
    }
    
    — answered February 18th 2012 by avaya sahu
    permalink
    0 Comments
The ownership of individual contributions to this community generated content is retained by the authors of their contributions.
All trademarks remain the property of the respective owner.