src/layout/component/field/Text.js

   1 /**
   2  * @private
   3  * @class Ext.layout.component.field.Text
   4  * @extends Ext.layout.component.field.Field
   5  * Layout class for {@link Ext.form.field.Text} fields. Handles sizing the input field.
   6  */
   7 Ext.define('Ext.layout.component.field.Text', {
   8     extend: 'Ext.layout.component.field.Field',
   9     alias: 'layout.textfield',
  10     requires: ['Ext.util.TextMetrics'],
  11
  12     type: 'textfield',
  13
  14
  15     /**
  16      * Allow layout to proceed if the {@link Ext.form.field.Text#grow} config is enabled and the value has
  17      * changed since the last layout.
  18      */
  19     beforeLayout: function(width, height) {
  20         var me = this,
  21             owner = me.owner,
  22             lastValue = this.lastValue,
  23             value = owner.getRawValue();
  24         this.lastValue = value;
  25         return me.callParent(arguments) || (owner.grow && value !== lastValue);
  26     },
  27
  28
  29     /**
  30      * Size the field body contents given the total dimensions of the bodyEl, taking into account the optional
  31      * {@link Ext.form.field.Text#grow} configurations.
  32      * @param {Number} width The bodyEl width
  33      * @param {Number} height The bodyEl height
  34      */
  35     sizeBodyContents: function(width, height) {
  36         var size = this.adjustForGrow(width, height);
  37         this.setElementSize(this.owner.inputEl, size[0], size[1]);
  38     },
  39
  40
  41     /**
  42      * Given the target bodyEl dimensions, adjust them if necessary to return the correct final
  43      * size based on the text field's {@link Ext.form.field.Text#grow grow config}.
  44      * @param {Number} width The bodyEl width
  45      * @param {Number} height The bodyEl height
  46      * @return {Array} [inputElWidth, inputElHeight]
  47      */
  48     adjustForGrow: function(width, height) {
  49         var me = this,
  50             owner = me.owner,
  51             inputEl, value, calcWidth,
  52             result = [width, height];
  53
  54         if (owner.grow) {
  55             inputEl = owner.inputEl;
  56
  57             // Find the width that contains the whole text value
  58             value = (inputEl.dom.value || (owner.hasFocus ? '' : owner.emptyText) || '') + owner.growAppend;
  59             calcWidth = inputEl.getTextWidth(value) + inputEl.getBorderWidth("lr") + inputEl.getPadding("lr");
  60
  61             // Constrain
  62             result[0] = Ext.Number.constrain(calcWidth, owner.growMin,
  63                     Math.max(owner.growMin, Math.min(owner.growMax, Ext.isNumber(width) ? width : Infinity)));
  64         }
  65
  66         return result;
  67     }
  68
  69 });