X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/c930e9176a5a85509c5b0230e2bff5c22a591432..2e847cf21b8ab9d15fa167b315ca5b2fa92638fc:/docs/source/ColumnLayout.html
diff --git a/docs/source/ColumnLayout.html b/docs/source/ColumnLayout.html
index 5c2ca15f..13308f58 100644
--- a/docs/source/ColumnLayout.html
+++ b/docs/source/ColumnLayout.html
@@ -1,5 +1,6 @@
+
The source code
@@ -34,7 +35,7 @@ var p = new Ext.Panel({
layout:'column',
items: [{
title: 'Column 1',
- columnWidth: .25
+ columnWidth: .25
},{
title: 'Column 2',
columnWidth: .6
@@ -66,49 +67,66 @@ var p = new Ext.Panel({
Ext.layout.ColumnLayout = Ext.extend(Ext.layout.ContainerLayout, {
// private
monitorResize:true,
-
+
+ type: 'column',
+
extraCls: 'x-column',
scrollOffset : 0,
// private
+
+ targetCls: 'x-column-layout-ct',
+
isValidParent : function(c, target){
- return (c.getPositionEl ? c.getPositionEl() : c.getEl()).dom.parentNode == this.innerCt.dom;
+ return this.innerCt && c.getPositionEl().dom.parentNode == this.innerCt.dom;
},
- // private
- onLayout : function(ct, target){
- var cs = ct.items.items, len = cs.length, c, i;
+ getLayoutTargetSize : function() {
+ var target = this.container.getLayoutTarget(), ret;
+ if (target) {
+ ret = target.getViewSize();
+ ret.width -= target.getPadding('lr');
+ ret.height -= target.getPadding('tb');
+ }
+ return ret;
+ },
+ renderAll : function(ct, target) {
if(!this.innerCt){
- target.addClass('x-column-layout-ct');
-
// the innerCt prevents wrapping and shuffling while
// the container is resizing
this.innerCt = target.createChild({cls:'x-column-inner'});
this.innerCt.createChild({cls:'x-clear'});
}
- this.renderAll(ct, this.innerCt);
+ Ext.layout.ColumnLayout.superclass.renderAll.call(this, ct, this.innerCt);
+ },
- var size = Ext.isIE && target.dom != Ext.getBody().dom ? target.getStyleSize() : target.getViewSize();
+ // private
+ onLayout : function(ct, target){
+ var cs = ct.items.items, len = cs.length, c, i;
+
+ this.renderAll(ct, target);
+
+ var size = this.getLayoutTargetSize();
if(size.width < 1 && size.height < 1){ // display none?
return;
}
- var w = size.width - target.getPadding('lr') - this.scrollOffset,
- h = size.height - target.getPadding('tb'),
+ var w = size.width - this.scrollOffset,
+ h = size.height,
pw = w;
this.innerCt.setWidth(w);
-
+
// some columns can be percentages while others are fixed
// so we need to make 2 passes
for(i = 0; i < len; i++){
c = cs[i];
if(!c.columnWidth){
- pw -= (c.getSize().width + c.getEl().getMargins('lr'));
+ pw -= (c.getWidth() + c.getPositionEl().getMargins('lr'));
}
}
@@ -117,11 +135,24 @@ Ext.layout.ColumnLayout = Ext.extend(Ext.layout.ContainerLayout, {
for(i = 0; i < len; i++){
c = cs[i];
if(c.columnWidth){
- c.setSize(Math.floor(c.columnWidth*pw) - c.getEl().getMargins('lr'));
+ c.setSize(Math.floor(c.columnWidth * pw) - c.getPositionEl().getMargins('lr'));
}
}
+
+ // Browsers differ as to when they account for scrollbars. We need to re-measure to see if the scrollbar
+ // spaces were accounted for properly. If not, re-layout.
+ if (Ext.isIE) {
+ if (i = target.getStyle('overflow') && i != 'hidden' && !this.adjustmentPass) {
+ var ts = this.getLayoutTargetSize();
+ if (ts.width != size.width){
+ this.adjustmentPass = true;
+ this.onLayout(ct, target);
+ }
+ }
+ }
+ delete this.adjustmentPass;
}
-
+
/**
* @property activeItem
* @hide