ExtJS làm thế nào để thiết lập 100% chiều cao cho bảng vbox

Question

Hi ~,

Tôi muốn thiết lập 100% còn sót lại chiều cao vào bảng 2. nhưng tôi không biết làm thế nào để làm ..

đây là mã thử nghiệm của tôi,

{ 
    title : 'EAST', 
    region : 'east', 
    layout : 'vbox', 
    layoutConfig : { 
     align : 'stretch' 
    }, 
    bodyStyle : 'border:1px solid blue', 
    width: 300, 
    items : [ 
     new Ext.Panel({ 
      title : 'Panel 1', 
      border : true, 
      layout : 'fit', 
      height : 250, 
      html : 'PANEL 1 AREA' 
     }), 
     new Ext.Panel({ 
      title : 'Panel 2', 
      border : true, 
      bodyStyle : 'border:1px solid red', 
      layout : 'fit', 
      html : 'PANEL 2 AREA' 
     }) 
    ] 
} 

tôi đã cố gắng, autoHeight: true và height: '100%' vào bảng 2 nhưng nó không hoạt động.

ai cũng biết, hãy giúp tôi ~

cảm ơn bạn ~!

Answer 1

Bạn nên sử dụng thuộc tính flex cho bảng điều khiển thứ hai.

new Ext.Panel({ 
    title : 'Panel 2', 
    border : true, 
    bodyStyle : 'border:1px solid red', 
    layout : 'fit', 
    html : 'PANEL 2 AREA', 
    flex: 1 
}) 

Answer 2

thử thiết lập tài sản flex trong bảng thứ hai

new Ext.Panel({ 
     title  : 'Panel 2', 
     border : true, 
     bodyStyle : 'border:1px solid red', 
     layout : 'fit', 
     html  : 'PANEL 2 AREA', 
     flex  : 1 

    }) 

flex chỉ được sử dụng khi phần được đưa ra bởi một container đã được cấu hình để sử dụng một BoxLayout. Mỗi thành phần con với một thuộc tính flex sẽ được uốn cong theo chiều dọc (bởi VBoxLayout) hoặc theo chiều ngang (bởi HBoxLayout) theo giá trị flex tương đối của mặt hàng so với tổng của tất cả Linh kiện có giá trị flex được chỉ định.