docs/source/AbsoluteLayout.html

   1 <html>\r
   2 <head>\r
   3   <title>The source code</title>\r
   4     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
   5     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
   6 </head>\r
   7 <body  onload="prettyPrint();">\r
   8     <pre class="prettyprint lang-js"><div id="cls-Ext.layout.AbsoluteLayout"></div>/**\r
   9  * @class Ext.layout.AbsoluteLayout\r
  10  * @extends Ext.layout.AnchorLayout\r
  11  * <p>This is a layout that inherits the anchoring of <b>{@link Ext.layout.AnchorLayout}</b> and adds the\r
  12  * ability for x/y positioning using the standard x and y component config options.</p>\r
  13  * <p>This class is intended to be extended or created via the <tt><b>{@link Ext.Container#layout layout}</b></tt>\r
  14  * configuration property.  See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>\r
  15  * <p>Example usage:</p>\r
  16  * <pre><code>\r
  17 var form = new Ext.form.FormPanel({\r
  18     title: 'Absolute Layout',\r
  19     layout:'absolute',\r
  20     layoutConfig: {\r
  21         // layout-specific configs go here\r
  22         extraCls: 'x-abs-layout-item',\r
  23     },\r
  24     baseCls: 'x-plain',\r
  25     url:'save-form.php',\r
  26     defaultType: 'textfield',\r
  27     items: [{\r
  28         x: 0,\r
  29         y: 5,\r
  30         xtype:'label',\r
  31         text: 'Send To:'\r
  32     },{\r
  33         x: 60,\r
  34         y: 0,\r
  35         name: 'to',\r
  36         anchor:'100%'  // anchor width by percentage\r
  37     },{\r
  38         x: 0,\r
  39         y: 35,\r
  40         xtype:'label',\r
  41         text: 'Subject:'\r
  42     },{\r
  43         x: 60,\r
  44         y: 30,\r
  45         name: 'subject',\r
  46         anchor: '100%'  // anchor width by percentage\r
  47     },{\r
  48         x:0,\r
  49         y: 60,\r
  50         xtype: 'textarea',\r
  51         name: 'msg',\r
  52         anchor: '100% 100%'  // anchor width and height\r
  53     }]\r
  54 });\r
  55 </code></pre>\r
  56  */\r
  57 Ext.layout.AbsoluteLayout = Ext.extend(Ext.layout.AnchorLayout, {\r
  58 \r
  59     extraCls: 'x-abs-layout-item',\r
  60 \r
  61     onLayout : function(ct, target){\r
  62         target.position();\r
  63         this.paddingLeft = target.getPadding('l');\r
  64         this.paddingTop = target.getPadding('t');\r
  65 \r
  66         Ext.layout.AbsoluteLayout.superclass.onLayout.call(this, ct, target);\r
  67     },\r
  68 \r
  69     // private\r
  70     adjustWidthAnchor : function(value, comp){\r
  71         return value ? value - comp.getPosition(true)[0] + this.paddingLeft : value;\r
  72     },\r
  73 \r
  74     // private\r
  75     adjustHeightAnchor : function(value, comp){\r
  76         return  value ? value - comp.getPosition(true)[1] + this.paddingTop : value;\r
  77     }\r
  78     <div id="prop-Ext.layout.AbsoluteLayout-activeItem"></div>/**\r
  79      * @property activeItem\r
  80      * @hide\r
  81      */\r
  82 });\r
  83 Ext.Container.LAYOUTS['absolute'] = Ext.layout.AbsoluteLayout;
  84 </pre>    \r
  85 </body>\r
  86 </html>