X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/c930e9176a5a85509c5b0230e2bff5c22a591432..6b044c28b5f26fb99c86c237ffad19741c0f7f3d:/docs/source/BoxComponent.html diff --git a/docs/source/BoxComponent.html b/docs/source/BoxComponent.html index be108970..a0e59ae7 100644 --- a/docs/source/BoxComponent.html +++ b/docs/source/BoxComponent.html @@ -1,11 +1,18 @@ - -
-/** + + + +The source code + + + + +/*! + * Ext JS Library 3.3.1 + * Copyright(c) 2006-2010 Sencha Inc. + * licensing@sencha.com + * http://www.sencha.com/license + */ +/** * @class Ext.BoxComponent * @extends Ext.Component **/ + /** + * @cfg {Boolean} autoScroll + *Base class for any {@link Ext.Component Component} that is to be sized as a box, using width and height.
@@ -35,6 +42,34 @@ var myImage = new Ext.BoxComponent({ */ Ext.BoxComponent = Ext.extend(Ext.Component, { + // Configs below are used for all Components when rendered by BoxLayout. + /** + * @cfg {Number} flex + *Note: this config is only used when this Component is rendered + * by a Container which has been configured to use a {@link Ext.layout.BoxLayout BoxLayout}. + * Each child Component with a
+ *flex
property will be flexed either vertically (by a VBoxLayout) + * or horizontally (by an HBoxLayout) according to the item's relativeflex
value + * compared to the sum of all Components withflex value specified. Any child items that have + * either a
flex = 0
orflex = undefined
will not be 'flexed' (the initial size will not be changed). + */ + // Configs below are used for all Components when rendered by AnchorLayout. + /** + * @cfg {String} anchorNote: this config is only used when this Component is rendered + * by a Container which has been configured to use an {@link Ext.layout.AnchorLayout AnchorLayout} (or subclass thereof). + * based layout manager, for example:
+ *
- {@link Ext.form.FormPanel}
+ *- specifying
+ *layout: 'anchor' // or 'form', or 'absolute'
See {@link Ext.layout.AnchorLayout}.{@link Ext.layout.AnchorLayout#anchor anchor} also.
+ */ + // tabTip config is used when a BoxComponent is a child of a TabPanel + /** + * @cfg {String} tabTip + *Note: this config is only used when this BoxComponent is a child item of a TabPanel.
+ * A string to be used as innerHTML (html tags are accepted) to show in a tooltip when mousing over + * the associated tab selector element. {@link Ext.QuickTips}.init() + * must be called in order for the tips to render. + */ // Configs below are used for all Components when rendered by BorderLayout. /** * @cfg {String} regionNote: this config is only used when this BoxComponent is rendered @@ -95,6 +130,26 @@ Ext.BoxComponent = Ext.extend(Ext.Component, { * The width of this component in pixels (defaults to auto). * Note to express this dimension as a percentage or offset see {@link Ext.Component#anchor}. */ +
/** + * @cfg {Number} boxMinHeight + *The minimum value in pixels which this BoxComponent will set its height to.
+ *Warning: This will override any size management applied by layout managers.
+ */ + /** + * @cfg {Number} boxMinWidth + *The minimum value in pixels which this BoxComponent will set its width to.
+ *Warning: This will override any size management applied by layout managers.
+ */ + /** + * @cfg {Number} boxMaxHeight + *The maximum value in pixels which this BoxComponent will set its height to.
+ *Warning: This will override any size management applied by layout managers.
+ */ + /** + * @cfg {Number} boxMaxWidth + *The maximum value in pixels which this BoxComponent will set its width to.
+ *Warning: This will override any size management applied by layout managers.
+ */ /** * @cfg {Boolean} autoHeight *True to use height:'auto', false to use fixed height (or allow it to be managed by its parent @@ -169,6 +224,11 @@ var myPanel = new Ext.Panel({ });
true
to use overflow:'auto' on the components layout element and show scroll bars automatically when + * necessary,false
to clip any overflowing content (defaults tofalse
). + */ /* // private internal config * {Boolean} deferHeight @@ -224,14 +284,27 @@ var myPanel = new Ext.Panel({ * @return {Ext.BoxComponent} this */ setSize : function(w, h){ + // support for standard size objects if(typeof w == 'object'){ h = w.height; w = w.width; } + if (Ext.isDefined(w) && Ext.isDefined(this.boxMinWidth) && (w < this.boxMinWidth)) { + w = this.boxMinWidth; + } + if (Ext.isDefined(h) && Ext.isDefined(this.boxMinHeight) && (h < this.boxMinHeight)) { + h = this.boxMinHeight; + } + if (Ext.isDefined(w) && Ext.isDefined(this.boxMaxWidth) && (w > this.boxMaxWidth)) { + w = this.boxMaxWidth; + } + if (Ext.isDefined(h) && Ext.isDefined(this.boxMaxHeight) && (h > this.boxMaxHeight)) { + h = this.boxMaxHeight; + } // not rendered if(!this.boxReady){ - this.width = w; + this.width = w; this.height = h; return this; } @@ -241,10 +314,12 @@ var myPanel = new Ext.Panel({ return this; } this.lastSize = {width: w, height: h}; - var adj = this.adjustSize(w, h); - var aw = adj.width, ah = adj.height; + var adj = this.adjustSize(w, h), + aw = adj.width, + ah = adj.height, + rz; if(aw !== undefined || ah !== undefined){ // this code is nasty but performs better with floaters - var rz = this.getResizeEl(); + rz = this.getResizeEl(); if(!this.deferHeight && aw !== undefined && ah !== undefined){ rz.setSize(aw, ah); }else if(!this.deferHeight && ah !== undefined){ @@ -260,8 +335,8 @@ var myPanel = new Ext.Panel({ /** * Sets the width of the component. This method fires the {@link #resize} event. - * @param {Number} width The new width to setThis may be one of:- *
- A Number specifying the new width in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit}s (by default, pixels).
+ * @param {Mixed} width The new width to set. This may be one of:* @return {Ext.BoxComponent} this @@ -272,8 +347,8 @@ var myPanel = new Ext.Panel({ /** * Sets the height of the component. This method fires the {@link #resize} event. - * @param {Number} height The new height to set. This may be one of:+ *
- A Number specifying the new width in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit defaultUnit}s (by default, pixels).
*- A String used to set the CSS width style.
*- *
- A Number specifying the new height in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit}s (by default, pixels).
+ * @param {Mixed} height The new height to set. This may be one of:@@ -363,14 +438,23 @@ var myPanel = new Ext.Panel({ * contains both the+ *
- A Number specifying the new height in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit defaultUnit}s (by default, pixels).
*- A String used to set the CSS height style.
*- undefined to leave the height unchanged.
*<input>
Element (which is what would be returned * by its{@link #getEl}
method, and the trigger button Element. * This Element is returned as theresizeEl
. + * @return {Ext.Element} The Element which is to be resized by size managing layouts. */ getResizeEl : function(){ return this.resizeEl || this.el; }, - // protected - getPositionEl : function(){ - return this.positionEl || this.el; + /** + * Sets the overflow on the content element of the component. + * @param {Boolean} scroll True to allow the Component to auto scroll. + * @return {Ext.BoxComponent} this + */ + setAutoScroll : function(scroll){ + if(this.rendered){ + this.getContentTarget().setOverflow(scroll ? 'auto' : ''); + } + this.autoScroll = scroll; + return this; }, /** @@ -434,20 +518,16 @@ var myPanel = new Ext.Panel({ }, // private - onRender : function(ct, position){ - Ext.BoxComponent.superclass.onRender.call(this, ct, position); + afterRender : function(){ + Ext.BoxComponent.superclass.afterRender.call(this); if(this.resizeEl){ this.resizeEl = Ext.get(this.resizeEl); } if(this.positionEl){ this.positionEl = Ext.get(this.positionEl); } - }, - - // private - afterRender : function(){ - Ext.BoxComponent.superclass.afterRender.call(this); this.boxReady = true; + Ext.isDefined(this.autoScroll) && this.setAutoScroll(this.autoScroll); this.setSize(this.width, this.height); if(this.x || this.y){ this.setPosition(this.x, this.y); @@ -475,7 +555,6 @@ var myPanel = new Ext.Panel({ * @param {Number} rawHeight The height that was originally specified */ onResize : function(adjWidth, adjHeight, rawWidth, rawHeight){ - }, /* // protected @@ -517,6 +596,6 @@ Ext.reg('box', Ext.BoxComponent); Ext.Spacer = Ext.extend(Ext.BoxComponent, { autoEl:'div' }); -Ext.reg('spacer', Ext.Spacer); - +Ext.reg('spacer', Ext.Spacer); + \ No newline at end of file