PDA

View Full Version : [FIXED-162][3.0] VBoxLayout scrollOffset



Condor
21 Aug 2009, 11:29 PM
The VBoxLayout scrollOffset config option is incorrectly applied to the width instead of the height.

Example:

Ext.onReady(function(){
new Ext.Panel({
title: 'VBoxLayout',
width: 200,
height: 200,
layout: 'vbox',
layoutConfig: {
scrollOffset: Ext.getScrollBarWidth()
},
autoScroll: true,
items: [{
title: 'Item 1',
flex: 1,
width: 300
},{
title: 'Item 2',
flex: 1,
width: 300
}],
renderTo: Ext.getBody()
});
});

Fix:

Ext.override(Ext.layout.VBoxLayout, {
onLayout : function(ct, target){
Ext.layout.VBoxLayout.superclass.onLayout.call(this, ct, target);
var cs = this.getItems(ct), cm, ch, margin,
size = this.getTargetSize(target),
w = size.width - target.getPadding('lr') /*- this.scrollOffset*/,
h = size.height - target.getPadding('tb') - this.scrollOffset,
l = this.padding.left, t = this.padding.top,
isStart = this.pack == 'start',
isRestore = ['stretch', 'stretchmax'].indexOf(this.align) == -1,
stretchWidth = w - (this.padding.left + this.padding.right),
extraHeight = 0,
maxWidth = 0,
totalFlex = 0,
flexHeight = 0,
usedHeight = 0;
Ext.each(cs, function(c){
cm = c.margins;
totalFlex += c.flex || 0;
ch = c.getHeight();
margin = cm.top + cm.bottom;
extraHeight += ch + margin;
flexHeight += margin + (c.flex ? 0 : ch);
maxWidth = Math.max(maxWidth, c.getWidth() + cm.left + cm.right);
});
extraHeight = h - extraHeight - this.padding.top - this.padding.bottom;
var innerCtWidth = maxWidth + this.padding.left + this.padding.right;
switch(this.align){
case 'stretch':
this.innerCt.setSize(w, h);
break;
case 'stretchmax':
case 'left':
this.innerCt.setSize(innerCtWidth, h);
break;
case 'center':
this.innerCt.setSize(w = Math.max(w, innerCtWidth), h);
break;
}
var availHeight = Math.max(0, h - this.padding.top - this.padding.bottom - flexHeight),
leftOver = availHeight,
heights = [],
restore = [],
idx = 0,
availableWidth = Math.max(0, w - this.padding.left - this.padding.right);
Ext.each(cs, function(c){
if(isStart && c.flex){
ch = Math.floor(availHeight * (c.flex / totalFlex));
leftOver -= ch;
heights.push(ch);
}
});
if(this.pack == 'center'){
t += extraHeight ? extraHeight / 2 : 0;
}else if(this.pack == 'end'){
t += extraHeight;
}
Ext.each(cs, function(c){
cm = c.margins;
t += cm.top;
c.setPosition(l + cm.left, t);
if(isStart && c.flex){
ch = Math.max(0, heights[idx++] + (leftOver-- > 0 ? 1 : 0));
if(isRestore){
restore.push(c.getWidth());
}
c.setSize(availableWidth, ch);
}else{
ch = c.getHeight();
}
t += ch + cm.bottom;
});
idx = 0;
Ext.each(cs, function(c){
cm = c.margins;
if(this.align == 'stretch'){
c.setWidth((stretchWidth - (cm.left + cm.right)).constrain(
c.minWidth || 0, c.maxWidth || 1000000));
}else if(this.align == 'stretchmax'){
c.setWidth((maxWidth - (cm.left + cm.right)).constrain(
c.minWidth || 0, c.maxWidth || 1000000));
}else{
if(this.align == 'center'){
var diff = availableWidth - (c.getWidth() + cm.left + cm.right);
if(diff > 0){
c.setPosition(l + cm.left + (diff/2), c.y);
}
}
if(isStart && c.flex){
c.setWidth(restore[idx++]);
}
}
}, this);
}
});

evant
23 Aug 2009, 6:09 PM
Thanks, fixed in SVN.