I generated an application via cmd sencha and changed the main view to show the example / kitchensink / form-multicolumn but my layout is just one column. This is a bug, or what I'm doing wrong in my view?

printscreen.jpg


The code of main view is:



Code:



/**
 * This class is the main view for the application. It is specified in app.js as the
 * "autoCreateViewport" property. That setting automatically applies the "viewport"
 * plugin to promote that instance of this class to the body element.
 *
 * TODO - Replace this content of this view to suite the needs of your application.
 */
Ext.define('Authentication2.view.main.Main', {
    extend: 'Ext.form.Panel',
    requires: [
        'Authentication2.view.main.MainController',
        'Authentication2.view.main.MainModel'
    ],


    xtype: 'app-main',
    
    controller: 'main',
    viewModel: {
        type: 'main'
    },


     title: 'Multi Column Form',
    frame: true,
    resizable: true,
    minHeight: 200,


    layout: 'column',
    
    defaults: {
        layout: 'form',
        xtype: 'container',
        defaultType: 'textfield',
        style: 'width: 50%'
    },


    items: [{
        items: [
            { fieldLabel: 'First Name' },
            { fieldLabel: 'Last Name' },
            { fieldLabel: 'Phone Number' },
            { fieldLabel: 'Email Address' }
        ]
    }, {
        items: [
            { fieldLabel: 'Street Address 1' },
            { fieldLabel: 'Street Address 2' },
            { fieldLabel: 'City, State' },
            { fieldLabel: 'ZIP code' }
        ]
    }],
    
    buttons: [
        { text: 'OK' },
        { text: 'Cancel' }
    ],
   


    initComponent: function() {
        this.width = 590;
        this.minWidth = 590;
        this.callParent();
    }
});