extjs 3.4面板崩溃时滚动条消失

我正在创建一个使用多个Panel组件的EXT窗体，其中一个组件折叠到左侧。当它这样做时右边的Panel（称为centrePanel，因为尽管它在右边有一个'中心'区域），并且其子节点扩展。 centrePanel的直接子女是Panel，如果其上的数据不适合Panel，则该子女已被设置为滚动。我遇到的问题是，当我折叠左侧的Panel时，任何滚动条消失。扩展不会使他们回来。但有两点需要注意：extjs 3.4面板崩溃时滚动条消失

我仍然可以使用鼠标在两个Panel之间滚动。
折叠后的Panel折叠并展开一次，并且任何滚动条消失后，当左侧Panel随后折叠时，其他面板上的滚动条再次短暂可见。一旦崩溃事件结束，滚动条不再可见。当Panel再次展开时，不会发生这种情况。

这里是相关的代码。

可折叠Panel（宣布对飞作为窗口的项目的一部分）：

  region: "west", 
     width: "38%", 
     title: "Filter", 
     collapsible: true, 
     items: [myFilterFormPanel], 
     listeners:{ 
      collapse: function(panel){ 
       //Make centre panel and children wider when filter panel is collapsed. 
       centrePanel.setWidth(1000); 
       searchResultsPanel.setWidth(1000); 
       myColumnModel.setColumnWidth(0, 540); 
       myColumnModel.setColumnWidth(1, 165); 
       myColumnModel.setColumnWidth(2, 165); 
       }, 
      expand: function(panel){ 
      //Make centre panel and children wider when filter panel is collapsed. 
      centrePanel.setWidth(659); 
      searchResultsPanel.setWidth(659); 
      myColumnModel.setColumnWidth(0, 200); 
      myColumnModel.setColumnWidth(1, 90); 
      myColumnModel.setColumnWidth(2, 90); 
     } 
    }

myFilterFormPanel：

var myFilterFormPanel = new Ext.FormPanel({ 
    border: false, 
    id: windowId + "myfilter", 
    items: [stationsPanel, datesPanel, daysPanel, impactPanel, searchButton] 
});

centrePanel（包含可滚动的面板，但不是滚动本身）：

var centrePanel = new Ext.Panel({ 
    border: false, 
    items: [searchResultsPanel, individualResultPanel] 
    } 
});

searchResultsPanel（它变成可滚动的必要时）：

 var searchResultsPanel = new Ext.grid.GridPanel({ 
      title: "All Results", 
      id: windowId + "allresults", 
      region: "north", 
      height: 250, 
      border: false, 
      padding: 10, 
      autoScroll: true, 
//   style:'overflow-y:auto', 
      colModel: myColumnModel, 
      store: myStore, 
      listeners: { 
       rowclick: function(thisRow, rowIndex){ 
        //Display additional information in individual result panel. 
        var myData = myStore.getAt(rowIndex).data; 
        individualResultPanel.body.update("<h1><u>Summary</u></h1><p>" + myData.summary + "</p>" 
         + "<h1><u>Body</u></h1><p>" + myData.body + "</p>" 
         + "<h1><u>Additional Information</u></h1><p>" + myData.additionalInformation + "</p>" 
         + "<h1><u>Customer Information</u></h1><p>" + myData.customerInformation + "</p>" 
         + "<h1><u>Further Information</u></h1><p>" + myData.furtherInformation + "</p>""); 
       } 
      } 
     });

individualResultPanel（也成为可滚动的）;

var individualResultPanel = new Ext.Panel({ 
    border: false, 
    autoScroll: true, 
    title: "Selected Result", 
    id: windowId + "individualresult", 
    region: "south", 
    height: 250, 
    padding: 10, 
});

在searchResultsPanel我试着设置样式为overflow:auto;这就是设置autoScroll到true不反正但这并没有改变任何东西。我也尝试减小其中一个可解的Panel s的宽度，但这也没有什么区别。我想动态地改变可滚动Panel的风格时，折叠Panel折叠，但考虑到我总是可以滚动，我不认为这将有所作为，但纠正我，如果我错了。

来源

2015-01-15 user1849060

如果你能提供一个[小提琴]（http://fiddle.sencha.com），这样我们就可以稍微玩一下了。但否则..好帖子 – Scriptable 2015-01-15 15:57:53

我设法解决这个问题，但通过更改我原来的问题中没有提供的代码。我在可折叠的Panel上设置了expand和collapse听众，因此当这些事件被触发时，我手动设置了Panel组件的宽度（使用硬编码值），而对于GridPanel，我额外设置了列的宽度GridPanel的ColumnModel。删除这些代码行后，折叠并展开可折叠Panel时，滚动条将保留。

来源

2015-01-17 11:10:17 user1849060

extjs 3.4面板崩溃时滚动条消失

回答

相关问题