ExtJS에서 자동 높이를 사용하여 분할 영역을 만드는 방법

나는 이것이 매우 간단하다고 생각했을 것입니다. 아아, ExtJS에 대해서는 아무 것도없는 것처럼 보입니다.ExtJS에서 자동 높이를 사용하여 분할 영역을 만드는 방법

테두리 레이아웃의 '가운데'영역을 분할하고 페이지 크기가 조정될 때 상단 및 하단 모두 중앙 영역을 채워야합니다.

필자는 패널의 절대 크기를 설정하는 방법 만 이해할 수 있습니다.

/* This file is created or modified with 
* Ext.ux.guid.plugin.GuiDesigner (v2.1.0) 
*/ 
{ 
    layout : "border", 
    items : [ { 
     region : "center", 
     title : "map", 
     items : [  { 
      xtype : "panel", 
      title : "Panel", 
      autoHeight : true, 
      split : true, 
      height : 100 
     },  { 
      xtype : "panel", 
      title : "Panel", 
      autoHeight : true, 
      split : true, 
      height : 300 
     }] 
    }, { 
     region : "north", 
     split : true, 
     height : 100 
    }, { 
     region : "west", 
     width : 300, 
     split : true, 
     collapsible : true, 
     title : "Gazetter Explorer" 
    }] 
}

출처

2010-03-22 gargantuan

첫째을 사용하여 생성 된 코드의, autoHeight를 컨테이너는 콘텐츠의 크기로 축소되고 그 치수 (되지 외장에 의해), 브라우저에 의해 관리되는 것을 의미한다. 이는 앱 UI에서 거의 원하는 것이 아닙니다.

센터 지역에는 특정 유형의 레이아웃이 지정되어 있어야합니다. 당신은 그것을 layout: 'border'로주고 그것을 중앙과 북쪽/남쪽 패널에 부여함으로써 그것을 나눌 수 있습니다. 그러나 "자동 높이"유형의 레이아웃을 모방하려면 vbox 레이아웃 (내선 3.x)과 함께 두 개의 하위 패널을 사용하여 50 % (또는 원하는대로) 펼칠 수 있습니다. 공간.

출처

2010-03-22 17:49:59

패널의 render 이벤트에서 리스너를 사용하지 않고 패널의 레이아웃 구성 내에 Ext.Resizable을 적용 할 수 있다면 정말 좋을 것입니다. –

ExtJS에서 자동 높이를 사용하여 분할 영역을 만드는 방법

답변

관련 문제