Wizard Form Layout in Sencha Touch

Hi Folks, I would like to know how to create a wizard form layout in sencha touch, calling each xtype per step with next and previous button. BTW, I have the code below for testing but it's not working. Thank you again for you help!

Code:

Ext.define('XX.view.TransactionMain',{
    extend: 'Ext.Container',
    xtype: 'transmain',
    requires: [
        'XX.view.TransactionGeneralInfo',
        'XX.view.TransactionPropertyInfo'
    ],
    config: {
        title: 'Test',
        navigationBar: {
            hidden: true
        },
        layout: {
            type: 'card',
            animation: {
                duration: 200,
                easing: 'ease-out',
                type: 'slide',
                direction: 'left'
            }
        },
        items: [{
            title: 'Search',
            layout: 'fit',
            items: [{
                xtype: 'formpanel',
                scrollable: {
                    direction: 'vertical',
                    directionLock: true,
                    indicators: false
                },
                defaults: {
                    margin: 5
                },
                items: [{
                    xtype: 'transgeninfo',
                    flex: 1
                },{
                    xtype: 'propertyinfo',
                    flex: 1
                },{
                    xtype: 'fieldset',
                    items: [{
                        xtype: 'button',
                        text: 'View',
                        ui: 'confirm',
                        itemId: 'buttonView'
                    }]
                }]
            }]
        }]
    }
});

Wizard Form Layout in Sencha Touch