Titanium: Slide window left/right

1
votes

I want to slide the current open window to the left, and slide a new window from the right to on screen. I use the following code, which does the job:

    var newWindow = Titanium.UI.createWindow({
        url:'new.js',
        backgroundImage:'ui/bg.gif',
        zIndex: 10,
        left: "100%",
        width: "100%"
    });


    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.curve = Titanium.UI.ANIMATION_CURVE_LINEAR;
    slide_it_left.duration = 500;

    var slide_it_right = Titanium.UI.createAnimation();
    slide_it_right.left = "-100%";
    //slide_it_right.curve = Titanium.UI.ANIMATION_CURVE_LINEAR;
    slide_it_right.duration = 500;    

    currentWindow.animate(slide_it_right);
    newWindow.open(slide_it_left);

However, there seems that there is a space of 20px between the two windows when they slide in/out. I have no idea how that is possible, since the currentWindow has a width of 100% and the new one as well.. I tried to hide that black space, by adjusting curve/ease, but with no good result, you still can notice a black space in between them no matter what. Any ideas? Thanks!

UPDATE: By making the animation duration super slow, I noticed that at the beginning and at the end they are perfectly aligned, but in between they are not. By making the animation to be very fast, the space between the two windows are big. Which means there must be something going on with the easing.. This should make the animation go without easing, no?: "Titanium.UI.ANIMATION_CURVE_LINEAR". But somehow it does not solve the problem.. Have no idea where the easing comes from.

4
animationtitaniumappcelerator
You should try to use a NavigationGroup, this is the purpose of sliding from left to right - davitz38
I think Thats Probably case in Android. CUZ android resize all its inner element when the animation is complete. May be I understood your question wrong but if I am correct then solution is try updating the inner views width along with the animation. Hope this helps. - Nikita Sharma Sahu

4 Answers

2
votes

if you are using tabs, just open new window in the same tab.

tab1.open(win,{animated:true});
1
votes

Does it work if you set the window width and left/right with a pixel value?

0
votes

No it will not work. Anyways I had same requirement in one of my apps so instead of using window I used Views and animated them from right to left and managed them with App global stack. Hope this helps.

0
votes

Since this question shows on the top of the search for appcelerator slide left animation here is what worked for me 

win.open({
    activityEnterAnimation: Ti.Android.R.anim.slide_in_left,
    activityExitAnimation: Ti.Android.R.anim.slide_out_right
});

Check documentation here

http://docs.appcelerator.com/platform/latest/#!/api/openWindowParams