extjs在調整大小時在面板上的寬度爲100％

我在一個寬度爲50％的頁面中有一個div。我使用renderTo將該面板附加到該div，但是當我更改窗口大小時，我的面板不會調整大小並保持原始大小。extjs在調整大小時在面板上的寬度爲100％

var vp = Ext.create('Ext.panel.Panel',{      
        plugins : ['fittoparent'],      
        height: 400, 
        layout: 'fit', 
        flex:1, 
        renderTo: Ext.get("scheduler-container"),        
        items:[ 
         { 
          xtype: 'resource-list', 
          layout : 'fit',         
          resource: resourceResponse, 
          event: eventResponse, 
          serverDateFormat: serverDateFormat, 
          startViewRange: startDate,    
          endViewRange: endDate, 
          readOnlyView: true, 
          showCurrentTime: true, 
          dateToScrollTo: now, 
          getEvents: ResourceScheduler.getAllEvents, 
          getResources: ResourceScheduler.getResources, 
          timeZoneOffset: timeZoneOffset 
         } 
        ] 
       });

我碰到這個http://www.sencha.com/forum/showthread.php?28318-Fit-to-parent &亮點=調整'>插件，並試圖如果它的工作原理。不幸的是，它只適用於擴展窗口，而不適用於縮小窗口。我想知道是否有人成功完成製作100％寬×高100％的面板。

來源

2013-08-06 powerfade917

-1

嘗試用這些CONFIGS

寬度：「100％」

高度：「100％」

來源

2013-08-07 10:15:18

它不接受百分比 – powerfade917

面板不接受寬度和高度的百分比。 – Kathir

很抱歉的混亂實際上這個插件（http://www.sencha.com/forum/showthread.php?28318-Fit-to-parent&highlight=resize）所做的工作。我已經建立了像這樣的頁面

<table> 
<tr> 
<td style='width: 50%'> 
    <div id='scheduler-container'></div> 
</td> 
<td style='width: 50%'></td> 
</tr> 
<table>

但是，使用div替換表後它工作！所以在修改之後，它看起來像這樣

<div class='float-left'> 
<div id='scheduler-container' style='width:50%'></div> 
</div> 
<div class='float-left' style='width:50%'> 
</div> 
<div class='float-clear'></div>

我希望這將是一些碰上的問題是有用的。我不經常使用表，但一些salesforce ui組件呈現爲表格，所以我遇到了這個問題。

來源

2013-08-08 06:46:48 powerfade917

您可以使用調整事件函數

resize: function (component, adjWidth) { 
      console.log("resized") ; 
     }

你會得到側所需參數的組成部分，adjWidth，並利用這一點。使用有效的條件語句您設置的身高和體重相應

您 component.dom.style.height得到高度和寬度，

component.dom.style.width

來源

2017-11-28 05:54:02

extjs在調整大小時在面板上的寬度爲100％

回答

相關問題