Upgrade to ExtJS 3.0.0 - Released 07/06/2009
[extjs.git] / src / widgets / layout / AbsoluteLayout.js
diff --git a/src/widgets/layout/AbsoluteLayout.js b/src/widgets/layout/AbsoluteLayout.js
new file mode 100644 (file)
index 0000000..2490977
--- /dev/null
@@ -0,0 +1,82 @@
+/*!
+ * Ext JS Library 3.0.0
+ * Copyright(c) 2006-2009 Ext JS, LLC
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+/**\r
+ * @class Ext.layout.AbsoluteLayout\r
+ * @extends Ext.layout.AnchorLayout\r
+ * <p>This is a layout that inherits the anchoring of <b>{@link Ext.layout.AnchorLayout}</b> and adds the\r
+ * ability for x/y positioning using the standard x and y component config options.</p>\r
+ * <p>This class is intended to be extended or created via the <tt><b>{@link Ext.Container#layout layout}</b></tt>\r
+ * configuration property.  See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>\r
+ * <p>Example usage:</p>\r
+ * <pre><code>\r
+var form = new Ext.form.FormPanel({\r
+    title: 'Absolute Layout',\r
+    layout:'absolute',\r
+    layoutConfig: {\r
+        // layout-specific configs go here\r
+        extraCls: 'x-abs-layout-item',\r
+    },\r
+    baseCls: 'x-plain',\r
+    url:'save-form.php',\r
+    defaultType: 'textfield',\r
+    items: [{\r
+        x: 0,\r
+        y: 5,\r
+        xtype:'label',\r
+        text: 'Send To:'\r
+    },{\r
+        x: 60,\r
+        y: 0,\r
+        name: 'to',\r
+        anchor:'100%'  // anchor width by percentage\r
+    },{\r
+        x: 0,\r
+        y: 35,\r
+        xtype:'label',\r
+        text: 'Subject:'\r
+    },{\r
+        x: 60,\r
+        y: 30,\r
+        name: 'subject',\r
+        anchor: '100%'  // anchor width by percentage\r
+    },{\r
+        x:0,\r
+        y: 60,\r
+        xtype: 'textarea',\r
+        name: 'msg',\r
+        anchor: '100% 100%'  // anchor width and height\r
+    }]\r
+});\r
+</code></pre>\r
+ */\r
+Ext.layout.AbsoluteLayout = Ext.extend(Ext.layout.AnchorLayout, {\r
+\r
+    extraCls: 'x-abs-layout-item',\r
+\r
+    onLayout : function(ct, target){\r
+        target.position();\r
+        this.paddingLeft = target.getPadding('l');\r
+        this.paddingTop = target.getPadding('t');\r
+\r
+        Ext.layout.AbsoluteLayout.superclass.onLayout.call(this, ct, target);\r
+    },\r
+\r
+    // private\r
+    adjustWidthAnchor : function(value, comp){\r
+        return value ? value - comp.getPosition(true)[0] + this.paddingLeft : value;\r
+    },\r
+\r
+    // private\r
+    adjustHeightAnchor : function(value, comp){\r
+        return  value ? value - comp.getPosition(true)[1] + this.paddingTop : value;\r
+    }\r
+    /**\r
+     * @property activeItem\r
+     * @hide\r
+     */\r
+});\r
+Ext.Container.LAYOUTS['absolute'] = Ext.layout.AbsoluteLayout;