setActiveItem direction

[dobie_]

I have a container with a card layout set up with the sliding animation. Every time I call setActiveItem() on it, it slides left. I'd like it to reverse the slide animation depending on which child I'm looking at. Otherwise the app feels a little disorienting.

How do I do that? This isn't working for me:

Ext.getCmp('application').setActiveItem('mainCard', {direction: 'right'});

[mitchellsimoens]

Try something like this (this is how Ext.tab.Panel does it):

Ext.create('Ext.Container', {
    fullscreen : true,
    layout     : {
        type      : 'card',
        animation : {
            type      : 'slide',
            direction : 'left'
        }
    },
    items      : [
        {
            xtype  : 'toolbar',
            docked : 'top',
            items  : [
                {
                    text    : 'Go to first',
                    handler : function(btn) {
                        var cnt = btn.up('container[fullscreen=true]');

                        cnt.getLayout().getAnimation().setReverse(false);

                        cnt.setActiveItem(1);
                    }
                },
                {
                    text    : 'Go to second',
                    handler : function(btn) {
                        var cnt = btn.up('container[fullscreen=true]');

                        cnt.getLayout().getAnimation().setReverse(true);

                        cnt.setActiveItem(0);
                    }
                }
            ]
        },
        {
            html : 'One'
        },
        {
            html : 'Two'
        }
    ]
});