-
My panel with
borderlayout looks like this:var oSplitPanel = Ext.create('Ext.panel.Panel', { lid : 'splitpanel', layout: 'border', border: 0, style: { border: 0 } height: 150, items: [{ split: true, flex: 1, region: 'west', xtype: 'panel', lid: 'panelwest', layout: 'fit', minWidth: 200 }] }); -
Then another panel gets added to this
westregion panel:oSplitPanel.query('[lid=panelwest]')[0].add(oExplorerPanel); -
Then this split panel gets added to my main view:
that.getView().add(oSplitPanel); -
Then in another function, I add the
centerpanel:var oAddPanelRight = { split: true, flex: 3, region: 'center', xtype: 'panel', lid: 'panelcenter', layout: 'fit', border: 0 }; oSplitPanel.add(oAddPanelRight);
Problem:
Everything works perfect this way, however I want to change (limit) the splitter’s own width (this splitter is in between west and center panels to resize their width).
What I tried:
-
Try to change the width of splitters:
listeners: { afterrender: function() { // error following, 'splitters' does not exist oSplitPanel.layout.splitters.west.setWidth(1); oSplitPanel.doLayout(); } } -
Adding a negative margin to the
centerpanel:// Tried this: margin: '0 0 0 -4' // And that: style: { border: 0, marginLeft: '-3px' }
Your oSplitPanel object/instance does not have the split param set to true and has therefor no splitter applied. The splitter get applied to oAddPanelRight object/instance and the nested panel of the oSplitPanel, maybe also to the panel you add later. Can’t tell that.
So you just looked at the wrong class.
Btw. to get a splitter for the class itself you don’t need look at
oSplitPanel.layout.splittersJust look at thesplitterprop of the class.