ExtJS 크기는 브라우저 창 크기에 따라 조정됩니다.

첫 번째 상황: 패널에 두 개의 패널을 끼워 넣으면 레이아웃을 vbox로 설정하고 item 설정에서 flex:로 두 개의 하위 패널의 비례 크기를 지정할 수 있습니다.

Ext.define('My.view.b.Main', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.bmain',
        //height:'100%',
        layout:{
                type:'vbox',
                align:'center',
        },
    initComponent: function(){
        this.items = [{
                        xtype: 'bform',
                        width:'100%',
                        flex:1
                },{
                        xtype: 'blist',
                        width:'100%',
                        flex:4
                }];
        this.callParent(arguments);
    }
});

두 번째 상황: 패널에 두 개의 패널이 박혀 있지만 어느 패널은 높이를 고정해야 한다.같은 부모 패널의layout을 vbox로 설정하지만 하이라이트 속성을'100%'로 동시에 설정해야 합니다. item 설정에서 첫 번째 패널의height를 고정값(예를 들어 100)으로 설정하고 (이view에 대응하는 controller에) afterrender 이벤트를 추가해야 합니다. 이 이벤트 함수에 다른 패널의 크기를 동적으로 지정합니다.
마스터 패널 정의:

Ext.define('My.view.b.Main', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.bmain',
        height:'100%',
        layout:{
                type:'vbox',
                align:'center',
        },
    initComponent: function(){
        this.items = [{
                        xtype: 'bform',
                        width:'100%',
                        height:125
                        //flex:1
                },{
                        xtype: 'blist',
                        width:'100%',
                        //flex:4
                }];
        this.callParent(arguments);
    }
});

대응하는 BController.js

 
          refs:[
                {
                        selector:'bmain',
                        ref:'bMain'
                },{
                        selector:'blist',
                        ref:'bList',
                }
        ],

        init:function(){
                this.control({
                        'blist':{
                                afterrender:this.setListHeight
                        },
                });
        },
        setListHeight: function(me, opts){
                me.setHeight(this.getBMain().getSize().height - 135);
        },

그러나 상기 두 번째 방법은 페이지를 불러올 때만 적응할 수 있습니다. 불러온 후에 창 크기를 조정하면 List는 창 크기에 따라 자동으로 조정되지 않습니다.
해결 방법:
BController에 있습니다.js에서 메인 패널에 resize 이벤트 함수를 추가합니다. 이 함수는 메인 패널의 크기를 조정할 때 터치합니다. 이 이벤트가 setListHeight () 와 같은 함수를 터치하면 브라우저 창의 크기에 따라 자동으로 조정됩니다 (자체 적응)

       resizeListHeight: function(me, width, height, oldwidth, oldheight ){
                this.getBList().setHeight(height-135);
        },