Threaded View

  1. #1
    Sencha User
    Join Date
    Aug 2012
    Posts
    91
    Answers
    6
    Vote Rating
    0
    alex9311 is on a distinguished road

      0  

    Default Answered: resize event listener problems

    Answered: resize event listener problems


    Hey all,

    I've got a resizable panel with a column layout which has a grid and another panel as its child components. When the outer-most panel is resized by the user, I want the grid and inner pannel to resize to fill their container. The width resizing is working (thanks to the column layout manager I think) but the height is stuck.

    My workaround was to make a listener in the parent panel for the resize event and resize its child components when it itself is resized. However, when I try to access the child components they return null. Any idea why I might be running into this problem?

    Code:
      Ext.define('BZ.view.blaze.MailDetailMaster', {
            extend: 'Ext.Panel',
            alias: 'widget.maildetailmaster',
            frame: true,
            title: 'Blaze',
            width: 1024,
            layout: 'column',
            resizable: 'true',
            listeners: {
                    resize: function(panel, w, h) {
                            //var detailpanel = Ext.ComponentQuery.query('detailpanel');
                            var detailpanel = panel.down('detailpanel');
                            detailpanel.setHeight(h);
                    }
            },
            items: [{
                    xtype: 'blazegrid',
                    itemId: 'gridPanel',
                    height: 500,
                    width: 380,
                },{
                    xtype: 'panel',
                    columnWidth: 1,
                    height: 500,
                    layout: 'border',
                    itemId: 'detailpanel',
                    items:[{
                            xtype: 'maildetailone',
                            itemId: 'detailPanelOne',
                            region: 'north',
                            height: 75
                        },{
                            xtype: 'maildetailtwo',
                            itemId: 'detailPanelTwo',
                            region: 'center',
                            autoFill: 'true'
                        }]
            }],
            initComponent: function() {
                this.callParent();
            },
        });

  2. Missing #:

    Code:
    var detailpanel = panel.down('#detailpanel');
    You shouldn't need to do manual resizing like this. Any reason you're not just using a vbox layout with align: 'stretch'?

Thread Participants: 1

Tags for this Thread