Search code examples
titaniumappceleratorappcelerator-titaniumtitanium-alloy

Titanium appcelerator animate view blinks


I want to animate a view when click corresponding button, unfortunately when animate from top to bottom view blink :

/*
* ANIMATE FROM BOTTOM TO TOP
*/
function showModal(item){
    var bottom_to_top = Ti.UI.createAnimation({
        top : '0%',
        duration : 500
    });
    $[item].animate(bottom_to_top)
}

/*
* ANIMATE FROM TOP TO BOTTOM
*/
function hideModal(item){
    var top_to_bottom = Ti.UI.createAnimation({
        top : '100%',
        duration : 500
    });
    $[item].animate(top_to_bottom)
}

///// HERE I SHOW HIDE MY VIEW
function button_show(){
    showModal($.myView);
}
function button_hide(){
    hideModal($.myView);
}

First problem, if i assign "100%" to hide view, it's not appear when i try to show, only value 99 and below works. Second problem, animation blinks when hide view.

Someone could tell what i should do please? thank you.


Solution

  • Try to avoid percentage margins as often as possible. Also, use native technologies to show a modal window, e.g.

    var window = Ti.UI.createWindow({
        title: "My Modal Window",
        backgroundColor: "white"
    });
    
    var nav = Ti.UI.iOS.createNavigationWindow({
        window: window
    });
    
    nav.open({
        modal: true
    });