How to disable Sencha Touch 2 page transition animations?

Question

I searched all around for it but couldn't find a solution which would turn off sliding (or any animation for that matter) animation on page transition. I have simple application with 4 views which just displays a bunch of data. I am testing performance of my application on various devices and thought turning off animations would be one of the test cases to follow.

I tried several ways, such as: (caution: these are all the solutions I found on the internet, some of them might not make sense. I am still learning the framework :)

Trial I: (in launch function)

Ext.override(Ext.Window, {
            animShow: function(){
                this.afterShow();
            },
            animHide: function(){
                this.el.hide();
                this.afterHide();
            }
        });

Trial II: (in launch function, replacing Trial I)

Ext.Anim.override({
            disableAnimations:true
        });

Trial III: (inside my view class)

config: {
        showAnimation: false,
        hideAnimation: false,
        navigationBar: {
            hidden   : false,
            animation: false
        },
        items: [
            {
                xtype: 'logincard',
                flex : 1
            }
        ]
    }

However, I could turn off animation in navigation bar using: (in my view class as well)

navigationBar: {
                hidden   : false,
                animation: false
            }

So is there someway of totally disabling the page transition animation in Sencha Touch 2.2.1?

Any help would be highly appreciated!

Answer 1

Finally got it working. I guess I didn't have adequate information on my question. I was using Navigation View which would consequently push other views via controllers.

All I had to do was put the following layout configuration inside config of my Main view which extends Navigation View.

    layout: {
            type: 'card',
            animation: false
    }

This would disable the animation on screen transition. Additionally, you can override duration, type, etc of the animation using the following configuration:

layout: {
    type: 'card',
    animation: {
        duration: 300,
        easing: 'ease-out',
        type: 'slide',
        direction: 'left'
    }
}

This is the default configuration for animation for Navigation View. I found help from here.