1. #1
    Sencha User
    Join Date
    Sep 2012
    Posts
    3
    Vote Rating
    0
    r.dilillo is on a distinguished road

      0  

    Default Unanswered: Containers don't fit the panel

    Unanswered: Containers don't fit the panel


    First of all, hi to everyone here! Second thing: i'm not english so you could find some errors in my posts... don't hate me.
    However, i'm new in the community, i've just approached to Sencha ExtJs 4.1, and i think it's really Awesoooome!
    By the way i'm a niwbie and i've just fell in the first problem.
    (NDR i'm using architect tryal version)

    i'm trying to make a simple panel with some tabs. One of these has 2 fieldset inside, and i'm crushing my head trying to understand how to set 'em to 50% width and 100% height (of the panel)! there is any strange option or propriety to set? thx everybody!
    Oh! i was forgetting the code: (it's just the interested part)


    Code:
        xtype: 'panel',
                                layout: {
                                    align: 'stretch',
                                    type: 'vbox'
                                },
                                title: 'Availability',
                                items: [
                                    {
                                        xtype: 'container',
                                        layout: {
                                            align: 'middle',
                                            pack: 'center',
                                            type: 'hbox'
                                        },
                                        items: [
                                            {
                                                xtype: 'fieldset',
                                                flex: 1,
                                                layout: {
                                                    type: 'fit'
                                                },
                                                title: 'Scheduling',
                                                items: [
                                                    {
                                                        xtype: 'displayfield',
                                                        fieldLabel: 'Video scheduling is currently available to Mainstreaming Pro or Enterprise Edition Stream'
                                                    }
                                                ]
                                            },
                                            {
                                                xtype: 'fieldset',
                                                flex: 2,
                                                layout: {
                                                    type: 'fit'
                                                },
                                                title: 'Geographic Filtering',
                                                items: [
                                                    {
                                                        xtype: 'displayfield',
                                                        fieldLabel: 'Geo-filtering settings for videos are currently available'
                                                    }
                                                ]
                                            }
                                        ]
                                    },
                                    {
                                        xtype: 'container',
                                        items: [
                                            {
                                                xtype: 'button',
                                                text: 'Save Changes'
                                            }
                                        ]
                                    }
                                ]
                            }

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,010
    Answers
    668
    Vote Rating
    460
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    how to set 'em to 50% width and 100% height (of the panel)
    See if this helps:

    Code:
    Ext.define('MyApp.view.MyPanel', {
        extend: 'Ext.panel.Panel',
    
        height: 312,
        width: 520,
        layout: {
            align: 'stretch',
            type: 'hbox'
        },
        title: 'My Panel',
    
        initComponent: function() {
            var me = this;
    
            Ext.applyIf(me, {
                items: [
                    {
                        xtype: 'fieldset',
                        flex: 1,
                        title: 'My Fields'
                    },
                    {
                        xtype: 'fieldset',
                        flex: 1,
                        title: 'My Fields'
                    }
                ]
            });
    
            me.callParent(arguments);
        }
    
    });
    Scott.

Thread Participants: 1